Twitter LinkedIn Github

JetBrains

Instant HTML/CSS Updating

Want instant updating to HTML / CSS pages you’re editing?

See it in action

You can now have it. I’ve tried it on both IntelliJ IDEA and WebStorm successfully. It should most likely work on our other IDE’s too (PhpStorm, PyCharm).

To install:

  1. Download Web Browser Connector plugin for JetBrains plugin repo. This is needed for the actual Instant HTML editing plugin.

  2. Download Instant HTML editing plugin.

  3. Open up WebStorm (or IDEA) and click on Preferences. Search for ‘plugin’

  1. Install the plugins previously downloaded from disk. First install the Web Browser Connector*

  1. Restart WebStorm (or IntelliJ)

  2. Open up your Web Project. Under the Run menu select Instant HTML editing

  1. Launch Chrome**. If all has gone well you should now see this below the URL bar

As you make changes (to both HTML and CSS) you should now be able to see them updating live in Chrome.

It’s still early days of the plugin so there might be quirks with it, but I’m sure Vladmir will appreciate any and all feedback.

  • You could in principle just install this directly from WebStorm by clicking on Browse Repositories without having to download. However for some reason, Web Browser Connector is not listed.

** Currently only works in Chrome.