54. SVGOMG
SVGOMG is an online tool for optimising SVG. Under the hood SVGOMG uses the incredibly powerful command-line tool SVGO to perform optimisations, but SVGOMG does so while visually showing you any changes the optimisation has made to an image.
55. Yarn
Yarn is a package manager. It works much the same as Node Package Manager (npm). Yarn caches every package making it incredibly fast to download and install dependencies, and with all of the same packages as npm so you can easily make the switch.
56. BetterBoilerplate
The BetterBoilerplate offers a scaffolding for any new project. It’s packed full with build tools, file management and a robust CSS framework. The BetterBoilerplate is development environment agnostic and can be used for any project from small brochure websites to full SAAS projects.
57. Browsersync
Browsersync is like LiveReload, but on steroids. It's a powerful tool for synchronised cross-device testing that will live-reload your project for every edit and save in all browser instances. It even syncs up navigation and scrolling in the browser sessions. You can add CSS outlines for debugging, and a latency option enables you to mimic a slower internet connection.
58. Google PageSpeed Insights
Google Page Speed Test is an online tool used to analyse a website and give a score based on performance. You start by entering the URL of your website and running the test, Google will then suggest ways in which the site’s performance can be improved.
59. Vue.js DevTools
Vue.js has optional devtools, which enable you to inspect component states, track events and access all of the data held in the virtual DOM. This is extremely useful when working with Vue.js and is a much nicer alternative to console logging all of these things.
60. Web Developer Toolbar
The Web Developer toolbar has been around for almost as long as web design has, but it’s still really useful for web development today, offering a number of really handy tools, from deleting cookies to displaying an image’s alt text.
Get the Creative Bloq Newsletter
Daily design news, reviews, how-tos and more, as picked by the editors.
61. Gulp
Gulp is a frontend build tool used to perform any number of functions from compiling Sass to building SVG sprites. Gulp will save you time and perform a lot of the repetitive tasks required, enabling you to concentrate on writing code and building applications.
62. Grunt
This frontend build tool is used in the same way as Gulp, with the aim of saving you time and effort when building the frontend of any website or app. These tools have become an important part of frontend development due to their ability to perform repetitive tasks.
Next page: Best of the rest
