Best hands-on learning web development resource: freecodecamp.org, scrimba.com
- Intro
- Git
- HTML
- CSS
- Javascript
- Html,css and javascript all in one courses
- SASS
- Bootstrap
- Front-end playgrounds
- Javascript frameworks (React,Angular and Vue)
- SQL
- Back-end frameworks (Django,Express js,spring boot)
- Deploy
- How does the INTERNET work?
- How websites work
- Frontend vs Backend vs Fullstack Web Development
- How The Backend Works
- Dynamic Websites vs Static Pages vs Single Page Apps
- Web Developer vs Web Designer
- What is HTTP and Why Web Is Built On It?
- What is HTTPS
- What is an API?
- Domains and the Domain Name System
- Difference between cookies, session and tokens
- Top 5 Code Editors for Web Developers in 2019
- 10 Best Visual Studio Code Extensions for Web Development
- Back to table of contents
What is Git?
Git is a distributed version-control system for tracking changes in source code during software development.It is designed for coordinating work among programmers, but it can be used to track changes in any set of files. Its goals include speed, data integrity, and support for distributed, non-linear workflows
What is Github?
GitHub is a website and cloud-based service that helps developers store and manage their code, as well as track and control changes to their code.
- Introduction to Git and GitHub (coursera)💰
- Git Tutorial | What is Git? | Github ➡️ Git and GitHub for Beginners - Crash Course
- Learn Git (codeacademy)
- Install Git on windows
- Install Git on linux
- Git cheat sheet
- Markdown cheat sheet
- Hands on Git
- Github Alternatives
- Back to table of contents
HTML (HyperText Markup Language) is the most basic building block of the Web. It defines the meaning and structure of web content.
- Introduction to HTML (scrimba)
- Introduction to HTML5 (coursera)💰
- Learn HTML (codeacademy)
- HTML tutorial (w3schools)
- HTML Full course
- Documentation
- Back to table of contents
CSS is the language we use to style an HTML document. CSS describes how HTML elements should be displayed.
- Intro to css (scrimba) ➡️ css grid (scrimba)
- Learn css (codeacademy)
- Intro to css
- Introduction to css3 (coursera)💰
- CSS Tutorial (w3schools)
- Learn css animations
- Documentation
- Back to table of contents
JavaScript (JS) is a lightweight, interpreted, or just-in-time compiled programming language with first-class functions.
- Intro to javascript (scrimba) ➡️ Modern javascript (scrimba)
- Learn to Program in Javascript: Beginner to Pro (udemy)💰
- Intro to javascript (codeacademy)
- JavaScript Tutorial (w3schools)
- JavaScript Promises
- JavaScript Async Await
- Javascript Dom Manipulation
- Vanilla javascipt project
- jQuery Tutorial For Beginners
- Build a Netflix Landing Page Clone with HTML, CSS & JS
- REST API concepts and examples
- Fetch API & Rendering Data with JavaScript
- Build A Weather App
- What is JWT
- Documentation
- Back to table of contents
- HTML, CSS, and Javascript for Web Developers (coursera)💰
- Web Design for Everybody: Basics of Web Development & Coding Specialization💰
- The Complete 2020 Web Development Bootcamp💰
- Back to table of contents
Bootstrap is a free and open-source CSS framework directed at responsive, mobile-first front-end web development. It contains CSS- and JavaScript-based design templates for typography, forms, buttons, navigation, and other interface components.
- Documentationn
- Learn bootstrap (scrimba)
- Complete Bootstrap 4 course - build 3 projects (udemy)💰
- Learn bootsrap (codeacademy)
- Back to table of contents
Sass is a CSS pre-processor. Sass reduces repetition of CSS and therefore saves time.
- Documentation
- Sass Tutorial for Beginners
- Sass Crash Course
- Learn Sass (codeacademy)
- Sass Tutorial (w3schools)
- Back to table of contents
React is an open-source, front end, JavaScript library for building user interfaces or UI components. It is maintained by Facebook and a community of individual developers and companies.
- The React Bootcamp (scrimba) ➡️ Learn React Hooks (scrimba)
- Learn React (scrimba)
- Front-End Web Development with React (coursera)💰
- Modern React with Redux (udemy)💰
- React JS Crash Course
- Building a chat app with React and Chatkit (scrimba)
- Build a COVID-19 Tracker Application - React JS Project (Hooks, Material UI, Charts js)
- 10 React Starter Project Ideas to Get You Coding
- Docs
- Back to table of contents
AngularJS is a JavaScript-based open-source front-end web framework mainly maintained by Google and by a community of individuals and corporations to address many of the challenges encountered in developing single-page applications.
- Build your first Angular app (scrimba)
- Front-End JavaScript Frameworks: Angular (cousera)💰
- Angular - The Complete Guide (udemy)💰
- AngularJS Tutorials
- Angular Crash Course
- Corona Covid-19 Cases Tracker
- Create Angular Project from Scratch
- Docs
- Back to table of contents
Vue.js is an open-source model–view–viewmodel front end JavaScript framework for building user interfaces and single-page applications. It was created by Evan You, and is maintained by him and the rest of the active core team members coming from various companies such as Netlify and Netguru.
- The Vue Bootcamp (scrimba)
- Learn Vue.js (scrimba)
- Vue - The Complete Guide (udemy)💰
- Learn Vue.js
- Vue JS Crash Course
- Learn Vuetify (scrimba)
- Create an Hour Tracking App
- Docs
- Back to table of contents
SQL is a domain-specific language used in programming and designed for managing data held in a relational database management system, or for stream processing in a relational data stream management system.
- SQL vs NoSQL
- The Complete SQL Bootcamp 2020: Go from Zero to Hero (udemy)💰
- SQL Tutorial
- Learn SQL (w3schools)
- Back to table of contents
- Best backend frameworks
- Django Vs Flask
- Django (pyhon)
- MEAN vs MERN (watch before starting node)
- Node and Express js (MERN,MEAN) (javascript)
- Spring Boot(java)
- Back to table of contents
Django is a Python-based free and open-source web framework that follows the model-template-views architectural pattern. It is maintained by the Django Software Foundation, an American independent organization established as a 501 non-profit.
- Django for Everybody Specialization (coursera)💰
- Django Masterclass : Build Web Apps With Python & Django (udemy)💰
- Python Django Web Framework
- Django Project Ideas
- How to Build an E-commerce Website
- Django REST Framework Full Course For Beginners
- Create a Twitter-like App with Python Django JavaScript and React
- How to Work with AJAX in Django
- Django search filter with Ajax
- Upload multiple images to a post in Django
- Docs
- Back to table of contents
Express.js, or simply Express, is a back end web application framework for Node.js, released as free and open-source software under the MIT License. It is designed for building web applications and APIs. It has been called the de facto standard server framework for Node js.
- Server-side Development with NodeJS, Express and MongoDB (coursera)💰
- Full-Stack Web Development (coursera)💰
- Express.js Node.js & MongoDB (coursera)💰
- MERN Stack Front To Back: Full Stack React, Redux & Node.js (udemy)💰
- Angular & NodeJS - The MEAN Stack Guide (udemy)
- Express JS Crash Course
- Learn the MERN Stack
- Build a Whatsapp Clone with MERN Stack (MongoDB, Express, React, Node JS)
- MEAN Stack Tutorial
- Docs
- Back to table of contents
The Spring Framework is an application framework and inversion of control container for the Java platform. The framework's core features can be used by any Java application, but there are extensions for building web applications on top of the Java EE platform.
- Maven Tutorial for Beginners
- Hibernate Tutorial
- Spring & Hibernate for Beginners (includes Spring Boot) (udemy)💰
- Spring Boot Tutorials
- Spring Boot Java Tutorial - REST API using PostgreSQL and JWT
- Docs
- Back to table of contents
- Host a static website for FREE on GitHub
- GitHub Pages Deploy & Domain (React)
- Deploy An Angular App To Firebase
- Deploy a Django App to Heroku
- How to deploy a MERN Stack App to Heroku
- Running Spring Boot Application on Heroku
- Full Node.js Deployment - NGINX, SSL With Lets Encrypt
- Back to table of contents