Blog App with React and Node

The objective of this app project is to give a simple example on how to create a React App that uses Contex and Hooks on the front end and receive data via a simple REST API built with NodeJS on the back-end.

Requirements

Node.js >= 12
React.js >=16

Check the ./package.json file and the ./client/package.json file for more details.

Development Environment Configuration

This project is configured in a way that you can use either the React App and the NodeJS app running in independent servers, or both apps running at the same time in the same server.

To get started:

Clone the repository.
install all the NodeJS dependencies
Execute npm install from the root folder.
Install all the React App dependencies
Execute npm install from ./client folder.
Create the production bundle
Run npm run build from ./client to build the production webpack bundle if you want to try it locally.
Execute the project
Execute nodemoon server from the root.

Running the React App Only

Execute npm start from ./client to get up an running the React App only.

This is useful if you want to play with the front-end and do not need to interact with the back-end API for development purposes. API calls will fail when running the React APP server only.

Running the NodeJS App Only

Execute steps 1, 2 and 5 from above, and the server API in NodeJS will be up and running. You can test it using curl, Postman, or any other tool to test the end point /api/articles.

Running the React App and NodeJS App from the same server

Execute the project nodemoon server from the root. This is how the current project is configure to run in production enviroment. You will have the React and NodeJS apps up and running.

Access from a browser http://localhost:8080.

To execute the React App suite tests run the following command from ./client

$ npm test

Contribution

To contribute create a pull request with the changes you think might be included.

Commits should be in english and capitalized. They should start with a verb, and the first line should not be greater than 50 characters. The message in the commit body should not be greater than 70 characters. Eg:

Add api test

api.test.js include the mocking of the API call from React using axios,  to test the state being passed to Context. Closes #77.

Use lowercase and (-) to separate words when naming your branches. Dont use more than 3 words.

You can check a live version of this project at www.nayibabdala.com . Happy coding!

License

MIT

Special thanks