HTML, CSS🎨 and JavaScript for Django🐍

Django not needed to build a website
- static website from HTML, CSS and JavaScript (JS) possible -> minimal requirements for a website

Table of Contents

Roles of Languages

webserver holds domain
user uses client (PC) to request a website
server returns response (sends data back to client)
- prepares HTML, CSS, JS (find files, do calculations -> produce new content from static files (dynamically))
- files already stored on the server; just sending and displaying static files (HTML, CSS, JS + maybe images) to client -> static website
- not simply serving HTML, CSS, JS -> dynamic website
  - dynamic website driven by backend (PHP, Django, Angular, Node.JS, …): does processing = generation of HTML, CSS, JS
  - if using Django for backend: advantage: use of all other Python modules possible (for calculations, Machine Learning (ML), etc.)
client needs web browser to display response
- browser understands and translates server response to a format which can be displayed by computer

generate dynamic content from static files (HTML, CSS and JS)
- trickiest part (more than 70% of the work, which a server has to do): generate static files
- once generation of files is done: send to client and server work is done
makes it easy to generate static files, based on the client request (e.g. asking for certain URLs)
- handles HTTP requests (most basic: GET and POST)
- server may also respond with HTTP code, which informs clients that access is denied or file shouldn’t be displayed…

events: click, press key, use shortcuts, drag item (to other div or container), submit form, …
events handled using JavaScript (programming language which works in the browser)

language of the web
builds basic skeleton of website
standard markup language, which gives static skeleton of a web application or website
quite standardized
old languages mostly use HTML without much CSS and no JavaScript
- user experience (UX) not as good as with styling (CSS)

styles web pages which are written in HTML -> makes website beautiful and modern looking
- targets HTML tags/elements to manipulate them
- targeting may be done using ID’s, classes, …
borders, animations, colors (background, navigation, borders, …), resize images, …
CSS is embedded in HTML

high-level client side dynamic interpreted programming language
received by browser
- can respond to user events (see above) in the browser
- JS is embedded in HTML
remember: used for client-side scripting

high-level Python Web Framework for rapid and clean development using approved techniques
free of charge
open source
- continiously improved by the community
welcoming community