Kickstart your next MERN stack application with this sleek and efficient boilerplate. Designed for quick development and scalability, this template provides a solid foundation to turn your creative ideas into functional web applications.
- Features
- Installation
- Environmental Variables
- Usage
- Deployment
- Project Structure
- Contributing
- License
- Express.js for the backend server.
- MongoDB with Mongoose for database operations.
- React for the frontend.
- Node.js environment setup.
- JWT for authentication.
- Environment variable management.
-
Clone the repository
git clone https://github.com/Jagjit0306/MERN-Template.git cd MERN-Template
-
Install dependencies for the server and client
cd server npm install cd client npm install
You need to create .env
files for both the server and the client to configure your environment variables.
Location: ./server/.env
SERVER_PORT
: Port number for the server (e.g., 5000).ACCESS_TOKEN_SECRET
: Secret key for access token generation.REFRESH_TOKEN_SECRET
: Secret key for refresh token generation.FRONTEND_URL
: URL of the frontend application (e.g., http://localhost:3000).DATABASE1_KEY
: MongoDB connection string.
Example:
SERVER_PORT=5000
ACCESS_TOKEN_SECRET=youraccesstokensecret
REFRESH_TOKEN_SECRET=yourrefreshtokensecret
FRONTEND_URL=http://localhost:3000
DATABASE1_KEY=yourmongodbconnectionstring
Location: ./server/client/.env
REACT_APP_BACKEND_URL
: URL of the backend server (e.g., http://localhost:5000).
Example:
REACT_APP_BACKEND_URL=http://localhost:5000
-
Start the server
cd server npm run dev
-
Start the client
cd server/client npm start
-
Open your browser
Navigate to
http://localhost:3000
to see your application in action.
For deployment, follow these steps:
-
Set
/server
as the root directory -
Use
npm run build
as the build command -
Use
npm run start
as the start command -
Set environment variables:
REACT_APP_BACKEND_URL
to the domain name of your backend server.FRONTEND_URL
to the domain name of your frontend application.
mern-app-boilerplate/
├── server/ # Express backend and React frontend
│ ├── client/ # React frontend
│ │ ├── build/
│ │ ├── node_modules/
│ │ ├── public/
│ │ ├── src/
│ │ ├── .env
│ │ ├── .gitignore
│ │ ├── package-lock.json
│ │ └── package.json
│ ├── controller/
│ ├── functions/
│ ├── models/
│ ├── node_modules/
│ ├── .env
│ ├── .gitignore
│ ├── package-lock.json
│ ├── package.json
│ ├── routes.js
│ └── server.js
├── LICENSE
├── README.md
Contributions are welcome! Please create an issue or submit a pull request for any improvements or bug fixes.
This project is licensed under the MIT License. See the LICENSE file for details.