Notepad/enter/Week 7 Slides.md

86 lines
1.7 KiB
Markdown
Raw Normal View History

### Week 7: Coding with EXTRA FLARE! Javascript & CSS in websites
Miss Shway
(Shwetha Jayaraj)
---
# Welcome back to Developer land.
So far we have learned:
- what real programmers use to upload their code for others to collaborate. Using **Github.com**
- **HTML** basics to make a website
- the tools we can use to edit HTML code in
- https://html.onlineviewer.net/
---
# Group Projects time for 25 minutes
Let me know if you'd like help with your website.
---
### Building Blocks of a Website
![[imgFiles/Pasted image 20231010141612.png]]
- HTML - the content and "bones" of a website
- CSS - the decorations, here we can add fancy decorations
- Javascript - animations can be added here, game-making, scripting, etc..
---
## Step 1. Let's go to [neocities.org ](https://neocities.org/)
Today we are going to start programming in CSS! This makes your website **PRETTY**!
![[Pasted image 20231101131959.png]]
You'll see a lot of interesting website examples here.
---
## Step 2. CSS Building blocks
CSS stands for *Cascading Style Sheets*.
CSS files are for creating **rules** for the standard designs of every webpage on your website.
Think of a page like youtube or instagram. All the fonts, designs are kept the same on each part of the site. This is what CSS helps do! It gives decorative **rules** for the developer to choose from.
---
### Step 3. Javascript Building Blocks
Every website typically ties in both HTML and CSS with a bit of javascript for some additional **flare**.
For example:
https://codepen.io/sadness97/pen/KKobMWx
---
## We will get around to Javascript in the next class.
For now, keep working in CSS inside of neocities.org!
---