So, how do we use a Service Worker in our application? Well, it's simple to do with Create React App, but there is a major caveat: you can't configure the Create React App default generated service-worker.js file without ejecting your project, unfortunately! Not all is lost, however; you can still take advantage of some of the highlights of PWAs and service workers by using the default Create React App-generated Service Worker.
To enable this, hop over into src/index.js, and, at the final line, change the Service Worker unregister() call to register() instead:
serviceWorker.register();
And now we're opting in to our Service Worker! Next, to actually see the results, you'll need to run the following:
$ yarn build
We'll create a Production build (We'll cover this in greater detail in Chapter 8, Getting Your App Ready for Production). You'll see some output that we'll want to follow as part of this:
The build folder is ready to be deployed.
You may serve it with a static server:
yarn global add serve
serve -s build
As per the instructions, we'll install serve globally, and run the command as instructed. When we run this, we should see the following output:
$ serve -s build
We will get the following output:
Now open up http://localhost:5000 in your local browser and you'll be able to see, again in the Chrome Developer tools, the Service Worker up and running for your application: