DEV Community

Cover image for Resources Every Web Developer Needs
monica
monica

Posted on

Resources Every Web Developer Needs

I have compiled a list of the tools that have helped me over the years in building my websites for personal use and for clients. Let's get started, this is a small list compared to many other resources out there on the internet you can use to enhance the look and feel of your websites.

Websites To Learn Web Development

  • Codecademy
  • TheOdinProject
  • Frontend Mentor
  • Javascript30
  • Coursera
  • Khan Academy
  • freeCodeCamp
  • MDN Web Docs
  • W3Schools
  • Scrimba

Youtube Channels to Learn Web Development

  • Web Dev Simplified
  • Coder Coder
  • The Coding Train
  • FreeCodeCamp
  • Traversy Media
  • The Net Ninja
  • Code with Harry (Hindi)

*Websites for HTML/CSS Templates
*

  • HTML5UP
  • HTMLRev
  • Free-CSS
  • Templated
  • FreeHTML5
  • Start Bootstrap
  • BootstrapMade
  • Bootswatch
  • BootstrapTaste
  • Cruip
  • Tooplate
  • HTML5xCSS3

Code Editors To Use

  • Visual Studio Code (VS Code)
  • Sublime Text
  • Brackets
  • Vim

JavaScript Animation Libraries

  • Anime.js: Lightweight JavaScript animation library.
  • ScrollReveal.js: Easily reveal elements as they enter the viewport.
  • Popmotion: A functional, flexible JavaScript motion library.
  • AniJS: Declarative handling library for CSS animations.
  • Wow.js: Reveal CSS animation as you scroll down a page.
  • Typed.js: A JavaScript library that types.
  • Velocity.js: Accelerated JavaScript animation.
  • GSAP: Professional-grade animation for the modern web.

Website for Vectors, Images, and Illustrations

  • Freepik: Discover free vectors, photos, PSDs, and icons.
  • Vecteezy: Find high-quality vector art, graphics, and illustrations.
  • Unsplash: Access over a million free high-resolution photos.
  • Pixabay: Explore a vast library of free images and videos.
  • Flaticon: Download free icons, SVG, PSD, PNG, EPS format, or as ICON FONT.
  • Openclipart: Share and use free clipart and images.
  • SVGRepo: Download SVGs for free.
  • Vectorportal: Free vectors, clip art, and icons.
  • SVGBackgrounds: Customizable SVG patterns and backgrounds.
  • FreeDesignFile: High-quality graphic design resources.
  • Pexels: Find free stock photos and videos shared by talented creators.
  • Vectorian: Download royalty-free vector art, stock photos, and stock footage.

I hope these resources will help you in building your websites.
Thanks for reading. See you in the next blog!😊🙌

Top comments (29)

Collapse
 
aloisseckar profile image
Alois Sečkár

icones.js.org/ for getting free web icons - it is like a meta search portal for most free icon sets and it helps you to get them as pure SVGs or even as components for most popular JS frameworks.

Collapse
 
monica_w profile image
monica

Thank you for sharing icones.js.org website for getting free web icons.

Collapse
 
livetvchannels profile image
Trieu.iv

I like it

Collapse
 
nightwolfdev profile image
nightwolfdev

I have a repo with software development resources for anyone interested.

Collapse
 
mrdulin profile image
official_dulin
Collapse
 
lulg profile image
Lulseged Admasu

Holy .... Thank you!

Collapse
 
nightwolfdev profile image
nightwolfdev

You're welcome!

Collapse
 
hosseinyazdi profile image
Hossein Yazdi

Great selection! Thanks for sharing 🙌

To add-on, here's also many more helpful resources & tools for devs: webcurate.co/c/developer

Collapse
 
lulg profile image
Lulseged Admasu

Best Resource Website I have seen

Collapse
 
hosseinyazdi profile image
Hossein Yazdi • Edited

Happy you've found it useful! 😊

Collapse
 
kmsaifullah profile image
Khaled Md Saifullah

Nice article. Thanks for sharing this with us.

Collapse
 
ferdinanddavidenko profile image
Ferdinand Davidenko

Amazing resources! Thanks for sharing 😁

Collapse
 
get_pieces profile image
Pieces 🌟

Great resources list! 🔥

Collapse
 
mtminhthuan0911 profile image
mt.minhthuan

Great!!

Collapse
 
mtminhthuan0911 profile image
mt.minhthuan

Great!!

Thread Thread
 
monica_w profile image
monica

Thank you

Collapse
 
wandaazhar profile image
Wanda Azhar

Thank you for sharing

Collapse
 
mexikode profile image
MexiKode ⚙

I logged in just to say thanks :D

Collapse
 
vishnuraveendran profile image
Vishnu-Raveendran

This is great! Thank you for sharing

Collapse
 
lulg profile image
Lulseged Admasu

resources-lul.netlify.app/ - check out link for web dev resources that I use.

Collapse
 
ddebajyati profile image
Debajyati Dey

I use all of the 4 text-editors you mentioned! 😅

Collapse
 
kpeale profile image
Kpeale Legbara

Great resources

Collapse
 
essijunior profile image
NDANG ESSI Pierre Junior

Thanks so much for the tools

Collapse
 
valvonvorn profile image
val von vorn

Every developer needs all those resources to become a rock star ninja killer?

Collapse
 
naviny0 profile image
Navin Yadav

Thanks