https://github.com/eeshaarif/contact-keeper-api-express-react
A full-stack application to keep track of your contacts (-MERN-)
https://github.com/eeshaarif/contact-keeper-api-express-react
express jwt-authentication mern mongodb nodejs react react-transition-group
Last synced: about 2 months ago
JSON representation
A full-stack application to keep track of your contacts (-MERN-)
- Host: GitHub
- URL: https://github.com/eeshaarif/contact-keeper-api-express-react
- Owner: EeshaArif
- Created: 2020-05-28T22:07:06.000Z (about 6 years ago)
- Default Branch: master
- Last Pushed: 2020-05-31T01:27:46.000Z (about 6 years ago)
- Last Synced: 2025-08-02T05:06:18.192Z (10 months ago)
- Topics: express, jwt-authentication, mern, mongodb, nodejs, react, react-transition-group
- Language: JavaScript
- Homepage:
- Size: 436 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Contact-Keeper
A MERN application that allows registered users to manage, store and edit their contacts in an efficient way.
### Execution
`npm run dev`
##### Client-Server
// used **concurrently** to run both servers
```
"scripts": {
"start": "node server.js",
"server": "nodemon server.js",
"client": "npm start --prefix client",
"clientinstall": "npm install --prefix client",
"dev": "concurrently \"npm run server\" \"npm run client\"",
"heroku-postbuild": "NPM_CONFIG_PRODUCTION=false npm install --prefic client && npm run build --prefix client"
},
```
### Tools
- MongoDB -> Cloud Database
- postman -> HTTP Client
- Express -> Backend
- React -> Frontend
- Heroku -> Deployment
## Server
### Execution
// Reloads Server after each change
`npm run server`
### Dependencies
`npm i express bcryptjs jsonwebtoken config express-validator mongoose`
### Dev Dependencies
`npm i -D nodemon concurrently`
### Initialize Package.json
`npm init -y`
### Start Server
```
const express = require("express");
const app = express();
const PORT = process.env.PORT || 5000;
app.listen(PORT, () => console.log(`Server start on port ${PORT}`));
```
`npm start server`
## Client
`npx create-react-app client`
#### package.json
`"proxy": "http://localhost:5000"`
#### Remove git
`client\rm -rf .git`
### Dependencies
`client\npm i axios react-router-dom react-transition-group`
### React-Router-Dom
```
```
`Home`
### Heroku
`npm install -g heroku`
```
// Serve static assets in production
if (process.env.NODE_ENV === "production") {
// Set Static folder
app.use(express.static("client/build"));
app.get("*", (req, res) =>
res.sendFile(path.resolve(__dirname, "client", "build", "index.html"))
);
}
```
- `heroku login`
- `heroku create`
- `git push heroku master`