How to open a localhost browser in Visual Studio Code?

I want to have something like this:
https://www.codecademy.com/paths/build-python-web-apps-flask/tracks/introduction-to-flask/modules/introduction-to-flask/lessons/flask-build-your-first-app/exercises/variable-rules

See how the localhost is next to the code and you don’t have to keep opening a new browser every time? Is there a way I can replicate this, but in VSCode?

I’m not sure about this, but if there isn’t a way, you can just keep the one browser window open, and refresh every time you make changes.

1 Like

Not natively, but the joy of VSCode is that it’s open source and extensible.

There are a number of extensions for the editor which give you an in-panel preview of HTML.

I do this, but I have a JS helper script which shows a countdown on the page and refreshes it automatically on a pre-defined interval. :slight_smile:

I actually found one that worked so yay! It would be nice to have it support python files (as I’m using the python module flask to design some things).

I’m not in the Flask track but suspect it must have a fixed port on the localhost. Perhaps just open your favorite browser on that URL and VSC will update it anytime your code is changed and saved?


https://runestone.academy/runestone/books/published/thinkcspy/WebApps/06-MoreAboutFlask.html

1 Like

If your working with an HTML page you want updated and you don’t want to hit the reload you can also use the <meta> tag:

<meta http-equiv="refresh" content="10">

This will reload the page every 10 seconds.

I have not worked with flask, but I would guess that wouldn’t be a problem.

This topic was automatically closed 41 days after the last reply. New replies are no longer allowed.