Stopping the React Development Server

How To Stop React Development Server?

You must hit CTRL + C in the terminal to stop the React development server from running.

Take a look at this gif I created where I start to run the create-react-app application using npm start.

Gif showing the React Development server starting

Once it is running, the browser opens up, showing my application (this is where the gif turns white for a couple of seconds).

Returning to the terminal, I hit CTRL+C, and the server stops.

From here, I also need to close the browser tab with my application, and the process is complete.

What happens when I hit CTRL+C?

When you start the application using npm start, you run the react-scripts script with the argument start. You can see this in the package.json file at the root of your React app.

The scripts section of package.json for a create-react-app application

This script runs node to start a web server for your application. When you hit CTRL+C, you are killing the node process. 

Looking at the following gif, you can see the activity monitor with several node processes running. Once I terminate the application with CTRL+C, the node processes disappear. This is how you know that you have successfully stopped the application.

A gif showing the activity monitor on macOS when you stop the React development server

Hopefully, this helps to answer the question of How To Stop React Development Server?

What Is The React Development Server?

The React Development server is actually the webpack dev server. It is a local web server that will serve up your React app to the browser during the development process. Using the webpack dev server has many benefits. One is that it will reload the site as you change your code without having to refresh the browser. This can make working on React projects very quick to see what changes to your code will look like.

The webpack dev server also facilitates source mapping. Debugging code in the browser with webpack means that you can step through your React components. As opposed to the bundled JavaScript emitted during the deployment of your application.

0 0 votes
Article Rating
Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments