Note: This file only contains resources that are NOT in the ./knowledge-repositories file.
If you are completely new to web development, I HIGHLY RECOMMEND you visit these links first:
Roadmap to Web Development:
- Offline Documentation
- Command Line
- Programming Languages
- Web Frameworks
- Data Visualization
- Static Site Generators
- Text Editors and IDEs
- Regular Expressions and Algorithms
- Developer Tools
- Other Resources
- Velocity -
- Good First Issues - opportunities for contributing to open projects on GitHub
- Mozilla Developer Network(MDN) Docs--(Highly Recommended)-- - everything you need to learn to develop web applications. Probably the only resource you'll need to learn web development. It also contains well organized guides to Django Web Framework, Express and Node.js.
- freeCodeCamp.org--(Highly Recommended)-- - an excellent open source resource for learning web development in an interactive way. Recommended by MDN and also covers React and Redux, Node, Express, D3.js, Bootstrap, Sass, jQuery, JSON and MongoDB.
- The Odin Project - another excellent open source resource similar to the freeCodeCamp project. Covers Ruby, RubyOnRails.
- w3schools - While this site is pretty decent for quick syntax lookup and reference, I --DO NOT-- recommend this over MDN to learn -how to program-. Before choosing w3schools over above resources, please go through this hackernews thread and this site by the mods of r/learnprogramming. This site also has references to Ajax, Node, PHP, SQL, XML, Java, Python, ASP, Angular, jQuery, Bootstrap, C++ and Raspberry Pi.
- Deep Dive Into Modern Web Development - University of Helsinki - React, Node, Express, GraphQL.
- LambdaSchool Free Online Web Mini Bootcamp - HTML, CSS, JS
- Can I use... Support tables for HTML5, CSS3, etc
- Box-shadow generator - This tool lets you construct CSS box-shadow effects, to add box shadow effects to your CSS objects.
- Codrops - Web Dev and Design News.
- HTML Reference - A free guide to HTML.
- CSS Reference - A free visual guide to CSS.
- Marksheet - A free HTML and CSS Tutorial.
- What The Flexbox - a set of 20 free videos to learn CSS flexbox layout by Wes Bos. Also check his command line power user videos.
- CSSGrid.io - a set of 20 free videos to learn CSS grid layout by Wes Bos.
- Mozilla Grid Playground - Learn about CSS Grid Layout and the Firefox DevTools layout panel.
- Grid by Example.
- Flexbox Froggy - a simple 24 level game learn CSS flexbox.
- Flexbox Defense - Learn CSS Flexbox by playing a tower defense game.
- Grid Garden - Learn CSS Grid Layout by playing 28 different levels of Grid Garden.
- HTML periodic table
- All The Tags
- Web Design in 4 minutes - Learn the basics of web design in 4 minutes with this interactive tutorial
- CSS Gradient - free tool that lets you create a gradient background for websites and technical articles.
- CSS3 Cheat Sheet
- Official Python Docs - the official and easy to understand documentation of the Python programming language.
- Python Wiki
- Python for Non-Programmers
- Python for Programmers
- How To Think Like A Computer Scientist - a free online book recommended by MIT OpenCourseWare
- RealPython (GitHub: realpython/materials)
- Google's Python Class
- Python Discord
- Full Stack Python
- William Vincent's Blog
- Ned Batchelder's Blog
- Trey Hunner's Blog
- Python Developer’s Guide - A comprehensive resource for contributing to Python.
- Official React Docs
- Official Tutorial for building a small game using React
- React Tutorial by MDN
- Overreacted - Dan Abramov, Creator of ReduxJS.
- Josh W. Comeau - Josh W. Comeau, Developer @GatsbyJS.
See Also HotFrameworks
- ObservableHQ D3.js Tutorial - Mike Bostock, Creator of D3.js.
Interactive Online Code Editors:
- NoDesign.dev - A collection of tools for developers who have little to no artistic talent.
- ColorBox - a color tool to produce color sets.
- Figma - collaborative interface design tool
- svgator - SVG Animation Creator
- Neumorphism.io - Soft UI CSS shadow generator.
- Canva - Create beautiful designs with your team.
- JSONPlaceholder - Fake online REST API for developers
- Cloudflare - The Integrated Global Cloud Platform.
- Heroku - Build data-driven apps with fully managed data services.
- Netlify - Netlify is everything you need to build fast, modern websites: continuous deployment, serverless functions, and so much more.
- GitHub Pages
- GitLab Pages
- ZEIT Now - The easiest way to deploy websites.
- surge - Static web publishing for Front-End Developers.
- Render - unified platform to build and run all your apps and websites with free SSL, a global CDN, private networks and auto deploys from Git.
- Postman - The Collaboration Platform for API Development.
- Webframe - Beautiful Screenshots showing webapp designs.
Technology Lookup Tools
- web.dev - learn to build for the modern web.
- Extension Workshop - Get help creating and publishing Firefox add-ons that make browsing smarter, safer, and faster.
- The changelog
- DigitalOcean Community Tutorials
- freeCodeCamp Guide - articles about all things related to programming.
- Rosetta Code
- GeeksforGeeks - A computer science portal for geeks
- thoughtbot Blog - Giant Robots Smashing Into Other Giant Robots.
- Twilio Tutorials
- scotch.io - fun and practical web development tutorials.
- Pusher Developer Tutorials
- Cooperpress - Weekly email newsletters to developers and software engineers.
- RisingStack Blog
- A List Apart