Comprehensive guide to HTML and CSS

#html #css #webdev

There are three components that go into frontend development - html, css and javascript.

HTML is the structure of the website.
CSS is the styles on the website.
Javascript brings in functionality to the website.

HTML and CSS are not programming language per se(people have been debating about it for ages.)
But Javascript is a programming language.

At a beginner level, you can create AMAZING, STUNNING websites with just HTML and CSS.

HTML and CSS are super easy to learn, believe me.
But it takes time to master the art of using them in websites to create compelling layouts like the one in the below photo.

First step is to get good at HTML and CSS, here are a few resources for you -

Learning Platforms -

Freecodecamp - Awesome platform to interactively learn web development, I can't stress on how complete it is. All for free.
Codecademy - It's mostly a paid platform but their basic HTML and CSS course is free! Worth giving a look.
Scrimba - An interesting platform for sure. Think of it as interactive courses. You can look at and edit the code while you're watching the course! Tons of free courses over here!

Crash courses on Youtube(GOLD) -

Basic tutorials through projects -

Best websites/blogs -

Instagram carousels worth checking out -

(I truly believe there's a lot of value all over Instagram, you just gotta dig it up)

Basics of HTML and CSS by @iamharsh.dev -CSS Crash Course by @iamharsh.dev

Tools -

Websites that can make your life easy as a frontend developer.

coolors.co - Generate beautiful color palletes.
Unsplash - Find stock images for your project.
Fontawesome - ICONS(free and paid)
Heroicons - ICONS(all free)
Google fonts - Find fonts for your website.
uiGradients - Amazing gradients for your UI!
Box shadow generator

Conclusion -

Once you're good at HTML and CSS, dive into Javascript and Javascript frameworks.
A nice way to practice is to pick up a Frontend Mentor Challenge and trying to solve those.
One other thing that works really well for me is watch youtube videos where a person is making a website, be it a tutorial or live stream, it really exposes the ideology that goes behind breaking the website into pieces and implementing it.

If any of y'all want to contact me, hit me up on Instagram at @manan.code.

All the best on your journey into frontend web development!