|
1 | | -This is a new [**React Native**](https://reactnative.dev) project, bootstrapped using [`@react-native-community/cli`](https://github.com/react-native-community/cli). |
| 1 | +This is a [React Native](https://reactnative.dev/) project bootstrapped with [`@react-native-community/cli`](https://github.com/react-native-community/cli/tree/main/packages/cli). |
2 | 2 |
|
3 | | -# Getting Started |
| 3 | +## Prerequisites |
4 | 4 |
|
5 | | -> **Note**: Make sure you have completed the [Set Up Your Environment](https://reactnative.dev/docs/set-up-your-environment) guide before proceeding. |
| 5 | +- A recent version of [Node.js](https://nodejs.org/en), we advise v22 or newer. |
| 6 | +- For iOS, have setup XCode and an iOS Simulator or device in Developer Mode. [See here](https://reactnative.dev/docs/set-up-your-environment). |
| 7 | +- For Android, have setup the Android SDK and either an physical or virtual Android Device. [See here](https://reactnative.dev/docs/set-up-your-environment?platform=android). |
6 | 8 |
|
7 | | -## Step 1: Start Metro |
8 | 9 |
|
9 | | -First, you will need to run **Metro**, the JavaScript build tool for React Native. |
| 10 | +## Quick Start |
| 11 | +First, install dependencies |
10 | 12 |
|
11 | | -To start the Metro dev server, run the following command from the root of your React Native project: |
12 | | - |
13 | | -```sh |
14 | | -# Using npm |
15 | | -npm start |
16 | | - |
17 | | -# OR using Yarn |
18 | | -yarn start |
| 13 | +```bash |
| 14 | +npm i |
| 15 | +cd ios |
| 16 | +pod install |
| 17 | +cd ../ |
19 | 18 | ``` |
20 | 19 |
|
21 | | -## Step 2: Build and run your app |
22 | | - |
23 | | -With Metro running, open a new terminal window/pane from the root of your React Native project, and use one of the following commands to build and run your Android or iOS app: |
24 | | - |
25 | | -### Android |
| 20 | +Then, for iOS... |
26 | 21 |
|
27 | | -```sh |
28 | | -# Using npm |
29 | | -npm run android |
30 | | - |
31 | | -# OR using Yarn |
32 | | -yarn android |
| 22 | +```bash |
| 23 | +npm run ios |
33 | 24 | ``` |
34 | 25 |
|
35 | | -### iOS |
| 26 | +Or, for Android... |
36 | 27 |
|
37 | | -For iOS, remember to install CocoaPods dependencies (this only needs to be run on first clone or after updating native deps). |
38 | | - |
39 | | -The first time you create a new project, run the Ruby bundler to install CocoaPods itself: |
40 | | - |
41 | | -```sh |
42 | | -bundle install |
| 28 | +```bash |
| 29 | +npm run android |
43 | 30 | ``` |
44 | 31 |
|
45 | | -Then, and every time you update your native dependencies, run: |
| 32 | +The app should build, install and launch on your respective device ready for development. |
46 | 33 |
|
47 | | -```sh |
48 | | -bundle exec pod install |
49 | | -``` |
| 34 | +You can now start development by modifying `App.tsx`. The App should automatically update when you save. |
50 | 35 |
|
51 | | -For more information, please visit [CocoaPods Getting Started guide](https://guides.cocoapods.org/using/getting-started.html). |
| 36 | +## Tests |
52 | 37 |
|
53 | | -```sh |
54 | | -# Using npm |
55 | | -npm run ios |
| 38 | +Run tests with: |
56 | 39 |
|
57 | | -# OR using Yarn |
58 | | -yarn ios |
| 40 | +```bash |
| 41 | +npm run test |
59 | 42 | ``` |
60 | 43 |
|
61 | | -If everything is set up correctly, you should see your new app running in the Android Emulator, iOS Simulator, or your connected device. |
62 | | - |
63 | | -This is one way to run your app — you can also build it directly from Android Studio or Xcode. |
64 | | - |
65 | | -## Step 3: Modify your app |
66 | | - |
67 | | -Now that you have successfully run the app, let's make changes! |
68 | | - |
69 | | -Open `App.tsx` in your text editor of choice and make some changes. When you save, your app will automatically update and reflect these changes — this is powered by [Fast Refresh](https://reactnative.dev/docs/fast-refresh). |
70 | | - |
71 | | -When you want to forcefully reload, for example to reset the state of your app, you can perform a full reload: |
72 | | - |
73 | | -- **Android**: Press the <kbd>R</kbd> key twice or select **"Reload"** from the **Dev Menu**, accessed via <kbd>Ctrl</kbd> + <kbd>M</kbd> (Windows/Linux) or <kbd>Cmd ⌘</kbd> + <kbd>M</kbd> (macOS). |
74 | | -- **iOS**: Press <kbd>R</kbd> in iOS Simulator. |
75 | | - |
76 | | -## Congratulations! :tada: |
77 | | - |
78 | | -You've successfully run and modified your React Native App. :partying_face: |
79 | | - |
80 | | -### Now what? |
81 | | - |
82 | | -- 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). |
83 | | -- If you're curious to learn more about React Native, check out the [docs](https://reactnative.dev/docs/getting-started). |
84 | | - |
85 | | -# Troubleshooting |
86 | | - |
87 | | -If you're having issues getting the above steps to work, see the [Troubleshooting](https://reactnative.dev/docs/troubleshooting) page. |
88 | | - |
89 | | -# Learn More |
90 | | - |
91 | | -To learn more about React Native, take a look at the following resources: |
| 44 | +## What to do? |
92 | 45 |
|
93 | | -- [React Native Website](https://reactnative.dev) - learn more about React Native. |
94 | | -- [Getting Started](https://reactnative.dev/docs/environment-setup) - an **overview** of React Native and how setup your environment. |
95 | | -- [Learn the Basics](https://reactnative.dev/docs/getting-started) - a **guided tour** of the React Native **basics**. |
96 | | -- [Blog](https://reactnative.dev/blog) - read the latest official React Native **Blog** posts. |
97 | | -- [`@facebook/react-native`](https://github.com/facebook/react-native) - the Open Source; GitHub **repository** for React Native. |
| 46 | +Review the PR in the interview by talking through the changes. |
| 47 | +Do not comment on the PR in GitHub. |
0 commit comments