DEV Community

Marcel Cruz
Marcel Cruz

Posted on • Updated on

10 Resources You Will Need As A Web Developer

Working as a web developer has never been easier. And harder.

What?

Yes, with so many tools and automation, tedious and complex tasks we used to do ourselves became painless, smarter and faster. But with so many options to choose, it's also becoming hard to keep track of new trends and quality software.

Shameless plug: that's why I created Dev Resources. It's my personal compilation of resources I've been using and bookmarking in the last years, and you can also submit your favourites.

Without further ado, let me show you some resources to step up your web developer game.


freeCodeCamp

Everything starts with learning, and when it comes to it there's no better option than freeCodeCamp.

Their curriculum is constantly updated and reviewed, and for being an open-source project, it's guaranteed to have the best learning experience for developers.

πŸ”— https://www.freecodecamp.org

HTMLrev

Useful resource for free HTML templates. HTMLrev showcases selected items from generous template creators from all around the world. HTML vanilla CSS, Bootstrap, Tailwind, React, Next, Astro and more.

What sets this website apart from the sea of template galleries is that it checks each item to be free for both personal and commercial (client work) projects. Saves time, money and headaches.

πŸ”— https://htmlrev.com

Fonts In Use

Finding fonts isn't so complicated anymore. Services like Google Fonts give you thousands of options to choose from.

But what about seeing the font being used in a context? That's what Fonts In Use will do. It lets you see how professionals use certain fonts in certain cases, giving you a better idea of which font fits better your project.

πŸ”— https://fontsinuse.com

IcΓ΄nes

No more searching different places for your icons. Why? Because IcΓ΄nes put them all in one place!

Browse their huge list of icon sets and export them in SVG, React or Vue components. Can it get any easier?

πŸ”— https://icones.netlify.app

ColorSpace

Generating a colour palette is a crucial, yet not simple task for a developer without a design background. Your site should look good while conveying the message you're passing. Also, accessibility plays a huge role in the quality of your project.

ColorSpace will look after all of this: all you need to do is give it one colour, and it'll do the rest for you, generating several different palettes that will fit any use case.

πŸ”— https://mycolor.space

Syntax

Listen to two seasoned developers sharing their experiences and opinions on most web development topics. Great to keep updated with new trends and tools.

πŸ”— https://syntax.fm

Vercel

Hosting your website has never been easier. Vercel lets you deploy your web app or website with one command through the terminal, or even hooking your GitHub repository and deploying automatically with every git push.

They recently added analytics to their service, so you can also check how your project is performing.

πŸ”— https://vercel.com

Linktopus

Need a personal page to showcase your latest projects and GitHub contributions graph?

Linktopus is a modern and easy-to-use link in bio tool, where you can easily create your personal and professional page, add text, images, products, your GitHub activity and a lot more.

πŸ”— https://linktopus.co

The Coding Interview

So you looked for a job, and now you need to face the dreaded interview. Well, it doesn't need to be scary if you're prepared for it, right?

The Coding Interview will help you prepare for that.

πŸ”— https://www.thecodinginterview.com

Dev Resources

As I mentioned at the beginning of this article, Dev Resources is a compilation of all resources you might need while working as a developer.

You can find all the resources above and a lot more. And that's not all: you can submit your favourites, in case they're not there yet, and you can find great deals for premium products.

And there's more coming soon:

  • upvoting, so you can rank resources
  • bookmarking, so you can easily find your favourites
  • community, so you can share your experiences and connect with creators
  • and if you have more ideas, I'd love to hear it, after all, Dev Resources is made from dev to dev.

πŸ”— https://devresourc.es


I hope you enjoy this list and that it helps you with your developer journey.

And if you want to connect with me, you can reach me on Twitter as @marcelcruz.

Happy coding!

Top comments (4)

Collapse
 
devluc profile image
Devluc

Thank you very much for featuring HTMLrev alongside these established resources

Collapse
 
devluc profile image
Devluc

Great collection of resources, thanks for sharing it Marcel

Collapse
 
marcelcruz profile image
Marcel Cruz

Thank you Lucian, always happy to share what I've learnt! :)

Collapse
 
hemazyn profile image
Hemazyn

Good