@mucyuneje/create-dev

Scaffold a full-stack MERN application with authentication, CRUD, reports, payroll, and responsive UI. Customizable for any exam/project scenario via opencode.

Quick Start

npx @mucyuneje/create-dev my-project
cd my-project

Then start two terminals:

# Terminal 1 — Backend
cd backend-project && npm run dev

# Terminal 2 — Frontend
cd frontend-project && npm run dev

Open http://localhost:3000.

Customize for Your Scenario

After scaffolding, transform the generic template into your specific application:

opencode -p "DAB Enterprise LTD needs an HRMS to manage employees..."

The scenario modifier will:

• Rename all entities, fields, and labels to match your scenario
• Add/remove entities and fields as needed
• Configure auth (JWT or session-based login)
• Randomize colors, layout, and visual style (anti-plagiarism)
• Generate specific reports and features
• Verify the build compiles with 0 errors

See prompts/scenario-modifier.md for detailed instructions.

What's Included

| Feature | Stack | |---------|-------| | Frontend | React 19, Vite, Tailwind v4, shadcn/ui | | Backend | Express 5, Mongoose, JWT + Session auth | | Database | MongoDB (via Mongoose ODM) | | Forms | React Hook Form + Zod validation | | Reports | Daily/Weekly/Monthly overviews | | Export | CSV + PDF with custom styling | | Payroll | Employee salary management | | Layout | Responsive, collapsible sidebar, dark mode |

Project Structure

my-project/
├── backend-project/
│   ├── controllers/      # Route handlers
│   ├── middlewares/       # Auth (JWT + session), protect
│   ├── models/            # Mongoose schemas
│   ├── routes/            # Express route definitions
│   ├── config/            # Database connection
│   └── server.js          # Entry point
├── frontend-project/
│   ├── src/
│   │   ├── components/    # Reusable UI components (shadcn/ui)
│   │   ├── config/        # App configuration
│   │   ├── context/       # Auth context
│   │   ├── lib/           # API client, helpers
│   │   └── pages/         # Page components
│   └── package.json
├── prompts/
│   └── scenario-modifier.md  # opencode prompt for customization
├── scenario.config.js        # Master configuration
└── package.json

Configuration

Edit frontend-project/src/config/app.config.js:

const COLOR            = "green"    // green | blue | purple | orange | red | teal | slate | rose
const SIDEBAR_POSITION = "left"     // left | right | top | bottom
const SIDEBAR_COLLAPSIBLE = true    // true | false
const SIDEBAR_DEFAULT_OPEN = true   // true | false
const STYLE_PACK       = "A"        // A (bordered) | B (striped) | C (minimal) | D (accent)
const AUTH_TYPE        = "jwt"       // "jwt" | "session"

License

MIT