Folder Structure
Hi readers,
In this post, I wanted to give insight about the folder structure of a ReactJs App. I wanted to create separate post the so you can get insight in a gradual way. Again, I try not to be lengthy on the steps, but get right to the info. Hope you enjoy!
Folder Structure Breakdown
package.json: Includes the dependencies and the scripts used to create a project.
package-lock.json: Ensure the installation of the dependencies.
.gitignore & readme: Don't worry about these files.
node_modules: All the dependencies are installed in the folder. It's generated when you run the "create-react-app" command.
-
public folder
- manifest.json: Used for Progressive Web Apps (PWA's)
- favicon.ico: Nothing specific, just the icon for the title.
- index.html:Typically you won't change anything in the body. Maybe the head tag but that's all. This contains the root DOM node.
-
src folder: The folder you will work with the most for the development.
- index.js: specify the 'root' element which is controlled by React.
- app.js: Responsible for showing the UI (view) within the browser.
- app.css: Used for styling the app UI.
- app.test.js: Used for testing
- index.css: applies styling to the body tag.
- logo.svg: refrenced in the app component.
- serviceWorker: used for PWA's only.
Top comments (0)