🥷 create-mern-blink

A zero-config CLI tool to scaffold a full MERN stack project in JavaScript or TypeScript, complete with backend authentication and a modern frontend setup — all in one command.

With create-mern-blink, you can start coding immediately without manual configuration.

✨ Features

Backend

• Express + MongoDB setup ready
• JWT & bcrypt for authentication
• dotenv preconfigured
• nodemon for development
• Complete folder structure: routes/, models/, controllers/, middleware/
• Option to use JavaScript or TypeScript

Frontend

• Vite + React scaffold
• TailwindCSS + DaisyUI preconfigured
• React Router DOM for client-side routing
• Lucide React + React Icons ready to use
• Option to use JavaScript or TypeScript

CLI

• Interactive prompts for frontend & backend language selection
• One-command project generation
• Preconfigured folder structure and starter code

📦 Installation

You can run it without global installation using bunx or npx:

bunx create-mern-blink myapp

or

npx create-mern-blink myapp

⚙️ Options

| Command | Description | | ----------------------------------- | ------------------------------- | | bunx create-mern-blink myapp | Create MERN app with JavaScript | | bunx create-mern-blink myapp --ts | Create MERN app with TypeScript |

🚦 Getting Started

1️⃣ Backend

cd myapp/backend
bun run server.js      # for JS
# or
bun run server.ts      # for TS

Backend runs on: http://localhost:5000

2️⃣ Frontend

cd myapp/frontend
bun dev

Frontend runs on: http://localhost:5173

📂 Project Structure

myapp/
│
├── backend/
│   ├── server.(js|ts)
│   ├── package.json
│   ├── tsconfig.json     # if TypeScript
│   ├── .env
│   ├── routes/
│   ├── models/
│   ├── controllers/
│   └── middleware/
│
├── frontend/
│   ├── index.html
│   ├── package.json
│   ├── tsconfig.json     # if TypeScript
│   ├── src/
│   │   ├── App.(jsx|tsx)
│   │   └── index.css
│   └── tailwind.config.js
│
└── README.md

🛠️ Backend Example

server.js / server.ts

import express from "express";
import mongoose from "mongoose";
import dotenv from "dotenv";
import cors from "cors";
import bcrypt from "bcrypt";
import jwt from "jsonwebtoken";

dotenv.config();
const app = express();

app.use(cors());
app.use(express.json());

app.get("/", (req, res) => {
  res.send("🚀 Backend is running...");
});

mongoose.connect(process.env.MONGO_URI)
  .then(() => console.log("✅ MongoDB connected"))
  .catch(err => console.error("❌ MongoDB error:", err));

const PORT = process.env.PORT || 5000;
app.listen(PORT, () => console.log(`⚡ Server running on port ${PORT}`));

🎨 Frontend Example

App.jsx / App.tsx

import { BrowserRouter, Routes, Route, Link } from "react-router-dom";
import { Home } from "lucide-react";

function HomePage() {
  return <h1 className="text-2xl font-bold text-center mt-10">🚀 Welcome to MERN stack App</h1>;
}

export default function App() {
  return (
    <BrowserRouter>
      <nav className="p-4 bg-base-200 flex gap-4">
        <Link to="/">Home</Link>
        <Home size={20} />
      </nav>
      <Routes>
        <Route path="/" element={<HomePage />} />
      </Routes>
    </BrowserRouter>
  );
}

🤝 Contributing

Contributions, issues, and feature requests are welcome! Please open an issue or submit a PR to help improve this tool.

📜 License

MIT © 2025 Safeer Ullah Khan

🔥 Build full-blink JS/TS MERN apps with authentication, Tailwind, DaisyUI, React Router, and icons — all ready to code in seconds!