Skip to content

Commit e786cb0

Browse files
committed
[docs] Update/simplify info around Metro for env setup
1 parent 50a01ac commit e786cb0

File tree

4 files changed

+28
-28
lines changed

4 files changed

+28
-28
lines changed

docs/_getting-started-linux-android.md

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -125,19 +125,19 @@ Click "Next" then "Finish" to create your AVD. At this point you should be able
125125

126126
<h3>Step 1: Start Metro</h3>
127127

128-
First, you will need to start Metro, the JavaScript bundler that ships with React Native. Metro "takes in an entry file and various options, and returns a single JavaScript file that includes all your code and its dependencies."—[Metro Docs](https://facebook.github.io/metro/docs/concepts)
129-
130-
To start Metro, run `npx react-native start` inside your React Native project folder:
128+
[**Metro**](https://facebook.github.io/metro/) is the JavaScript build tool for React Native. To start the Metro development server, run the following from your project folder:
131129

132130
```shell
133131
npx react-native start
134132
```
135133

136-
`react-native start` starts Metro Bundler.
137-
138-
> If you use the Yarn package manager, you can use `yarn` instead of `npx` when running React Native commands inside an existing project.
134+
:::info
135+
If you use the Yarn package manager, you can use `yarn` instead of `npx` when running React Native commands inside an existing project.
136+
:::
139137

140-
> If you're familiar with web development, Metro is a lot like webpack—for React Native apps. Unlike Kotlin or Java, JavaScript isn't compiled—and neither is React Native. Bundling isn't the same as compiling, but it can help improve startup performance and translate some platform-specific JavaScript into more widely supported JavaScript.
138+
:::note
139+
If you're familiar with web development, Metro is similar to bundlers such as Vite and Webpack, but is designed end-to-end for React Native. For instance, Metro uses [Babel](https://babel.dev/) to transform syntax such as JSX into executable JavaScript.
140+
:::
141141

142142
<h3>Step 2: Start your application</h3>
143143

docs/_getting-started-macos-android.md

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -135,19 +135,19 @@ Click "Next" then "Finish" to create your AVD. At this point you should be able
135135

136136
<h3>Step 1: Start Metro</h3>
137137

138-
First, you will need to start Metro, the JavaScript bundler that ships with React Native. Metro "takes in an entry file and various options, and returns a single JavaScript file that includes all your code and its dependencies."—[Metro Docs](https://facebook.github.io/metro/docs/concepts)
139-
140-
To start Metro, run `npx react-native start` inside your React Native project folder:
138+
[**Metro**](https://facebook.github.io/metro/) is the JavaScript build tool for React Native. To start the Metro development server, run the following from your project folder:
141139

142140
```shell
143141
npx react-native start
144142
```
145143

146-
`react-native start` starts Metro Bundler.
147-
148-
> If you use the Yarn package manager, you can use `yarn` instead of `npx` when running React Native commands inside an existing project.
144+
:::info
145+
If you use the Yarn package manager, you can use `yarn` instead of `npx` when running React Native commands inside an existing project.
146+
:::
149147

150-
> If you're familiar with web development, Metro is a lot like webpack—for React Native apps. Unlike Kotlin or Java, JavaScript isn't compiled—and neither is React Native. Bundling isn't the same as compiling, but it can help improve startup performance and translate some platform-specific JavaScript into more widely supported JavaScript.
148+
:::note
149+
If you're familiar with web development, Metro is similar to bundlers such as Vite and Webpack, but is designed end-to-end for React Native. For instance, Metro uses [Babel](https://babel.dev/) to transform syntax such as JSX into executable JavaScript.
150+
:::
151151

152152
<h3>Step 2: Start your application</h3>
153153

docs/_getting-started-macos-ios.md

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -133,19 +133,19 @@ You might also want to ensure that all "shell script build phase" of your Xcode
133133

134134
### Step 1: Start Metro
135135

136-
First, you will need to start Metro, the JavaScript bundler that ships with React Native. Metro "takes in an entry file and various options, and returns a single JavaScript file that includes all your code and its dependencies."—[Metro Docs](https://facebook.github.io/metro/docs/concepts)
137-
138-
To start Metro, run `npx react-native start` inside your React Native project folder:
136+
[**Metro**](https://facebook.github.io/metro/) is the JavaScript build tool for React Native. To start the Metro development server, run the following from your project folder:
139137

140138
```shell
141139
npx react-native start
142140
```
143141

144-
`react-native start` starts Metro Bundler.
145-
146-
> If you use the Yarn package manager, you can use `yarn` instead of `npx` when running React Native commands inside an existing project.
142+
:::info
143+
If you use the Yarn package manager, you can use `yarn` instead of `npx` when running React Native commands inside an existing project.
144+
:::
147145

148-
> If you're familiar with web development, Metro is a lot like webpack—for React Native apps. Unlike Swift or Objective-C, JavaScript isn't compiled—and neither is React Native. Bundling isn't the same as compiling, but it can help improve startup performance and translate some platform-specific JavaScript into more widely supported JavaScript.
146+
:::note
147+
If you're familiar with web development, Metro is similar to bundlers such as Vite and Webpack, but is designed end-to-end for React Native. For instance, Metro uses [Babel](https://babel.dev/) to transform syntax such as JSX into executable JavaScript.
148+
:::
149149

150150
### Step 2: Start your application
151151

docs/_getting-started-windows-android.md

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -156,19 +156,19 @@ Click "Next" then "Finish" to create your AVD. At this point you should be able
156156

157157
<h3>Step 1: Start Metro</h3>
158158

159-
First, you will need to start Metro, the JavaScript bundler that ships with React Native. Metro "takes in an entry file and various options, and returns a single JavaScript file that includes all your code and its dependencies."—[Metro Docs](https://facebook.github.io/metro/docs/concepts)
160-
161-
To start Metro, run `npx react-native start` inside your React Native project folder:
159+
[**Metro**](https://facebook.github.io/metro/) is the JavaScript build tool for React Native. To start the Metro development server, run the following from your project folder:
162160

163161
```shell
164162
npx react-native start
165163
```
166164

167-
`react-native start` starts Metro Bundler.
168-
169-
> If you use the Yarn package manager, you can use `yarn` instead of `npx` when running React Native commands inside an existing project.
165+
:::info
166+
If you use the Yarn package manager, you can use `yarn` instead of `npx` when running React Native commands inside an existing project.
167+
:::
170168

171-
> If you're familiar with web development, Metro is a lot like webpack—for React Native apps. Unlike Kotlin or Java, JavaScript isn't compiled—and neither is React Native. Bundling isn't the same as compiling, but it can help improve startup performance and translate some platform-specific JavaScript into more widely supported JavaScript.
169+
:::note
170+
If you're familiar with web development, Metro is similar to bundlers such as Vite and Webpack, but is designed end-to-end for React Native. For instance, Metro uses [Babel](https://babel.dev/) to transform syntax such as JSX into executable JavaScript.
171+
:::
172172

173173
<h3>Step 2: Start your application</h3>
174174

0 commit comments

Comments
 (0)