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

!MERN CRUD Screenshot

Support

Instructions

Fork, then download or clone the repo.

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

Back-end

Install the dependencies via the terminal.

npm install

Create a .env.local file with values like:

DB=mongodb://localhost/mern-crud
PORT=3000
CORS=1

Run the server.

node server

View

Front-end

cd react-src

Install the dependencies required by React.

npm install

Create a .env.local file with values like:

REACT_APP_API_URL=http://localhost:3000

Run the development server for React.

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

To Do

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

License