Service Workers with Keilla Fernandes on Real Talk Javascript #80
Tags: podcast, javascript, webdev, pwa
Published: 2020-04-25 17:23:53

---
title: Service Workers with Keilla Fernandes on Real Talk Javascript #80
published: true
description: What's a service worker, and when and where should you use one? Keilla Fernandes talks with John, Ward, and Dan about service workers on Real Talk JavaScript.
tags: podcast, javascript, webdev, pwa
canonical_url: https://johnpapa.net/service-workers-with-keilla-fernandes/
---

[Keilla Fernandes talks with John, Ward, and Dan about service workers.](https://realtalkjavascript.simplecast.com/episodes/episode-80-service-workers-with-keilla-fernandes) What are service workers? How do you keep data fresh and in sync? What about service workers and push notifications? And how does HTTP and caching work with service workers?

<pre class="line-numbers language-javascript" data-start="1"><code>const podcast = { 
  episode: 80,
  title: 'Service Workers with Keilla Fernandes',
  topics: [ 
    'service workers', 'javascript', 'caching',
  ],
  guest: 'Keilla Fernandes',
  hosts: [
    'John Papa', 'Ward Bell', 'Dan Wahlin'
  ]
};
</code></pre>

### Brought to you by

* <a href="https://www.ag-grid.com/" target="_blank">ag-Grid</a>

    <a href="https://www.ag-grid.com/" target="_blank">![ag-grid-logo-2](https://johnpapa.net/content/images/2020/03/ag-grid-logo-2.png)</a>

* <a href="https://ideablade.com" target="_blank">IdeaBlade</a>

### Resources:

* [Abbott & Castello "Who's on First"](https://www.youtube.com/watch?v=kTcRRaXV-fg)
* [Angular Ivy](https://blog.angular.io/version-9-of-angular-now-available-project-ivy-has-arrived-23c97b63cfa3)
* [RxJS](https://rxjs-dev.firebaseapp.com/)
* [lie-fi](https://www.urbandictionary.com/define.php?term=lie-fi)
* [Service Worker](https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API)
* [Using web workers](https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API/Using_web_workers)
* [Web Worker API](https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API)
* [Caching files with a service worker](https://developers.google.com/web/ilt/pwa/caching-files-with-service-worker)
* [Navigator OnLine API for detecting network in a browser](https://developer.mozilla.org/en-US/docs/Web/API/NavigatorOnLine/onLine)
* [Redux](https://redux.js.org/)
* [React.js](https://reactjs.org/)
* [IndexedDb](https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API)
* [redux persist](https://github.com/rt2zz/redux-persist/blob/master/README.md)
* [The App Shell](https://developers.google.com/web/fundamentals/architecture/app-shell)
* [Progressive Web Apps](https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps)
* [Debugging Tools in the browser](https://developers.google.com/web/ilt/pwa/tools-for-pwa-developers)
* [Creating a service worker in Create React app](https://create-react-app.dev/docs/making-a-progressive-web-app/)
* [Creating a service worker in the Vue CLI](https://cli.vuejs.org/core-plugins/pwa.html)
* [SapperUpdating service workers - The Service Worker lifecycle](https://developers.google.com/web/fundamentals/primers/service-workers/lifecycle)
* [Google tutorial on debugging service workers in Chrome](https://codelabs.developers.google.com/codelabs/debugging-service-workers/#0)
* [Mistakes Junior React Developers Make](https://codelabs.developers.google.com/codelabs/debugging-service-workers/#0)
* [Get started with PWAs on Azure](https://docs.microsoft.com/en-us/microsoft-edge/progressive-web-apps/get-started?wt.mc_id=rtjs-podcast-jopapa)
* [Add DevOps to a Gatsby app with PWA features](https://docs.microsoft.com/en-us/azure/devops-project/azure-devops-project-nodejs?wt.mc_id=rtjs-podcast-jopapa)
* [Keilla at the DevIntersection event in Orlando April 2020](https://devintersection.com/#!/?track=papa)


### Timejumps

* **[02:36](#t=02:36)** Guest introduction
* **[03:55](#t=03:55)** What are service workers?
* **[07:53](#t=07:53)** Where could people be using service workers?
* **[08:46](#t=08:46)** Sponsor: Ag Grid
* **[09:51](#t=09:51)** How do I keep everything fresh and in sync?
* **[28:33](#t=28:33)** Sponsor: IdeaBlade
* **[29:33](#t=29:33)** Chrome Developer tools and service workers
* **[31:20](#t=31:20)** Service workers and push notifications
* **[32:33](#t=32:33)** Do I need to worry about service workers?
* **[37:39](#t=37:39)** How does HTTP and caching work?
* **[40:38](#t=40:38)** Final thoughts