50 resources for learning JavaScript in 2021👇

Thread🧵
In this tweet you will find resources in various form

- Documentation
- Courses
- Websites
- YouTube Videos
- Books
- GitHub Repos
- Interactive learning
- Projects
📌 DOCUMENTATION

1. MDN
developer.mozilla.org/en-US/docs/Web…

2. W3 Schools
w3schools.com/js/

3. DevDocs
devdocs.io/javascript/

4. JavaScript Info
javascript.info

5. JavaScript Garden
bonsaiden.github.io/JavaScript-Gar…
📌 WEBSITES

11. Geeks For Geeks
geeksforgeeks.org/javascript-tut…

12. Java Point
javatpoint.com/javascript-tut…

13. Tutorial Points
tutorialspoint.com/javascript/ind…

14. The Odin Project
theodinproject.com/courses/javasc…

15. Learn JS
learn-js.org
16. JavaScript Wikipedia
en.wikibooks.org/wiki/JavaScrip…

17. JavaScript 30
javascript30.com

18. JavaScript for Cats
jsforcats.com

19. Java5cript
java5cript.com

20. Scotch io
scotch.io/tag/javascript
📌 YOUTUBE VIDEOS

21. JavaScript Mastery


22. Clever Programmer


23. Edureka


24. Coursera


25. Freecodecamp
26. Web Dev Simplified


27. Traversy Media


28. Edureka


29. Hitesh Choudhary


30. Simon Høiberg
📌 BOOKS

31. Eloquent JS
eloquentjavascript.net

32. JS Design pattern
addyosmani.com/resources/esse…

33. The JavaScript Beginner's Handbook
flaviocopes.com/page/javascrip…

34. Learn JavaScript with Ease
pdfdrive.com/javascript-jav…

35. Human JavaScript
read.humanjavascript.com
📌 GITHUB REPOS

36. Modern JavaScript tutorials
github.com/javascript-tut…

37. Awesome JS Learning
github.com/micromata/awes…

38. JS by example
github.com/bmkmanoj/js-by…

39. 33 JS concepts
github.com/leonardomso/33…

40. 30 seconds of code
github.com/30-seconds/30-…
📌 INTERACTIVE LEARNING

41. Learn JavaScript
learnjavascript.online

42. JavaScript by plural sight
javascript.com/try

43. Solo Learn
sololearn.com/learning/1024

44. Codementor
codementor.io/collections/le…

45. Guru99
guru99.com/interactive-ja…
📌 PROJECTS

46. 10 JS projects in 10 hours


47. 15 JS projects


48. Build 7 games using JS


49. 50 projects in 50 days
udemy.com/course/50-proj…

50. JavaScript Projects for Beginners
jsbeginners.com/javascript-pro…
Finally! It took me over 1 hour to find and compile all the resources for you😁

Feel free to add more👇

Thanks!! Keep coding👇

• • •

Missing some Tweet in this thread? You can try to force a refresh
 

Keep Current with Pratham 👨‍💻🚀

Pratham 👨‍💻🚀 Profile picture

Stay in touch and get notified when new unrolls are available from this author!

Read all threads

This Thread may be Removed Anytime!

PDF

Twitter may remove this content at anytime! Save it as PDF for later use!

Try unrolling a thread yourself!

how to unroll video
  1. Follow @ThreadReaderApp to mention us!

  2. From a Twitter thread mention us with a keyword "unroll"
@threadreaderapp unroll

Practice here first or read more on our help page!

More from @Prathkum

24 Jan
63 RESOURCES OF CSS🌈👇

Thread🧵
📌 COLORS

1. Color Hunt
colorhunt.co

2. Coolors
coolors.co

3. HTML color codes
htmlcolorcodes.com

4. UI Gradients
uigradients.com/#Bupe

5. Gradient generator
cssgradient.io
6. Encycolorpedia
encycolorpedia.com

7. WebFx
webfx.com/web-design/col…

8. Radial Gradient
css-gradient.com

9. COLORS
clrs.cc

10. Flat UI colors 2
flatuicolors.com
Read 14 tweets
23 Jan
Let's create this LOADING animation in less than 15 minutes🌈

THREAD🧵
The HTML structure is pretty straight forward

- Create a container div

- Create 7 different span elements for each letter in the word "LOADING"
- Centralize everything, I have used positioning in order to center my elements but you can use any method you want
Read 8 tweets
21 Jan
Yesterday I invented a new design concept I named "Dropmorphism" 😂

Let's see how I made it👇

THREAD🧵 Complete final output of drop
🚨 The heart of this art is box-shadow and border-radius

I created the shape of drop using Fancy border generator👇

9elements.github.io/fancy-border-r…
Now you a drop ready, We are good to go.

- Create a blue background and centralize your drop Step 1: Creating a drop and...CSS code for step 1
Read 13 tweets
20 Jan
Have you heard the term "PROGRESSIVE WEB APPLICATIONS"🌐?

A detailed thread on it🧵
In this thread you'll find

- All about PWAs
- Learning resources
- Project idea
- And lots of knowledge
You might listen or read somewhere that PWAs is the future of web applications.

WHY? We will try to find the answer👇
Read 16 tweets
18 Jan
How to make different shapes and figures using CSS?🔴🔺⬛🔶

THREAD🧵
1. Circle

- Pretty simple, we just need to make a square and apply the border-radius 50% in order to give it a circular shape ImageImageImage
2. Semi-circle

- Create a rectangle
- Apply border radius top left and top right same as height of the rectangle ImageImageImage
Read 12 tweets
16 Jan
CSS arts are simple🌈
Let's make this laptop in a few simple steps👇

THREAD🧵
STEPS

- Create screen
- Create base
- Create touch pad
- Create key's base
- Create keys
STEP 1: Create Screen

- Create a rectangle for our laptop screen
- Set background color as white
Read 12 tweets

Did Thread Reader help you today?

Support us! We are indie developers!


This site is made by just two indie developers on a laptop doing marketing, support and development! Read more about the story.

Become a Premium Member ($3/month or $30/year) and get exclusive features!

Become Premium

Too expensive? Make a small donation by buying us coffee ($5) or help with server cost ($10)

Donate via Paypal Become our Patreon

Thank you for your support!

Follow Us on Twitter!