---
title: Project structure
description: Learn about the files and folder structure when a new Expo project is created.
---

import { BoxLink } from '~/ui/components/BoxLink';

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.

## App.js

The **App.js** file is the default screen of your project. It is the root file that you'll load after running the development server with `npx expo start` or `yarn 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](https://expo.github.io/router/docs) is now available and supports file-based navigation in projects. With Expo Router, the route file will become **index.js** and all the screens in the project will be in the **app** folder.

## app.json

The **app.json** file contains [configuration options](/versions/latest/config/app) 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 [Expo for VS Code](https://github.com/expo/vscode-expo) extension to get intellisense.

## assets folder

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.

## Other standard files

The standard files listed below are part of every project created with Expo CLI. You can edit them to customize your project.

### .gitignore

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.config.js

Applies the `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.

### package.json

The `package.json` file contains the project's dependencies and scripts. 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`, `expo start --android`, `expo start --ios`, and `expo start --web`.

## Next step

<BoxLink
  title="Splash screen"
  description="Splash screen is the first screen that users see when they open your app. Learn how to customize it."
  href="/develop/user-interface/splash-screen"
/>
