DEV Community

loading...
Cover image for You can't afford not to have these!

You can't afford not to have these!

jctechdev profile image Jeff Chavez Updated on ・3 min read

I recently watched a YouTube video that gives the MUST USE Websites & Tools for Web Developers. Click here to watch the video. You can also get a free pdf copy from here.

Yeah, and I guess they are the must haves. Thanks to JavaScript Mastery, these are the sites that he gathered for years as a developer. They are great and they are free!

Here are the names and the links plus some additional from me. Enjoy!

Hosting & Deployment

If you want to bring your websites live for the world to see you can use Netlify for the front-end and Heroku for the Backend.

  1. Netlify
  2. Heroku

I add

  1. Firebase
  2. Github pages

Royalty-Free Images & Video

Since websites are no longer text-based and mostly medias attract visitors, you can spice up your design using these for free.

  1. Unsplash
  2. Pexels
  3. Undraw
  4. Coverr
  5. I add Pixabay

Icons & Fonts

For good looking fonts and Icons these are the go to sites:

  1. Flaticon
  2. Animated icons
  3. Font Awesome
  4. Google fonts
  5. I add Boxicons
  6. Font Space for Elegant fonts

Learning

To upskill and improve your knowledge on web development check these out:

  1. Freecodecamp
  2. The Odin Project
  3. MemDev

I add

  1. w3schools
  2. MDN Web Docs
  3. StackOverflow

Mockup Tools

If you like to sketch simple components for your future website or current project so you can have a look and feel of it, go here:

  1. Figma
  2. Zeplin

Freelancing

If you are confident with your skills and you want to get clients, go and earn from them with these freelancing sites!

  1. Upwork
  2. Freelancer.com
  3. Fiverr
  4. I add FreeUp

Project Design Ideas

To bring your designs to the next level and get an inspiration for your next projects, check these websites:

  1. Awwwards
  2. Dribble

I add

  1. CSS Design Awards
  2. One Page Love
  3. FWA

Exercises & Algorithms

I learned that there is no formation without repetition. To practice and improve your logical and problem solving skills, grow and be the best with these sites

  1. Leetcode
  2. Exercism
  3. Codewars
  4. I add Codingame

General Tools

You cannot do it alone. So, these are some tools that may help your web dev journey.

  1. Emailjs.com
  2. Caniuse.com
  3. Image Compressor
  4. CSS-tricks

Additional

  1. CSS Gradient
  2. Clippy
  3. Flexbox Froggy
  4. Grid Garden
  5. Squoosh

For your bonus, if you wanted to test your site's performance so you can give your users the best experience, check this out WebDev.

That's all! Comment down for additional websites that you think may help the web dev community.

SOLI DEO GLORIA!

Discussion (5)

pic
Editor guide
Collapse
tatticoder profile image
Naman Singhal

To general tools I would add squoosh.App for image compression

Collapse
jctechdev profile image
Jeff Chavez Author

It's a great tool! Look! I added it on the list. Thanks again!

Collapse
jctechdev profile image
Jeff Chavez Author

Thank you! I'll check that out

Collapse
afthabanees profile image
Afthab Anees

That was Very Helpful. 👏👏👏

Collapse
jctechdev profile image
Jeff Chavez Author

Thank you!