Hello Fellow Codenewbies 👋,
When it comes to learning, what type are you?
Do you like to read, watch tutorials, or combine both?
I am a combination of both, but more to the audio-visual side. I can absorb more information through watching and coding along with tutorials.
In this post, I will share some resources that I recommend in learning to code. Specifically in learning front-end development.
So here they are in no particular order.
PS: Click on the link to get you to the website.
📺 Watch And Learn
Udemy is a paid online learning platform. It often gives deals to buy a course starting from USD 9.99.
You can get a refund within 30 days of purchasing if the course doesn't suit you.
And when you finish a course, you will get a completion certificate.
Tips in choosing a course on Udemy:
- Take your time to look at the curriculum. Watch the previews of the course that interests you to give you a sense of the instructor's teaching style.
- Take a look at how many students enroll in the course, the course ratings, and the instructors. These would be the indications of how good the course is.
You can find plenty of tutorials and crash courses on YouTube, especially if you want to get a quick pick-up on a topic.
A few front-end developers' channels that I follow:
Traversy Media, Web Dev Simplified, The Net Ninja, Dev Ed, Kevin Powell, Code with Ania Kubów.
Watch And Code is a course by Gordon Zhu. The introductory course, Programming Foundations, is free.
I personally only took the introductory course, and I've learned a lot from it.
Later on, if you would like, you can subscribe to its premium version after passing the entrance exam.
This free course by Wes Bos will guide you to learn CSS grids in 25 tutorial videos.
📚 Let's Read
It is the go-to resource for all web developers.
It provides articles, guides, and more for anything related to CSS and front-end development in general.
Do you want to build a project but don't have any idea?
Frontend Mentor provides 30+ free project challenges for you to build from scratch.
The challenge is to build the projects as close as possible to the provided designs.
With the premium version, you can unlock more challenges and features.
⌨ Interactive & Game-Based Learning
freeCodeCamp is a free platform to learn to code.
The tutorials are reading materials, and it has its own text editor for you to write and run codes.
By the end of each curriculum, you can earn a certificate by completing 5 required projects.
You can also subscribe to its YouTube channel to watch tutorials.
Scrimba is an online front-end development learning platform.
The unique thing about this platform is its interactive code-learning tools. It allows you to code along with the instructors during the lessons.
There are 30+ free courses available.
If you do The Frontend Developer Career Path (paid version), you will also get access to all Scrimba's pro courses.
Do you like games? Also, do you have trouble grasping how Flexbox in CSS works?
Then you should try Flexbox Froggy.
It is a free game-based tutorial to learn flexbox.
By writing the right flexbox syntax, you will move the frog(s) to where they should go.
Flexbox Zombies is another free game-based tutorial to learn flexbox by Dave Geddes.
In this tutorial, you will direct the zombie's hunter to the zombies with the right flexbox syntax.
Add to the fun, it has sound effects!
Do you have any other free (or affordable) resources that you use and recommend?
You can drop them in the comment below 😊
Last but not least, you can also find me on Twitter, and let's connect! 😄
Thank you for reading!