fede/mern-template
Template
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases 3 Wiki Activity

Refactored - now includes fullstack AUTH

Browse Source
This commit is contained in:
Ben Elferink
2021-09-28 18:53:02 +03:00
parent c349907802
commit 2f40cf797c
34 changed files with 6684 additions and 695 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
README.md
View File

@@ -10,6 +10,14 @@
<br />
<br />
# What is this template?
This template allows you to quick-start your Fullstack application using the MERN stack, it has a server setup with some basic authentication, and a client ready to communicate with the backend.<br />
I have attempted to use the best practices for both ends, which should make it easy for any advanced/new developer to use, and perhaps learn from.
<br />
<br />
# How to use this template
[📀 Demo video](https://youtu.be/N2pvvkyoS68)
@@ -17,17 +25,20 @@
### 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:
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
> 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:
Go to the root of your repository's folder, and install all dependecies:
> cd ~/Desktop/[your-repo-name]<br /> npm install
> cd ~/Desktop/[your-repo-name]<br />
> npm install
<br />
@@ -35,7 +46,7 @@ Go to your repository's folder, and install all dependecies:
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`,
Then configure your database within `server/constants/index.js`, by configuring the `MONGO_URI` variable.
<br />
@@ -44,19 +55,19 @@ Then go to your server folder (backend), and set your database within `server.js
<br />
<br />
# Node dependecies & versions:
### To run the client and/or the server, you can do any of the following:
###### Client:
#### Short Method
> axios: ^0.21.1 &nbsp;&nbsp;&nbsp; ---> &nbsp;&nbsp;&nbsp; Use the API<br /> react: ^17.0.1
> &nbsp;&nbsp;&nbsp; ---> &nbsp;&nbsp;&nbsp; UI framework<br /> react-dom: ^17.0.1
> &nbsp;&nbsp;&nbsp; ---> &nbsp;&nbsp;&nbsp; UI framework<br /> react-scripts: 4.0.3
> &nbsp;&nbsp;&nbsp; ---> &nbsp;&nbsp;&nbsp; React 'npm' scripts
From the root of your project run:
> npm start
###### Server:
#### Long Method
> cors: ^2.8.5 &nbsp;&nbsp;&nbsp; ---> &nbsp;&nbsp;&nbsp; Enable HTTP requests<br/> dotenv: ^8.2.0
> &nbsp;&nbsp;&nbsp; ---> &nbsp;&nbsp;&nbsp; Secure sensitive information<br /> express: ^4.17.1
> &nbsp;&nbsp;&nbsp; ---> &nbsp;&nbsp;&nbsp; Server app<br /> mongoose: ^5.12.0 &nbsp;&nbsp;&nbsp;
> ---> &nbsp;&nbsp;&nbsp; MongoDB database<br /> morgan: ^1.10.0 &nbsp;&nbsp;&nbsp; --->
> &nbsp;&nbsp;&nbsp; Logs incoming requests
Open terminal #1 (backend)
> cd ./server<br />
> npm start
Open terminal #2 (frontend)
> cd ./client<br />
> npm start