Some Cool Frontend Resources 🛒
Tags: webdev, frontend, beginners, 100daysofcode
Published: 2020-04-16 13:43:06

>"Frontend gives another kind of joy as you can see your imaginations turning into reality live with just a few lines of code." ~ Me 😉

A lot of people ask me about where to start or from where to learn front-end. An answer to this is - There are a lot of skills required for front-end but basically you need just HTML, CSS & JAVASCRIPT. I have talked about these in my previous [blog](https://dev.to/thecoollearner/frontend-development-48ko). And in this blog, I'm gonna share three resources for the same.

These resources are awesome and most importantly it's **free** so it would not be a barrier for anyone to start learning.😊

---

The first resource that I would recommend is **MDN web docs** by Mozilla. It is a great collection of documents and tutorials for HTML, CSS, JAVASCRIPT and a lot more. 

Its tagline is - *Resources for developers, by developers.*

The contents for each is divided into three parts-

1) *Introduction* - To learn what it is and how to use it.

2) *Tutorials* - A collection of tutorials and examples to learn about them.

3) *Reference* - A rich collection of details about properties, elements, etc.
 
Here's the link to the website ~ [MDN web docs](https://developer.mozilla.org/en-US/)

---

The second resource is **W3 Schools**. It covers almost everything you need as a web developer. One cool feature it provides is **Try it Yourself>>** section.
It contains an online editor with a pre-written code of the concept you are learning and you can play with code and change it and you can run it there only and can see the effects of the changes. It makes learning concepts easier.

The contents are divided into four parts -
1) Tutorials 2) References 3) Examples 4) Exercises

Here's the link to the website ~ [W3 Schools](https://www.w3schools.com/)

---

The third one is my favorite. It's the **freeCodeCamp**. It provides a well-planned curriculum to be a fullstack developer. You would be amazed by the interface it provides for learning and also the way you'll be learning the concepts. And on top of that a cherry on the cake, it provides certifications!!!

It provides six courses(& certificates for each course) -

1)Responsive Web Design

2)JavaScript Algorithms and Data Structures

3)Front End Libraries

4)Data Visualization

5)APIs and Microservices

6)Information Security and Quality Assurance

**+** Once you've earned the following freeCodeCamp certifications, you'll be able to claim The Full Stack Developer Certification.😊

Explore ~ [freeCodeCamp](https://www.freecodecamp.org/learn)

---

🎁 Bonus Section -

I'm gonna talk about two more things -

1) **Bootstrap** - Bootstrap is a giant collection of handy, reusable bits of code written in HTML, CSS, and JavaScript. It's also a front-end development framework that enables developers & designers to quickly build fully responsive websites.

The official site contains everything you need to know about this - Documentations, Examples, How to use, etc.

Official site ~ [Bootstrap](https://getbootstrap.com/) 

2) **React** - It is an open-source JAVASCRIPT library that is used for building user interfaces. It is used for single-page applications.

Here's an awesome collection of resources for learning React curated by [Andrew Z](https://twitter.com/AndrewZer) - Here's the link to the site ~ [React Finder](https://react-finder.netlify.app/courses/react)

---

Thanks for reading. I hope this blog would help you.😊   

Happy Coding.💻