Skip to content

Latest commit

 

History

History
135 lines (98 loc) · 6.35 KB

WebDev Resources.md

File metadata and controls

135 lines (98 loc) · 6.35 KB

Web Dev Resources

Remember to have fun and pace yourself!

Before We Start

Things to Note

  1. Free resources are always available and are often better than paid resources.
  2. Always try to read the documentation first and then look for video resources.
  3. Stackoverflow, Medium articles and Gen. AIs like ChatGPT, Bard are your friends (beware, they hallucinate sometimes). Always search on the internet to find solutions to your problems.
  4. The best way to learn is to build.
  5. Don't take too much pressure. You've got a lot of time to specialise in any field.
  6. Seek feedback on your work from peers or mentors to gain valuable insights and improve continuously.
  7. Develop problem-solving skills by tackling real-world challenges through personal projects or by participating in coding competitions.
  8. Experiment with small projects and gradually increase complexity to reinforce your understanding and skills.

Some Cool Repositories / Websites

  1. Google Fonts
  2. Hex Colors
  3. Font Awesome Icons
  4. Tailwind CSS
  5. Bootstrap
  6. Microsoft: Web Dev for Beginners Course
  7. 30 Days of JS Challenge
  8. Realworld Demo Apps
  9. !! Build Your Own X
  10. Bennet Freely Tools - Bennet Freely Website
  11. WebTools
  12. Cool Backgrounds
  13. Small Web Tools
  14. Visual Type Scale
  15. Waves Generator
  16. Blob Generator
  17. Clip Path Generator
  18. To Generate Animations - Animista
  19. To Generate SVG Patterns - Flectofy
  20. Responsively

Must Try

Accept The Challenge :)

Flex Box Game

Essential Documentation

  1. Mozilla Webdevelopment Docs

Resources for Frontend (Web) Development

HTML Related Resources

  1. W3 School's Tutorial on HTML
  2. Free Code Camp Responsive Web Design Certification (300 hours)
  3. Traversy Media Crash Course

CSS Related Resources

  1. W3 School's Tutorial on CSS
  2. Free Code Camp Responsive Web Design Certification (300 hours)
  3. Traversy Media Crash Course
  4. Flexbox Tutorial

JS Resources

  1. Code with Harry JS paylist

Resources for Backend (Web) Development

Note: Most of these backend resources are also good for general programming.

Websites

  1. First, official docs of whatever you're trying to learn.
  2. W3Schools
  3. Freecodecamp
  4. roadmap.sh - developer roadmaps for many fields. Check out their website and github repo
  5. MIT OpenCourseWare - MIT faculty's lectures on many subjects
  6. NPTEL Portal - Lectures from IITs and IISCs. Though you are requried to give exams if you want certifications.
  7. Harvard's CS50x - Harvard's Intro to CS.
  8. Coursera - You can get many courses free if you apply for financial aid.

Youtube Channels

  1. Fireship
  2. Freecodecamp
  3. MIT OpenCourseWare
  4. Net Ninja
  5. CodeWithHarry

Language Specific Resources

Python

Django

Django Rest Framework

Flask

Javascript

Node, Express

To further your knowledge, it is always best to build and break things. Don't get stuck in tutorial hell!!

Some Free Hosting Websites

  1. GitHub Pages
  2. Render
  3. CloudFare Pages
  4. Vercel
  5. Netlify