|
| 1 | +This is a new [**React Native**](https://reactnative.dev) project, bootstrapped using [`@react-native-community/cli`](https://github.com/react-native-community/cli). |
| 2 | + |
| 3 | +# Getting Started |
| 4 | + |
| 5 | +>**Note**: Make sure you have completed the [React Native - Environment Setup](https://reactnative.dev/docs/environment-setup) instructions till "Creating a new application" step, before proceeding. |
| 6 | +
|
| 7 | +## Step 1: Start the Metro Server |
| 8 | + |
| 9 | +First, you will need to start **Metro**, the JavaScript _bundler_ that ships _with_ React Native. |
| 10 | + |
| 11 | +To start Metro, run the following command from the _root_ of your React Native project: |
| 12 | + |
| 13 | +```bash |
| 14 | +# using npm |
| 15 | +npm start |
| 16 | + |
| 17 | +# OR using Yarn |
| 18 | +yarn start |
| 19 | +``` |
| 20 | + |
| 21 | +## Step 2: Start your Application |
| 22 | + |
| 23 | +Let Metro Bundler run in its _own_ terminal. Open a _new_ terminal from the _root_ of your React Native project. Run the following command to start your _iOS_ app: |
| 24 | + |
| 25 | +### For iOS |
| 26 | + |
| 27 | +```bash |
| 28 | +# using npm |
| 29 | +npm run ios |
| 30 | + |
| 31 | +# OR using Yarn |
| 32 | +yarn ios |
| 33 | +``` |
| 34 | + |
| 35 | +If everything is set up _correctly_, you should see your new app running in your _iOS Simulator_ shortly provided you have set up your emulator/simulator correctly. |
| 36 | + |
| 37 | +This is one way to run your app — you can also run it directly from within Xcode. |
| 38 | + |
| 39 | +## Step 3: Modifying your App |
| 40 | + |
| 41 | +Now that you have successfully run the app, let's modify it. |
| 42 | + |
| 43 | +1. Open `App.tsx` in your text editor of choice and edit some lines. |
| 44 | +2. For **iOS**: Hit <kbd>Cmd ⌘</kbd> + <kbd>R</kbd> in your iOS Simulator to reload the app and see your changes! |
| 45 | + |
| 46 | +## Congratulations! :tada: |
| 47 | + |
| 48 | +You've successfully run and modified your React Native App. :partying_face: |
| 49 | + |
| 50 | +### Now what? |
| 51 | + |
| 52 | +- If you want to add this new React Native code to an existing application, check out the [Integration guide](https://reactnative.dev/docs/integration-with-existing-apps). |
| 53 | +- If you're curious to learn more about React Native, check out the [Introduction to React Native](https://reactnative.dev/docs/getting-started). |
| 54 | + |
| 55 | +# Troubleshooting |
| 56 | + |
| 57 | +If you can't get this to work, see the [Troubleshooting](https://reactnative.dev/docs/troubleshooting) page. |
| 58 | + |
| 59 | +# Learn More |
| 60 | + |
| 61 | +To learn more about React Native, take a look at the following resources: |
| 62 | + |
| 63 | +- [React Native Website](https://reactnative.dev) - learn more about React Native. |
| 64 | +- [Getting Started](https://reactnative.dev/docs/environment-setup) - an **overview** of React Native and how setup your environment. |
| 65 | +- [Learn the Basics](https://reactnative.dev/docs/getting-started) - a **guided tour** of the React Native **basics**. |
| 66 | +- [Blog](https://reactnative.dev/blog) - read the latest official React Native **Blog** posts. |
| 67 | +- [`@facebook/react-native`](https://github.com/facebook/react-native) - the Open Source; GitHub **repository** for React Native. |
0 commit comments