Unit 3 - HTML: Front-End Dev

3.1 - The World Wide Web


  • We have officially made it past the halfway point of the course. Congrats!

  • We will continue to practice our coding skills - but first, we're switching gears to learn front-end development.

Today's Lesson: The World Wide Web

What exactly is "The World Wide Web" and why do websites start with www.?
What's the difference between
the Internet and the Web?
? Does Snapchat use "the web"
? How about multiplayer games

Here is a selection of videos that explain the difference - pick whichever one you want, or watch multiple to solidify your understanding:

Programming vs. Designing

What we've been doing in JavaScript is called backend development. It is all data and text-based for solving problems and designing algorithms. That is programming - or computer science. It's looks boring (console only).

A Graphical User Interface (GUI) makes interactions with a computer much nicer: buttons, scrollbars, graphics, windows... and it's so pretty! Do do that, we need to be designers.

On the "Web", a GUI is created using HTML - HyperText Markup Language. Again, here's a selection of videos:

Written Definitions:

Today's Task(s) / Homework

To get started with front-end development, you need to know what's possible first. How do you create paragraphs or bold text? How do you insert a picture or place things in an organized table?

For today, I would like you to check out this free tutorial on SoloLearn (use the red Google button to login). See how far you get in it - even if you think you know HTML already.

If that tutorial doesn't work for some reason, here are some backups but keep in mind that they did not use proper indenting in these examples (shame on them). You should always indent by 2 spaces when tags are inside one another. Indenting examples here.