Skip to content

Latest commit

 

History

History
45 lines (26 loc) · 1.75 KB

1-group-intro.md

File metadata and controls

45 lines (26 loc) · 1.75 KB

Part 1: Intros with a group coding icebreaker

Time to tinker with code and break stuff! Today we'll work in pairs and as a group to learn by doing -- let's dive right in! :)

🏆 For all of these challenges, the goal is have fun! It doesn't matter if you're correct or not. Like they say, we learn more from our failures than from our successes. So let's have fun "failing", breaking things on purpose, and learning from the experience!


Our main tool for today: We'll use Glitch to collaboratively edit the same code, in real time!

Glitch also lets us create, test, and share web apps using HTML, CSS, and JavaScript files all within the web browser.

📺 See Liz's video introducing Glitch (6 min): https://youtu.be/juqFTEoHN2Q



Group coding

Click here to open our shared Glitch project


Then be sure to click on script.js (in the left-side menu) to look at our JavaScript file.


Our ice breaker warm-up activity: Copy-paste the sample code in the JavaScript file and change it a little bit to draw your name and a square somewhere on the page:


Example:

// EXAMPLE CODE -- Draw a square and then draw the text "Liz"
rect(100, 30, 50, 50);
text("Liz", 100, 30);

// Copy the two lines of example code above, then paste it and change it to say your name!


We'll work in pairs to solve more practice challenges, getting our feet wet with drawing and animations with Javascript!