- .gitignore file is a text file that tells Git which files or folders to ignore in a project.
- package.json is a JSON file that holds metadata relevant to the project and it is used for managing the project’s dependencies, scripts, version. This file is basically used to give information to npm that allows it to identify the project as well as handle the project’s dependencies.
- package-lock. json is automatically generated for any operations where npm modifies either the node_modules tree or package.json. It helps while a team is working on private apps to ensure that they are working on the same version of dependencies and sub-dependencies. It also maintains a history of changes done in package.json so, that at any point of time, when required previous changes can be looked back in the package-lock.json file.
- node_modules contains all dependencies and sub-dependencies specified in package.json used by React app.
- public — This folder contains files that don’t require any additional processing by webpack. The index.html file is considered as an entry point for the web application. In the HTML file you can import libraries such as CSS libraries and add meta tags.
- src — This folder is the main folder of React application as it contains JavaScript which needs to be processed by webpack. In this folder, you make your components, and then you can import them in app.js. Lastly, src contains registerServiceWorker.js which takes care of caching and updating files for the end-user. It helps in offline capability and faster page loading after the first visit.
In this article, we have learned to create a React application using create-react-app and its folder structure. Did this article help you understand the files and folders that come with create-react-app? Let me know in the comments section.
Happy React coding….
