Why CodePen - Why not Visual Studio Code for Web Programming

Photo by ThisisEngineering RAEng on Unsplash

Originally, when we started designing our tutorials, we wanted to use the following combination

  • Visual Studio Code
  • Http-server (a node JS package) running locally
  • Any browser (we recommend Firefox)
  • GitHub and Git tools from command line for code storage and sharing

However, we found that, teaching first time web developers, how to use the above things became cumbersome and time consuming. In fact, many students simply lost interest and got bored for they were doing all these things before they could actually code.

Further, we found that many of the students did not have their own computer. Many times, laptops were shared among their friends and such. This made, maintaining their developer tools in one place, hard. They had to constantly keep reconfiguring their computers. Further, using GitHub and Git became incredibly difficulty, even with GitHub Desktop.

Lastly, students constantly kept allowing their computers get infected with computer viruses, forcing constant computer resets and reconfigurations. Also, they were have continuous difficulties figuring out the usage of two different windows. Visual Studio Code for coding related usage. Firefox browser for output viewing and debugging.

Eventually, I decided that these students, first time coders, will someday learn how to use the above set of tools. However, now, at the outset, they should start with something that makes the entry barrier lower.

Hence, we decided to go with CodePen.

This post is a supporting article to one of the chapters in our tutorials. Please find the tutorial here. If you like these posts, please visit our company website, and consider hiring us for a developer project or training. Thank you.

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store