Web development

Learning resources

General information

• Mozilla MDN web technology presentation: Web technology for developers

• Mozilla MDN HTTP presentation: HTTP protocol explained

• MVC design pattern

• What is a web framework

• When should I use a framework ?

• Why should I use a framework ?

• When not to use a framework ?

• Why templating

HTML

• HTML Standard - Living Standard

• W3 Schools: HTML Tutorial

• Mozilla MDN: HTML

• Internetingishard: HTML & CSS tutorial

CSS

• W3 Schools: CSS Tutorial

• Mozilla MDN: CSS

Definitions

HTML :

• HTML is not a programming language. It is a markup language that defines the structure of your content.

• List of problems that HTML can solve

CSS :

• It stands for Cascading Style Sheets

• CSS describes how HTML elements are to be displayed on screen, paper, or in other media

• CSS is used to define styles for your web pages, including the design, layout and variations in display for different devices and screen sizes

• CSS saves a lot of work. It can control the layout of multiple web pages at once

• External stylesheets are stored in CSS files

• CSS is not a programming language, nor a markup language. It is a style sheet language.

• Other examples of Style Sheet Languages

• HTML only sets up document structure. To solve presentation issues, use CSS

Client-side scripting

• Use scripting to make your page interactive

What problem does CSS solve ?

HTML was NEVER intended to contain tags for formatting a web page!

HTML was created to describe the content of a web page, like:

 <h1>This is a heading</h1>

 <p>This is a paragraph.</p>

When tags like <font>, and color attributes were added to the HTML 3.2 specification, it started a nightmare for web developers. Development of large websites, where fonts and color information were added to every single page, became a long and expensive process.

To solve this problem, the World Wide Web Consortium (W3C) created CSS.

CSS removed the style formatting from the HTML page!

Perl learning resources

• Mojolicious webcasts

• Web frameworks concepts explained with Mojolicious

Python learning resources

• Bottle framework

• Primer on Jinja templating

• Explore Flask : Python web framework

• Writing a web service with Flask

Ruby learning resources

• Ruby : Webapps for Beginners

Solutions to common problems

Url space encoding

Space: %20

Source: https://www.w3schools.com/tags/ref_urlencode.ASP

Playing audio media in the browser

• https://catswhocode.com/html-audio-tag/

• https://www.w3schools.com/html/html5_audio.asp

 <audio controls>
  <source src="horse.ogg" type="audio/ogg">
  <source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio> 

• MediaElement.js

Back to top

Index