Web designers and graphics artists always want to use a quick way to prototype what they have in mind or what they are asked to, to showcase it to clients and friends.
One important aspect of this is to be able to quickly prototype something, whether it’s a loading indicator, a simple user interface component or a webpage and share it as easiest as possible.
Over the years there have been many online code editors that shined and I want to bring up some of them so that people who don’t know about them can kick start and use them.
Link: https://kodhus.com/kodnest
Kodnest is one of those popular online code editors or as they are called online code playgrounds that is full featured with a great look and feel and it has all the functionalities that a web designer or an artist needs to quickly prototype, examine and showcase their frontend work.
It contains 3 panes; html, css and javascript. It supports different html and css preprocessors such as Sass, Scss, Less and Stylus for css and Pug and Haml for html.
It also has a console pane where you can see your javascript logs.
Once signed up, You can work on your prototypes and make them private so that no one can see them until they are ready to be showcased.
Kodnest is also a community platform where people can share, like and create forks of other’s prototypes.
You can define extra resources such as css and javascript libraries to be used in your prototype as well.
Jsfiddle is another one of those online code editors that provide full featured prototype development online.
It has been around since the beginning of time. It has same panes as Kodnest but I sometimes personally find it harder to code against it. One reason for that might be that we as developers are used to the IDEs on our desktops having panes that are fullscreen but in JSfiddle there are 4 panes in one screen.
Codepen is the other popular online editor that is also very well known in the frontend and design communities.
It advocates building and testing frontend code with community in mind.
It has free and commercial versions with commercial having more features to corporations.
It contains 3 panes like kodhus kodnest and also the console pane where you can see the logs in your javascript code.
In conclusion, all of these online editors are quite powerful and it’s a matter of preference in terms of their look and feel and also functionality that one gets used over the other.
