How to automatically refresh your browser as you work

I honestly can’t work without auto refresh anymore. Luckily, having your browser automatically refresh is really easy to do!

In this video, I explore a few different ways to do it. The first is with software such as Codekit and Prepros. After that, I look at how you can set up auto refresh using the command line with the help of node package manager – or npm. It’s fairly simple to do, even if you’ve never used the command line before.

I’ve also had some other suggestions from commenters as well. If you have any others, let me know!
Atom package for a live server –
Chrome extension –

Also, using a flexbox playground can be SUPER useful as you learn, I usually use this one:

Support me on Patreon:

I’m on some other places on the internet too!

If you’d like a behind the scenes and previews of what’s coming up on my YouTube channel, make sure to follow me on Instagram and Twitter.



  • cool

    Jaëm.Bertdge Dessources Dit Dumesle 02/25/2020 9:34 am Reply
  • Video starts 1:39

    Oleg Gutu 02/25/2020 9:34 am Reply
  • Gulp (or Grunt) with plugins is much professional way. And its free.

    Сергей Смирнов 02/25/2020 9:34 am Reply
  • Thank you sir,
    what about remove auto remove cache
    in short ( Ctrl+Shift+R instead of Ctrl+R )?

    droid vpn 02/25/2020 9:34 am Reply
  • Love my command line. Killing the process on a Mac is CTRL-C, just like on Windows. CMD-C won't work.

    Joel D Canfield 02/25/2020 9:34 am Reply
  • hi when trying to install browser sync i am getting an error
    npm err! code ECONNRESET

    Jonathan San Jose 02/25/2020 9:34 am Reply
  • i like people who dont blink

    Ademola Shasanya 02/25/2020 9:34 am Reply
  • It says "Cannot GET /"

    OJ# B#Falon 02/25/2020 9:34 am Reply
  • VS Code + Live Sass Compiler extension.

    Leszek Nagooglach 02/25/2020 9:34 am Reply
  • Video starts at 1:36

    It just doesn't matter 02/25/2020 9:34 am Reply
  • I just watched your another video with gulp sass and browser-sync and now this. What is –save-dev and -g in npm?

    Manjeet Kundu 02/25/2020 9:34 am Reply
  • Just download VSCode.

    mikozera 02/25/2020 9:34 am Reply
  • It seems you're also like me, doing things with less clicks and buttons. I use autohotkey. when you save in your current windows , autohotkey also send an F5 to the browser (most recent window used in chrome) and you can choose to do more stuff while at it 🙂 . (like play "level achieved" sounds XD )

    Zou Uuu 02/25/2020 9:34 am Reply
  • live-server is also a very good choice. Works for me perfectly.

    Oleksandr Basov 02/25/2020 9:34 am Reply
  • +1 for CodeKit.

    Greg Raven 02/25/2020 9:34 am Reply
  • I can't understand why it gives a option for download of the Page when I did the 'preview' option

    Rpmmiofal 02/25/2020 9:34 am Reply
  • Hmm… what about using a non-existing target on the close button? No existing target, no scrolling. In chrome it worked for me.

    Thomas Feyrer 02/25/2020 9:34 am Reply
  • Great clip as always, can you pls explain also how to use Prepros for the Browser Sync option, I would like to check the changes on couple of browsers at once, and maybe mobile devices? Thx

    Marko Kozlica 02/25/2020 9:34 am Reply
  • I ran into a problem when I tried the browsersync method. It displays "Cannot GET /". What does that mean and what can I do?

    My Programming Journey 02/25/2020 9:34 am Reply
  • i just use a much easyer script autoreload every 0.5 sec or so, isnt better?

    Drainerix 02/25/2020 9:34 am Reply
  • hi, can u provide a solution from php websites reload with browsersync and little more about the powershell start server command syntax

    Creative Learners 02/25/2020 9:34 am Reply
  • my web browser gives me this message CANNOT GET/ what does the message mean and how can i fix it

    Jorge Artaza 02/25/2020 9:34 am Reply
  • Cool!

    Rinat Valiullov 02/25/2020 9:34 am Reply

Leave a Reply

Your email address will not be published. Required fields are marked *