The best free resources to learn web development
Web development means developing websites or web applications which also includes developing APIs, designing UI/UX, database design and many more. It consists various technologies like HTML, CSS, JavaScript etc. In this blog, I will share with you a complete roadmap to develop web applications with the best free resources available on the internet to learn these technologies.
Web development is one of the best things to learn and it is hard to imagine any web solution without involving web technology in it.
Even if you are planning to develop a mobile application you may need to interact with a database or server using API or perform authentication there you will need web-specific tech. If you are developing a machine learning or some data science application web technology is the best way to showcase your project.
So web development is one of the best skills a developer can learn in the current era.
Here I am going to tell you a complete roadmap for development with some best free resources to learn it.
Basics
First of all the three most important skills to start and learn web development are -
If you are trying to be a frontend developer or full-stack developer then these three are the basics and you should have a good grasp over these even if you just want to be a backend developer still I would highly recommend you to know the basics of these.
UI Libraries
Apart from these, there are more libraries but these are the popular ones.
Frontend / Single page application
These days Single page applications are mainly used so these are the most famous libraries and frameworks for developing single page application.
I would suggest you, learn any one of these. Once you master anyone you can easily switch to others if required.
React would be better to start with.
Database
Now if you are thinking to move towards backend development then I would suggest you to have a basic understanding of Database and SQL.
If you want to get into NoSQL databases and then I would suggest starting with MongoDB and understanding how document-based database works.
Backend
Once you know the basics of databases you are good to go with backend development. For backend development, you should know any one programming language and a framework related to that programming language.
If you are a beginner I would suggest you focus and master a programming language and its framework and don't get distracted by the fascinating names. All languages and frameworks are good and it depends on the purpose of developing the application and which language and frameworks suits best for your application.
Full Stack
Some frontend and backend technologies with a language when combined gives a better developing experience and they are very much popular in the community.
- MERN stack - MongoDB Express.js React Node.js
- MEAN stack - MongoDB Express.js Angular Node.js
- Django and React
Docker
Once you are done with application development and if it involves various technologies and dependencies then it's a bit complex to ship your application in the various environments. To avoid such a situation use the following -
Dockerizing your application is not important if dependencies are less and you don't want to get into the complexities then you skip this deploy your app.
Extra
Once you are able to develop a web application I would suggest you to understand the following topics -
- Deployment
- Websockets
- Background tasks and Task scheduling
- Caching
- Load balancing
- Proxy server
Now I will tell you all the free resources to learn all of the above mentioned technologies.
HTML
Videos
- HTML Full Course - Build a Website Tutorial by freeCodeCamp.org
- HTML Tutorial for Beginners: HTML Crash Course by Programming with Mosh
Documents
CSS
Videos
- CSS Tutorial - Zero to Hero (Complete Course) by freeCodeCamp.org
- CSS Tutorial for Beginners by EJ Media
Documents
HTML and CSS
- HTML & CSS Crash Course Tutorial by The Net Ninja
- Learn HTML5 and CSS3 From Scratch - Full Course by freeCodeCamp.org
JavaScript
Videos
- Modern JavaScript Tutorial by The Net Ninja
- JavaScript course by Hitesh Choudhary
- JavaScript Programming - Full Course by freeCodeCamp.org
- Learn JavaScript - Full Course for Beginners by freeCodeCamp.org
- Object Oriented JavaScript by The Net Ninja
Documents
Booostrap
Videos
- Bootstrap 5 Tutorial by The Net Ninja
- Bootstrap 5 Crash Course | Website Build & Deploy by Traversy Media
Documents
Tailwind CSS
Videos
- Tailwind CSS Tutorial by The Net Ninja
- Build & Deploy a Personal Portfolio with TailwindCSS - 2022 Edition by DesignCourse
Documents
React
- ReactJS Tutorial for Beginners by Codevolution
- Full React Course 2020 - Learn Fundamentals, Hooks, Context API, React Router, Custom Hooks by freeCodeCamp.org
- Full Modern React Tutorial by The Net Ninja
- React JS Full Course for Beginners | Complete All-in-One Tutorial | 9 Hours by freeCodeCamp.org
Angular
Vue
Database
- SQL Tutorial - Full Database Course for Beginners
- Database Design Course - Learn how to design and plan a database for beginners
- Database Systems - Cornell University Course (SQL, NoSQL, Large-Scale Data Analysis)
- MongoDB Tutorial For Beginners | Full Course
JavaScript on Node.js - Express
Here only JavaScript framworks resources are mentioned. JavaScript tutorials are already mentioned above.
Videos
- Node.js and Express.js - Full Course by freeCodeCamp.org
- Node.js / Express Course - Build 4 Projects by freeCodeCamp.org
- Node.js Crash Course Tutorial by The Net Ninja
- Node.js and Express.js - Full Course by freeCodeCamp.org
Documents
Python - Django / Flask
Python
- Python Tutorials by Corey Schafer
- Python for Beginners (Full Course) | Programming Tutorial by Telusko
Django
- Django Tutorials by Corey Schafer
- Python Django 7 Hour Course by Traversy Media
- Django Rest-framework by CodingWithMitch
- Learn Django Rest Framework by Very Academy
Flask
- Flask Tutorials by Corey Schafer
- Flask Course - Python Web Application Development by freeCodeCamp.org
C# - ASP.NET Core
- C# Tutorial - Full Course for Beginners by freeCodeCamp.org
- .NET 5 REST API Tutorial - Build From Scratch With C# by freeCodeCamp.org
Full Stack
- Learn The MERN Stack by Traversy Media
- MERN Stack Full Tutorial | User authentication, JWT, Node.js, MongoDB, React and more by codedamn
- Django + React Notes App by Dennis Ivy
- E-commerce Website With Django and Vue Tutorial (Django Rest Framework) by freeCodeCamp.org
