Monday, March 1, 2021

Fundamentals Of The Web

There are 3 core languages you need to master to make a reliable and good looking web application on the client side.

You have a markup language in HTML, a styling language in CSS and a programming language in JavaScript.

If we were to use building a house as a metaphor for these 3 fundamentals:

  • HTML is like the internals of the building to make it strong, without a well built base structure a house would be very difficult to style or just generally not be functional
  • CSS is like the coat or paint you apply to a house, a house with perfect internals but no styling wouldn't be functional, good CSS makes websites look beautiful
  • JavaScript is like the extra functional requirements to make a house complete, an example might be a house without lights or heating, you could theoretically live without these things in certain situations but you'll nearly always need them in some regard, JavaScript makes web apps dynamic and performant

With HTML you can add actual elements to a page like headings, paragraphs, images, links, forms and inputs. With CSS you can style these elements adjusting fonts, alignment and colours. You implement some kind of design. With JavaScript you can fetch content from remote resources, listen to user events (clicks, scrolls, form submissions) and dynamically add markup or style.

One final important web fundamental to understand is the concept of an HTTP request. This protocol is the way in which a client (like Chrome) communicates with a web server. A web server is a computer that stores all the assets needed for a website to render. The web server receives a request and sends these assets back as a response to the client. The client is then smart enough to take these assets and turn them into a site.

Every time you type in a url into the browser url bar and press return you are making an HTTP GET request to a web server. In some ways you can think of a web browser as an HTTP request machine.