A website is a series of interlinked pages (documents).
The web has been around for over 30 years. From the humble HTML to the more dynamic JavaScript it has evolved and advanced over the years.
Web history
The origins of the World Wide Web trace back to 1989 when British computer scientist Tim Berners-Lee, working at CERN (European Organization for Nuclear Research), proposed a system for sharing information across a network of computers. Berners-Lee’s vision was to create a universal information space that allowed researchers to easily access and link documents. He developed key technologies like HTML (Hypertext Markup Language), HTTP (Hypertext Transfer Protocol), and the first web browser.
The first website was launched in 1991 and explained how the web worked and how others could create websites. Initially aimed at scientific collaboration, the web quickly expanded, becoming a revolutionary tool for communication, commerce, education, and more. Today, it is a fundamental part of the internet, shaping the digital world we live in.
How a website functions: Backend & Frontend
A website functions by retrieving pages (data) from a server (backend) through an http protocol to the client (frontend). Data can be anything from page documents, images, videos, JSON etc.
When a user enters a URL the browser tries to find where the server resources are located. This is called DNS resolution. It passes the domain name to a DNS server which converts the human readable domain name to an IP address pointing to the server.
Once the source server is found the requested URL path resources are returned to the browser.
The backend has all the background and unseen processes and resources needed for the website to function. These include the server, server software like Apache and PHP, databases, and files.
The backend handles all the logic before sending data to the frontend. It also processes all the user data sent to it like login credentials.
Once data is processed it is sent to the frontend. The frontend is the client facing side of a website – typically a browser.
For a typical webpage these are sent:
- The HTML document
- CSS stylesheets
- JavaScript files
- Images
The browser links all the files and renders the page to the client.
Backend Languages & Technology
For a computer to function as a server some softwares must be installed first. These softwares varies from server to server. Some popular server softwares (or languages) are Apache, Nginx, Nodejs PHP, Python Django
Apache
Apache is one of the popular servers powering many websites.
Apache is a free, open-source web server software developed by the Apache Software Foundation. Launched in 1995, it is one of the most widely used web servers in the world. Apache serves as a middle layer between a user’s browser and a website, processing requests and delivering web content (like HTML pages, images, and files) to users.
PHP
PHP is a server software used to handle logic between server and client data. In technical terms it is a scripting programming language. It handles formating, structure, and logic of data. For example, PHP handles all form submissions like login and signup forms.
It will handle logic like detecting invalid passwords. It also handles and formats the HTML text to show to the frontend.
PHP is versatile because it can be embedded in HTML documents. The php code runs and is evaluated on the server before being sent to the client frontend as HTML. Here’s how it works below.
Primarily, this is what PHP was used for before becoming a fully fledged programming language.
PHP is used by many websites because of its robust features and simplicity. Nearly 80% of all websites are powered by PHP. WordPress runs on PHP powering about 45% of the web.
Nodejs
Nodejs is a new kid on the block in terms of server side technologies. Nodejs is a web server running on JavaScript. It is single threaded and event driven capable of handling many requests on one thread. This makes Nodejs ideal for websites that do a lot of queries and requests like live chats. It was released in 2009. Since then it has paved the way for dynamic websites and apps.
Databases
Apart from raw files servers also have databases installed on them. Databases allow the storage of huge amounts of data in a more robust structure using rows and columns (fields). They make data insertion and retrieval (CRUD operations) easy and fast.
Popular web databases are MySQL, MongoDB for Node, Microsoft SQL, Reddis and PostgresSQL.
Frontend Technology
The frontend is the user facing side of a website typically accessed through a browser. The browser must render the HTML page with all the CSS, JavaScript, and other files like images.
An HTML page isn’t the only thing browsers can render. Any data requested from the server can be displayed like JSON objects, XML or standalone files.
HTML
HTML stands for Hyper Text Markup Language and is responsible for web page formatting. It denotes headings, paragraphs, hyperlinks, images and more.
HTML uses specific tags to markup a line or block of text into a certain format. Here’s an example:
CSS
CSS stands for Cascading Style Sheets and is used for styling a web page. It is responsible for colouring, fonts, layout and other styles like shadows. Here’s CSS in action.
CSS Cascades meaning that it overwrites a previously applied style into the newly defined style.
Although CSS is not deemed a programming language it has some programming paradigms to it like curly brackets, semicolons, and logical syntaxes.
JavaScript
JavaScript is the primary programming language of web pages. It’s responsible for making web pages dynamic like auto completing text on inputs, animations, sliders, and getting data from server without a reload (Ajax).
JavaScript is a high level scripting language meaning it has an engine that interprets what you write into it and then compiles it into machine (computer) code.
Primarily JavaScript was used in browsers but is also now being deployed in servers as Nodejs.
