Architecture and setup: Difference between revisions
Line 29: | Line 29: | ||
</pre> | </pre> | ||
One of the most agreed upon structure for a React project is to have a < | One of the most agreed upon structure for a React project is to have a <pre>components</pre> directory for storing your Components. |
Revision as of 20:17, 21 July 2019
Introduction
This project is about creating a new front-end for Expertiza, which is a RoR MVC application, by separating the view from the MVC architecture. For separating the view, the existing RoR application needs to be modified by creating APIs that will help the new front-end interact with the back-end. These APIs will render JSON objects instead of views, that are rendered in the original application, thereby creating RESTful services that will enable the new front-end to procure information. ReactJS is used for creating the new front-end, with Redux used for state maintenance. For HTTP requests to the back-services, axios, a promise based HTTP client is used.
Setup
React Application
The React application is created following https://github.com/facebook/create-react-app. This will create a structure like the one shown below,
my-app ├── README.md ├── node_modules ├── package.json ├── .gitignore ├── public │ ├── favicon.ico │ ├── index.html │ └── manifest.json └── src ├── App.css ├── App.js ├── App.test.js ├── index.css ├── index.js ├── logo.svg └── serviceWorker.js
One of the most agreed upon structure for a React project is to have a
components
directory for storing your Components.