mern-crud

A simple records system using MongoDB, Express.js, React.js, and Node.js with real-time CRUD operations using Socket.io

MIT License

Stars
731

MERN CRUD

A simple records system using MongoDB, Express.js, React.js, and Node.js with real-time Create, Read, Update, and Delete operations using Socket.io.

REST API was implemented on the back-end. Semantic UI React was used for the UI in the front-end.

Demo: https://mern-crud-mpfr.onrender.com

Support

Instructions

Fork, then download or clone the repo.

git clone https://github.com/<your-user-name>/mern-crud.git

The config folder contains a file named db.js. Before running locally, change the value of db as seen in the code below. Make sure MongoDB service is running.

module.exports = {
  db: 'mongodb://localhost/mern-crud'
};

Back-end

Install the dependencies via the terminal.

npm install

Run the main server.

CORS=1 node server

View http://localhost:3000 on the browser.

Front-end

If you want to modify the front-end, go to react-src folder via the terminal.

cd react-src

Install the dependencies required by React.

npm install

Run the development server for React.

REACT_APP_API_URL=http://localhost:3000 npm start

View http://localhost:4200 on the browser.

To make a production build, simply run on react-src folder via the terminal.

npm run build

It re-creates a folder named public on the root directory. This is where the production-ready front-end of the web application resides.

Docker

docker-compose up

Contribute

Feel free to help out as I may have other work/life commitments. See CONTRIBUTING.md.

To Do

  • Create
  • Read
  • Update
  • Delete
  • Real-time broadcast using Socket.io
  • Deploy in Heroku
  • Front-end validation (HTML)

License

MERN CRUD is available under the MIT license. See the LICENSE file for more info.

Badges
Extracted from project README
Follow on GitHub GitHub Stars GitHub Forks GitHub Watchers
Related Projects