63 lines
1.9 KiB
Markdown
63 lines
1.9 KiB
Markdown
# MERN Stack Template
|
|
|
|
<img src='https://github.com/belferink1996/MERN-template/blob/images/images/mern.jpeg' alt='MERN banner' width='700' />
|
|
|
|
- **M** = [MongoDB](https://www.mongodb.com)
|
|
- **E** = [Express.js](https://expressjs.com)
|
|
- **R** = [React.js](https://reactjs.org)
|
|
- **N** = [Node.js](https://nodejs.org)
|
|
|
|
<br />
|
|
<br />
|
|
|
|
# How to use this template
|
|
|
|
[📀 Demo video](https://youtu.be/N2pvvkyoS68)
|
|
|
|
### STEP 1:
|
|
|
|
Click ["Use this template"](https://github.com/belferink1996/MERN-template/generate) to generate a
|
|
new repository.<br /> Then open your terminal and clone your repository:
|
|
|
|
> cd ~/Desktop <br /> git clone https://github.com/[your-user-name]/[your-repo-name].git
|
|
|
|
<br />
|
|
|
|
### STEP 2:
|
|
|
|
Go to your repository's folder, and install all dependecies:
|
|
|
|
> cd ~/Desktop/[your-repo-name]<br /> npm install
|
|
|
|
<br />
|
|
|
|
### STEP 3:
|
|
|
|
Prepare your MongoDB database ([atlas](https://www.mongodb.com/cloud/atlas),
|
|
[community](<https://github.com/belferink1996/MERN-template/wiki/Install-MongoDB-Community-Server-(MacOS)>)).<br />
|
|
Then go to your server folder (backend), and set your database within `server.js`,
|
|
|
|
<br />
|
|
|
|
### STEP 4: CODE !!!
|
|
|
|
<br />
|
|
<br />
|
|
|
|
# Node dependecies & versions:
|
|
|
|
###### Client:
|
|
|
|
> axios: ^0.21.1 ---> Use the API<br /> react: ^17.0.1
|
|
> ---> UI framework<br /> react-dom: ^17.0.1
|
|
> ---> UI framework<br /> react-scripts: ^4.0.1
|
|
> ---> Quickly launch local service
|
|
|
|
###### Server:
|
|
|
|
> cors: ^2.8.5 ---> Enable HTTP requests<br/> dotenv: ^8.2.0
|
|
> ---> Secure sensitive information<br /> express: ^4.17.1
|
|
> ---> Server app<br /> mongoose: ^5.11.14
|
|
> ---> MongoDB database<br /> morgan: ^1.10.0 --->
|
|
> Logs requests
|