devloperdevesh / devloperdevesh/FaultPlane
[Feat/UI]: Scaffold Next.js and Tailwind CSS Operations Dashboard Boilerplate Setup
Nobody has claimed this yet.
- Dominant language
- Go
- Stars
- 2
- Forks
- 1
- Avg merge
- 14m
- Merged PRs (30d)
- 57
Description
Problem
Currently, the core FaultPlane engine functions at the transport boundary layer, tracking connections and saving checkpoint state bit arrays natively. While our operational dashboard prototype layout runs standalone data mappings efficiently, we lack a clean, modular, and un-coupled Next.js application structure inside the source repository to let frontend contributors build out isolated terminal UI components without exposing or interfering with low-overhead backend networking Go parameters.
Proposed Solution
Scaffold a high-performance, minimalist Next.js operations boilerplate application inside an isolated /dashboard directory.
- Initialize a fresh Next.js application template engineered with complete TypeScript configuration tracks.
- Configure Tailwind CSS natively to provide microsecond styling and utility class parsing.
- Build a lightweight structural layout defining three independent, low-overhead interface frames:
- Sidebar Navigation Component: Modular layout containing links for Core Metrics, Workers Pool, and Network Ingress logs.
- Topbar/Navbar Header Component: Compact status frame displaying circuitbreaker states (
Circuit: CLOSED) and regional sandbox parameters. - Main Dashboard Panel Grid: Responsive canvas area prepared to hold asynchronous statistics charts, resource tracking blocks, and real-time streaming telemetry logging feeds.
- Ensure the clean application structure runs and builds perfectly (
npm run build) without dependency errors.
Alternatives
- Packaging a monolithic microservice frontend repository with complex external state managers, which introduces heavy framework overhead and configuration delays for open-source contributors.
Use Case
Provides open-source frontend systems engineers with a secure, production-grade sandbox directory to build responsive visualization widgets, allowing full developer onboarding velocity while keeping our backend Layer 4 proxy data routes protected.
Additional Notes
This layout must remain modular and strictly un-coupled from active network routing daemons. Please follow our contributing guidelines. Drop a comment below to get assigned!
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start at the repository root and create the isolated /dashboard application described in the issue. Define the sidebar, topbar, and responsive main dashboard panel structure with Next.js, TypeScript, and Tailwind CSS, keeping it separate from the Go networking code. Done means the dashboard structure is present and npm run build completes without dependency errors.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- next.js, tailwindcss, typescript
- Domain
- frontend, web-dev
- Issue type
- Feature
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Quiet
- Clarity
- Mostly clear
- Newbie friendliness
- 48/100