Back to Top

MODERN WEB DEVELOPMENT TOOLS

modern web dev tools

Believe it or not, modern web development tools can help any designer create impressive websites much faster. Here are the best tools of the year, according to Dan Morgan (that would be me ;)


1. Visual Studio Code - code.visualstudio.com - is Microsoft's free code editor, which (believe it or not) runs on macOS and Linux as well! It provides the same clever IntelliSense feature that's been implemented in Visual Studio, helping developers code faster by providing smart autocompletion that is based on the type of the variable, function definition, and more.


Debug your code straight from the editor by making use of break points, call stacks and an interactive console. Then, when you are happy with the results, push and pull from Git without leaving the editor. Microsoft has also coded lots of extensions, themes and debuggers which run in a separate memory zone, so they can't slow down the actual editor.


2. Notepad++ notepad-plus-plus.org - is a Windows-only application, but its list of cons stops here. I know that many people love Linux and OS X, but Windows has the largest market share by far, so that's what I use.


The program is written in C++ and it shows; it's lightweight and really fast, even when I work with huge projects. Notepad++ supports about 80 programming languages, including CSS, HTML, JavaScript, C, C++, C#, Pascal, Visual Basic and pretty much anything you can think of.


It provides support for column mode editing, multi-editing, can use dialog-based searching, records your actions and then replays them later automatically, thus saving you a lot of time, and much more.


3. Atom - atom.io - is, according to its authors, a hackable text editor for the 21st century. And I'll have to admit that these guys really know what they are talking about; the editor allows several developers to join their forces, working at the same project in real time.


It's a cross-platform editor which can run on Windows, OS X and Linux, includes a built-in package manager, has a flexible smart autocomplete feature, a file system browser, multiple panes that make comparing files a breeze, lots of great looking themes (including dark themes for people who like to code at night), and can be customized to your liking by making use of CSS configuration files. If you love 100% free software, you will be glad to hear that Atom is an open source project.


4. Less - lesscss.org - is a pre-processor which helps web developers extend and maintain their CSS code easily. It provides logical functions such as "if" and "boolean", string functions such as "escape", "% format" and "replace", list functions such as "length", "extract", "range", "each", and more.


5. Bootstrap - getbootstrap.com - is an open source CSS framework which helps people who want to create web projects using HTML, CSS and JS get the work done much faster. If you want to build, and then deploy responsive, mobile-first sites that run really fast, this is definitely the framework to use.


These are some of the best web development tools out there. Don't forget to let me know if you discover more pieces of software which deserve to be mentioned here.