You want to learn HTML & CSS but don't know where to get started?
In this article, I prepared a list of resources for everything you need to learn HTML and CSS, but also for the next steps on your journey, like hosting for your projects, CV generators, websites to find a job, and much, much more. Enjoy.
Choose a Code Editor:
💻 Visual Studio Code [VS Code]
💻 Sublime Text
💻 Atom
💻 Brackets
💻 Vim
Learning Platforms:
📌 freecodecamp.org
📌 sololearn.com
📌 developer.mozilla.org
📌 w3schools.com
📌 khanacademy.org
📌 codecademy.com
📌 frontendmentor.io
Books:
📚 HTML and CSS: Design and Build Websites, by Jon Duckett
📚 Web designing books by Nick Pettit
📚 The Essential Guide to CSS and HTML Web Design, by Craig Grannell
📚 Smashing CSS, by Eric Meyer
📚 HTML5 and CSS3 All-in-One Book For Dummies, by Andy Harris
YouTube Channels:
▶️ Traversy Media
▶️ freeCodeCamp
▶️ DesignCourse
▶️ The Net Ninja
▶️ Dani Krossing
▶️ Web Dev Simplified
▶️ Florin Pop
Newsletters:
📨 Accessibility Weekly
📨 CSS Weekly
📨 Responsive Design Weekly
📨 Frontend Focus
Learn CSS by playing games:
🎮 CSS Diner
🎮 Flexbox Zombies
🎮 Grid Garden
🎮 Flexbox Defense
🎮 Flexbox Froggy
🎮 CSS Battle
Docs:
📜 cssreference.io
📜 cssvalues.com
📜 devdocs.io/css
📜 developer.mozilla.org/en-US/docs/Web/CSS
📜 w3schools.com/cssref
📜 w3.org
Glossary:
📘 codecademy.com/articles/glossary-html
📘 codecademy.com/articles/glossary-css
Free HTML/CSS templates:
⚒️ inovatik.com
⚒️ templated.co
⚒️ tooplate.com
⚒️ html5up.net
⚒️ mobirise.com
⚒️ templatemo.om
⚒️ uideck.com
⚒️ freehtml5.co
UI inspiration
⧩ siteinspire.com
⧩ uimovement.com
⧩ uigarage.net
⧩ collectui.com
⧩ behance.net
⧩ awwwards.com
⧩ sitesee.co
⧩ onepagelove.com
⧩ dribbble.com
Find icons for your project:
fontawesome.com
flaticon.com
icons8.com
iconmonstr.com
freepik.com
heroicons.dev
simpleicons.org
tablericons.com
css.gg
Choose font for your project:
✍️ fonts.google.com
✍️ fontspace.com
✍️ 1001fonts.com
✍️ fontsquirrel.com
Done with learning? Deploy your projects:
⧩ Netlify
⧩ Firebase
⧩ AWS
⧩ Heroku
⧩ Github Pages
⧩ Vercel
⧩ Surge
⧩ Render
⧩ Gitlab Pages
⧩ Stormkit
⧩ Azure
⧩ Hostman
Done with projects? Make a CV:
📋 resume.io
📋 visualcv.com
📋 resume.com
📋 novoresume.com
📋 wtfresume.com
📋 resumake.io
📋 flowcv.io
Apply for jobs:
💼 stackoverflow.com/jobs
💼 flexjobs.com
💼 remote.co
💼 justremote.co
💼 weworkremotely.com
💼 remoteok.io
💼 jobspresso.co
💼 europeremotely.com
💼 wfh.io
A bonus: Use this CSS Button Generator To create stnning buttons for you projects.
Good luck! ❤️
If you liked this article, be sure to ❤️ it.
Initially created on Twitter:
Let's keep in touch:
Blog: markodenic.com
Twitter: @denicmarko
Github: github.com/MarkoDenic
Codepen: codepen.io/denic