Go to a command line, and from your application directory run:
yarn start
Your browser should open and you should see your app running on the page. Try making edits to App.js
, saving them, and see how they appear.
Other Scripts
In addition to yarn start
, create-react-app
provides you with a few other scripts. They are available on the command line via yarn
because they are specified in the scripts
section of your package.json
file. You can read about them in the README that was generated with your app.
yarn test
create-react-app
also provides you with an out-of-the-box test runner, via Jest.
The test runner watches changes to your app and tries to run the related tests.
The generated app already provides you with an example "smoke test" at App.test.js
. If you've made changes to App.js
, the runner will run this test again.
The name of this file implies that it contains tests of the App
component. A "smoke test" typically just renders the component in question, to see that it doesn't throw any errors. There are many ways to locate and name tests, and many testing strategies. I recommend you read more about them in the create-react-app docs.
yarn run build
Throughout this course, we're working on our React app in the development mode. You shouldn't try to run your app as-is on a public server, though, because the files aren't packaged for efficient performance. You also definitely don't want to serve your app from the development server that we're using when we run yarn start
.
Instead, yarn run build
packages your app for a production deployment. We won't get into the details of optimizing and deploying your app for production in this course, but let's run the build script now to see what it does.
You can see that it tells you the file sizes of your built assets after they are compressed. Your actual app is to be found now in ./build/static/js/
. Take a look at the 'main' file there to see what your bundled, minified code looks like. You can see this file is actually about 153kb. That's because we're looking at the minified file before gzipping.