26 July 2014

Preview your webpage realtime while creating it

Wanting to see a realtime or near-realtime preview of the webpage I developed, I found only few options available (like this, this and this one). Strange that nobody mentioned Netbeans.

I'm aware of the Netbeans-Eclipse flame-wars and I happen to like Netbeans more :-) You can install it with an installer or use the portable version, it's simpler to use, simpler to get the settings of a project ready, has Git and Gradle support inbuilt and of course, has the preview option for multiple browsers and devices of varying screen-sizes. Have a look...

Choose the "Embedded Webkit Browser" option for having a preview within the Netbeans IDE itself.

When you press F6 to execute the program, the preview appears. The arrow I drew, points to the options Netbeans gives you to view the page in different screen sizes!

You also have a palette of html elements at your disposal, which you can drag and drop onto your HTML code! If you drag a table element onto your code, Netbeans creates all the relevant code for the table, at the place you dropped the table. Now isn't this cool or what!!!

Here's a look at the code. Also a side-note and a video, below

Use any IDE you like
On a side-note, any company with a mature software team, should not ask their developers to use only one particular IDE. The project should be designed to allow developers to use whatever IDE they like. Even if various developers working on the same project are using different IDE's.
Although Eclipse seems to be more widely used, you would find this video from James Gosling rather interesting. It tells us a bit about how the Eclipse hype came about (starts at around the 6th minute of the video).

No comments: