npx i-bms

Prompts : Choose between React.js or Next.js
Prompts : Set username and password for access /bms route for manage blog 

Admin Route Protection (/bms)
The /bms route is protected by a login screen with a username and password that you enter during the npx i-bms setup.

The credentials are stored in .env as:

The login system is built-in and handled by the BmsEnvProtected component

Once authenticated, admins can access the blog manage interface to manage blogs.

npx i-bms will Install required files 

Auto-generate:
BlogList.jsx
BlogList.css for blog list card styling
BlogPage.jsx
Blog.css for blog read UI styling

db.json for blog storage

npm install bms-package

-----------------------------------------------------------
In Next.js
Routing is auto-managed. Just create a page that returns the blog manager:

/bms route is the main route for admin for manage all blogs
/blog is the user side route for show all blogs for user

------------------------------------------------------------
In React.js (Vite or CRA)
1. Wrap your app with BrowserRouter (usually in main.jsx):

import { BrowserRouter } from 'react-router-dom';

<BrowserRouter>
  <App />
</BrowserRouter>

import { Routes, Route } from 'react-router-dom';
import BlogList from './pages/BlogList';
import BlogPage from './pages/BlogPage';
import { BmsEnvProtected } from 'bms-package'

function App() {
  return (
    <Routes>
        <Route path="/bms" element={<BmsEnvProtected />} />
        <Route path="/blog" element={<BlogList />} />
        <Route path="/blog/:slug" element={<BlogPage />} />
    </Routes>
  );
}

After this, you're done! The blog system is fully functional.

BlogList.jsx, BlogPage.jsx, and Blog.css are auto-generated via npx i-bms.

Use Case: How It Works
/bms: Admin panel using <CompleteBlogManager />

Add, update, and delete blogs

Auto-generates unique slugs on creation

/blog: Public blog list page (BlogList.jsx)

/blog/:slug: Public single blog page (BlogPage.jsx)


Summary
Admin-only access:
Route: /bms

Component: <CompleteBlogManager />

Public routes:
All blogs: /blog → <BlogList />

Single blog by slug: /blog/:slug → <BlogPage />

Slugs are auto-generated when the admin adds a blog.

Author
Gunjan Kumbhani

🪪 License
MIT License

Pro Tips
The CSS file (Blog.css  and BlogList.css) is customizable for branding.

All blog logic (create, update, delete) is handled internally.

🛠 Built With
React.js / Next.js
Vite
JSON Server
Concurrently