This article was first published at my personal blog.
Front-end development is quite a complex discipline and you will hardly ever need only a bro...
For further actions, you may consider blocking this person and/or reporting abuse
This is a great list of front end tools! I'm excited to try DevDocs.io, I hadn't heard of it before and it looks like it will cut down on my googling considerably.
I can second VS code as an IDE, MDN/CSS-Tricks for explanations of CSS attributes, and caniuse as the place to check any time I hear about a new feature that sounds almost too good to be true.
For Lighthouse reports I like to use web.dev/measure/ which gives you a shareable HTML report link after running the audit.
Definitely try Devdocs. Having all documentation in one place and offline is super helpful for me.
Great list, thanks for sharing!
I'd add this fantastic tool rocketvalidator.com/ to perform automatic validations
Thanks that looks interesting, will definitely check it out
Great list Tomas, thank you for sharing!
Looking forward to try them out on my next project.
Regarding the search engine check Ecosia, it is a search engine that plants tree! 🌱🌱
So you reforesting while solving tech issues ! 😉
Thanks for the tip, Will have a look
Awesome list! I'd like to translate it to Chinese. Can you give me the permission? The translated text will be published on nextfe.com. Thanks in advance.
Hi, sure, go ahead. It's great you want to do it. And thanks for asking. Could you send me a link once it's done? Would like to see how it looks in Chinese :-).
Just published the Chinese translation: nextfe.com/tools-i-use-for-front-e...
I did not find the option either. The Google Font API offers
textandsubsetquery parameter, I guess Google removed the subsetting UI to encourage users to use their web font service instead.Yeah too bad they removed it (Google Fonts), I prefer to host web fonts myself to get a better control over it and slightly better performance. Guess I will have to subset it manually in the future.
And thanks for the link the translated article and for the effort you put into it. It's so short in chinese 😆. And the hero image is great 👌. Hope it will help some more people.
Great post Tomas and sure some tools I never heard of before.
Going to check them on my next project, thanks!
Thanks, I'm glad it was helpful. Take care.
Great list Tomas. I have just started learning web dev and I'll keep this list as my standard reference of tools. Thank you
Hi Rahul. Good luck with the web dev and keep learning 💪. I hope those tools will help you as they help me.
Very useful, thanks Tomas!
Awesome list
Thanks, glad you like it. I hope it will help you in some way. 👍
Amazing list. Thank you for sharing
Great list Tomas, I'm saving most of these resources to have it on my toolchain.
Thanks!
Thanks, glad it helped.
Great post! By the way, CSS-Tricks link seem to point to the wrong website (caniuse.com/).
Oh my. Thanks for the good catch. I will fix it.
great list. that DevDocs one is massive. Thanks a lot for sharing this?
also, interested to know what else do you use in terms of css like SCSS and build tools like node/npm etc?
Thanks
Hi Amit, good to hear it was useful to you. As for other dev tools I usually use npm scripts. We pack on some occasions. In terms of CSS I used to use sass but these days I usually go with postCSS. There is plenty of plugins to suit most of my needs. I have also experience with CSS in JS but I still don't how to feel about them. But in general I try to always pick a tools based on the project needs.