Learn about the files and folder structure when a new Expo project is created.
When you create a new Expo project, a few files and folders are provided by default. This page lists out the essential files and folders that are necessary for you to understand when developing your app.
The App.js file is the default screen of your project. It is the root file that loads after running the development server with
npx expo start. You can edit this file to see the project update instantly. Generally, this file will contain root-level React Contexts and navigation.
Expo Router is now available and supports file-based navigation in projects. With Expo Router, the root file (App.js) will become index.js, and all the screens in the project will be in the app folder.
The app.json file contains configuration options for the project. These options change the behavior of your project while developing, in addition to while building, submitting, and updating our app.
Install our VS Code Expo Tools extension to get intellisense.
The assets folder contains adaptive-icon.png used for Android and an icon.png used for iOS as an app icon. It also contains splash.png which is an image for the project's splash screen and a favicon.png if the app runs in a browser.
The assets directory is not special-cased, and our project can have images and other assets placed anywhere in our project structure.
The standard files listed below are part of every project created with Expo CLI. You can edit them to customize your project.
A .gitignore allows you to list files and folders that you don't want to be tracked by Git. You can modify the files to list other files and folders in your project. Generally, the default list is sufficient for most projects.
babel-preset-expo preset that extends the default React Native preset and adds support for decorators, tree-shaking web packages, and loading font icons with optional native dependencies if they're installed. You can also modify this file to add additional Babel plugins or presets.
The package.json file contains the project's dependencies, scripts and metadata. Anytime a new dependency is added to your project, it will be added to this file.
You can also modify the
scripts to add or remove them. Four default scripts are provided to trigger the development server of your project such as
expo start --android,
expo start --ios, and
expo start --web.