HTML 5 CSS JavaScript

Static web development

Static web development is the basic form of web development to produce basic websites that are not complex.

HTML, CSS and JavaScript are the building blocks of web development.

You may think of HTML, CSS and JavaScript as a house, where HTML is the framework, CSS is the furnishing, and JavaScript is the electrical. The HTML serves as a framework where things are organized to, such as the navigation links of the website. The CSS adds styling to the website such as color, spacing and fonts. JavaScript are like the light switches of the house, where you can define what happens when a button is clicked.

Getting started

BRAP.dev is ready for web development.

This hello-world.html file is an HTML document that displays "Hello, World!" in the web browser:

<html>
    <head>
        <title>Hello, World!</title>
    </head>
    <body>
        Hello, World!
    </body>
</html>

To run it in the web browser, click the Go Live at the button at the bottom-right of VS Code. Then select the hello-world.html in the web browser:

Hello, World in HTML running in the web browser via VS Code Live Server extension

Screenshot: Hello, World in HTML running in the web browser via VS Code Live Server extension

To run it alternatively, you may open a terminal and run serve:

Hello, World in HTML running in the web browser via VS Code Live Server extension

Screenshot: Hello, World in HTML running in the web browser via NPM serve

All together now

Here is a basic example website that uses HTML, CSS and JavaScript:

It has a basic title and a single paragraph. When you click the "Nice article!" button, it will alert "Thank you!".

A basic website using HTML, CSS and JavaScript

Screenshot: A basic website using HTML, CSS and JavaScript

Keywords

  • static website
  • html
  • css
  • javascript
  • web

Back to top