List of useful resources related to web development. This list is being updated and expanded upon regularly as part of my personal learning journey. All resources are freely accessible or have free tiers unless otherwise noted.
In-Depth Courses
These sites offer detailed and time-intensive courses that are worth dedicating extended periods of time to.
- Scrimba - *highly recommend! Free & paid tiers (worth it). Unique learning platform with interactive video tutorials, aka scrims. Recommended by MDN.
Practice
These sites are best for quick practice sessions and refreshers.
- Sololearn - Available online and as a mobile app. The mobile app is great for practice questions on a variety of topics. There is also a nice social aspect to the platform that allows users to share and comment runnable code in multiple languages, including html/css/javascript.
How-To Guides and Tutorials
One-off tutorials/guides on specific topics/tasks.
General
- CSS Cheat Sheet
- Inheritance - (Stack Overflow) List of all inheritable properties.
Fonts
- Web Safe Fonts - (w3schools)
- @font-face - (MDN)
General
- HTML Cheat Sheet (quickref.me) -
- Elements (MDN) - List of all HTML tags
- 'lang' attribute (MDN) -
- Replaced elements (MDN) - Replaced elements are elements whose contents are not affected by CSS, such as <img>, <video>, <audio>, & <iframe>.
Accessibility
- ARIA (MDN) - ARIA roles and attributes.
General
Free hosting
- Netlify - free/paid tiers with option to deploy directly from GitHub repositories.
Colors
- Coolors - Color palettes. Offers option to create/save palettes from scratch or by picking colors from an image.
- Color Hunt - Free color palettes for designers and artists.
Fonts
- Google Fonts - Go-to source for free fonts that can be embedded or downloaded.
- 1001 Fonts - Downloadable free and paid fonts; more unique/specific fonts than what can be found on Google Fonts.
- NerdFonts - Great source for free glyphs/icons as well as dev fonts that can be used on OS platforms as well as in web projects.
- Emojipedia - Quick search for copy/paste emojis.
Images
- Unsplash - Free high-quality images.