The Ultimate Developer's Toolkit 2022

The Ultimate Developer's Toolkit 2022

·

3 min read

Hey there

I mentioned before that I felt a bit lost when I was starting out on my programming journey.

It's true — it was a very frustrating experience. Maybe you're feeling a little frustrated, too!

I tried several courses and looked into different educational avenues to try and find answers, but most of them only teach theory and don't provide practical , real-world solutions for new developers.

So there are two things I want to share with you.

First, here's a list of resources I've put together that will provide you with a lot of relief as you continue learning. Oh, and this list is LONG, so be sure to stay tuned for tomorrow for the other major solution that will help you become a master!

giphy.gif

👉Illustrations

Proper aesthetics define a website. As a web developer, you have to be careful about the images and icons you use. Here's a list:

  • Unsplash, Pexels, Undraw, DrawKit, freepik, and Pixabay — Free images, photos, and videos
  • Loading.io — Free animated, static spinners, progress bar, backgrounds, and much more
  • Lottie Files — High-quality, interactive open-source animation files
  • Ionicons, icons8, Icones, flaticon, and IcoFont — rich resources containing different icons

👉Tools

Many prominent developers have created excellent, crazy tools to boost development. These are some of them:

  • Remove BG — An AI tool to help remove the background of an image
  • Clippy — Create complex shapes in CSS using clip-path property
  • Web Code Tools — One Platform with many solutions. Generates box shadows, gradients, meta tags, elements, etc.
  • Haikei — Generates unique SVG design assets
  • Transform — A polyglot web converter

giphy (1).gif

👉 Challenges

The developer’s life is a life of overcoming challenges (& bugs, haha!). To keep up with trends, we have to challenge ourselves constantly. For that, use:

  • CSS Battle — A battleground to improve and tighten CSS skills
  • LeetCode, HackerRank, Exercism — Platforms for Data Structure & Algorithms practice
  • Frontend Mentor & Codewell — Develop, practice & compete to code a frontend website from its design file
  • FreeCodeCamp — Learn and complete projects to achieve certifications for free

👉 Hosting

Want to share your website with the entire world? Check out these free hosting services:

  • Vercel
  • Netlify
  • Glitch & Codepen
  • GitHub Pages
  • Firebase & Supabase

👉 Guides

Valuable cheat sheets, tutorials on tech stuff, and more.

  • DevDocs — Pragmatic information on almost every language
  • DevHints — Beautiful cheatsheets comprising many languages
  • GitSheets — A dead simple git cheatsheet
  • 30 Seconds of Code — Provides short code snippets mainly featuring JavaScript

Tomorrow I'll share the other immensely valuable method of improving your skills so that you can pursue the dream programming job you've always wanted.

See you then!