clement-h-544786-unsplash.jpg

Coder Dancer
Helping new comers to Web Programming or Dancing by sharing my insights and explaining in simple terms.

What is Html and CSS. What are pitfalls ?

conceptual-education-game-1591061.jpg

A friend learning programming told me other day

"You can learn html, CSS just in 2 days. It's just syntax"

Depend what you mean by learn.

If you can write "Hello world" in python you are programmer.

If you can write web application to manage your day you are programmer.

There is big gap between two programmers yet both can be argued to be true.

Basic

(Explain Like I'm Five)

ELI5: Bunch of texts webrowsers like chrome, firefox understands on how show to show stuff to you.

HTML stands for Hyper Text Markup Language.

CSS stands for Cascading Style Sheets.

Sounds complicated but all it are set of text instruction browsers understands, which say what should go where and how it should look.

Let's take look at few simple examples.

content01.png

Example 1: Different html elements.

content02.png

Example 2: Styling html elements "in-line".

content03.png

Example 3: Styling html element in CSS.

My insights - Pitfalls and confusion

TLDR:

  • Fast moving area without clear standards. Which front-end framework to learn? React? Angular? Vue? Just do server side rendering?
  • No standard way and multiple ways of doing styling. In-line style? CSS? SCSS? LESS? Is CSS improving enough people are coming back?

Another friend far down in this journey, who created his own AI for trading adviced me not to go into programming because it is in content state of chance, much more so than other areas.

When I was learning SPA(single page applications) such as React, Angular, Vue was starting to becoming popular and most of the tutorials were dominated by Ruby on Rail type of frame work where server does all the work to create html, css and your browser mostly shows the document (aka render the document).

During this time general census of good practice was html should only content elements and css should contain all styling.

However with rise of client side rendering there is no standard way that is considered good. Part where I really felt CSS has lot of disadvantages is when I start learning React Native. It doesn't support CSS and all styling has to be done in-line. This makes it even harder to transition from React to React Native if everything is in CSS.

With javascript doing style manipulations, it's much easier to keep and built logic in-line.

But it's great if you are being concerned about these issues because that means you're on your journey. Having new problems are better than being stuck on old problems.