Technical Documentation

HTML5

To build websites, you should know about HTML — the fundamental technology used to define the structure of a webpage. HTML is used to specify whether your web content should be recognized as a paragraph, list, heading, link, image, multimedia player, form, or one of many other available elements or even a new element that you define.

HTML uses "markup" to annotate text, images, and other content for display in a Web browser. HTML markup includes special "elements" such as <head> <title> <body> <header> <footer> <article> <section> <p> <div> <span> <img> <aside> <audio> <canvas> <datalist> <details> <embed> <nav> <output> <progress> <video> and many others.

CSS3

Cascading Stylesheets — or CSS — is the first technology you should start learning after HTML. While HTML is used to define the structure and semantics of your content, CSS is used to style it and lay it out. So for example, you can use CSS to alter the font, color, size, and spacing of your content, split it into multiple columns, or add animations and other decorative features.

style {
        display: block;
        text-align: left;
        position: relative;
        background-color: #f7f7f7;
        padding: 15px;
        margin: 10px;
        border-radius: 5px;
      }

JavaScript

avaScript is a programming language that allows you to implement complex things on web pages. Every time a web page does more than just sit there and display static information for you to look at — displaying timely content updates, or interactive maps, or animated 2D/3D graphics, or scrolling video jukeboxes, and so on — you can bet that JavaScript is probably involved.

function pow(x, n) {
        let result = 1;
        for (let i = 0; i < n; i++) {
          result *= x;
        }
        return result;
      }

The JavaScript environment has grown huge. It has its own ecosystem of libraries, frameworks, tools, package managers and new languages that compile down to JavaScript.

jQuery
React
Angular
Vue
Ember

Git

Git is a free, open-source, distributed Source Code Management (SCM) system. It facilitates handling code bases with distributed development teams. What sets it apart from previous SCM systems is the ability to do common operations (branching, committing, etc.) on your local development machine, without having to change the master repository or even having write access to it.

git status
          git add .
          git push origin master

Design

With so many different types of devices able to browse the Web these days, responsive web design (RWD) has become a core web development skill. This module will cover the basic principles and tools of RWD, explain how to apply different CSS to a document depending on device features like screen width, orientation, and resolution, and explore the technologies available for serving different videos and images depending on such features.

When websites and web tools are properly designed and coded, people with disabilities can use them. However, currently many sites and tools are developed with accessibility barriers that make them difficult or impossible for some people to use. Making the web accessible benefits individuals, businesses, and society. International web standards define what is needed for accessibility.

<img src="img_chania.jpg" alt="Flowers in Chania">

Technologies and Tools used in Front End Web Development