Who are we?

Rohan

I am currently a sophomore in high school. I have taken several computer science courses and I am passionate about coding. I will be helping you get on your feet with web development!

Pranay

This is my dad. He works as an IT Manager, and deals with web development and cloud computing. He'll help those who have done this class before.

What are we doing?

Web Development!

Each class...

We will build up our personal website. Here are how the four days will go:

1. HTML overview
2. CSS to make your site look nice!
3. JS day 1 for interactivity / clicker game
4. JS day 2 for making your site super fun!

The Web Development Stack

AI?

It shouldn't do your thinking, otherwise you won't understand what's happening.

But you should be aware it exists, one day you will use it as a tool.

For now, limit your use, and try not to use it at all. If you absolutely need help and we aren't there, ask it for help without making it do your work.

HTML

HTML (HyperText Markup Language) is the standard markup language for creating web pages.

Basically, we use it to structure our content.

Example Code

Live Demo

Let's see the code in action!

In Browser

What does this code do?

Quiz!

Can you recall the parts of the Hello World web page?

Basic Tags

Structure of a Tag

Each HTML tag has an opening tag and a closing tag.

The opening tag is written like this: <tagname>

The closing tag is written like this: </tagname>

Example

Quiz!

So how do I make a tag?

Heading

There are 6 different headings:

1. h1
2. h2
3. h3
4. ...

What are the other 3?

How do you make an h1 tag? h2? h3?

List

There are 2 kinds of lists:

1. Ordered List
2. Unordered List

How do you think we can make these?

Ordered List

In Browser

How do you make an unordered list?

In Browser