Resources

Within our Google Shared Drive is a folder labeled Instructions and Resources. Please browse that folder and its contents! Additionally, here are some web resources that I have found helpful for this course.

General:

• w3schools.com - A comprehensive list of HTML, CSS, Javascript, etc. features with sample code and mini-testbeds to try it all out. You could use this for the tutorials, but you could also keep this on hand as a reference for tag and syntax lookup.
• Dev - An awesome community to check out that shares articles, tips & tricks, and gives encouragement.
• CodePen - Testing site but also lots of awesome shared projects to check out like this Escape Room by Kristopher Van Sant.
• figma - for creating mockups, etc.
• webflow - an awesome website builder once you know the basics of HTML/CSS (here's a tutorial for creating a portfolio in webflow)
• Cat Ipsum, an alternative to Lorem Ipsum for placeholder text.
• Lorem Picsum, the Lorem Ipsum for photos.
• MDN web docs - The beginning page for an introduction to HTML, CSS, and Javascript made by Mozilla (who have the fancy logo moz://a now...). They're the makers of the Firefox browser and have been in the web game basically since the beginning of the modern web.
• MDN web docs JavaScript Guide - In case you need to jump directly to the JS stuff from moz://a, here's the link.
• Beginner's Guide to Web Development - A web and video series by Sameer Nyaupane. Lots of you may prefer learning from watching tutorial videos rather than by perusing online manuals or textbooks. If so, there's a crap ton out there. This one seems pretty good.
• Okere, Chibuike. (Jan 18, 2021). How to manipulate the DOM - the ultimate beginner's guide. freeCodeCamp().
• Liszewski, Andrew. (Jul 5, 2019). This website's deliberately frustrating interface will make you appreciate good web design. Gizmodo.

HTML:

• Learn HTML Cheatsheets from codecademy (and here's all their cheatsheets)
• Neogi, Ananya. (Jun 25, 2019). HTML can do that? Dev.

CSS:

• Bistrovic, Silvestar. (Mar 29, 2021). Tools for auditing CSS. CSS-Tricks.
• Krossing, Dani. (Aug 11, 2017). 6: How do we include CSS in our HTML [video]. YouTube.
• Nghiem, Thu. (Jan 26, 2021). Learn CSS grid by building 5 layouts in 17 minutes. freeCodeCamp().
• Argyle, Adam. (Dec 16, 2020). Centering in CSS. web.dev.
• Kumar, Nishant. (Mar 8, 2021). How CSS positioning and flexbox work - explained with examples.
• Paladini, Vitor. (Nov 18, 2020). Responsive snakes! And what they can teach you about CSS.
• Efimova, Kate. (Jul 28, 2019). Understanding flexbox with cats: Part 1 basics. Dev.
• Powell, Kevin. (May 23, 2018). Floats, flexbox, grid? The progression of CSS layouts [video]. YouTube.
• Charts.css, a CSS framework for making charts and visualizations of data!
• Starichenko, Nikita. (Mar 7, 2021). Top lesser known HTML 5 & CSS 3 tips and best practices. Hacker Noon.
• The Net Ninja. (Aug 12, 2016). CSS animation tutorial [video series]. YouTube.
• Schrag, Jacque. (Jun 11, 2019). Creating pixel art with CSS. Dev.
• Halpern, Ben. (Mar 2, 2021). Table tennis in pure HTML CSS. Dev.

Bootstrap:

• Full Bootstrap 5 Tutorial for Beginners - Another awesome FREE tutorial from the non-profit freeCodeCamp().

JavaScript:

• Learn JavaScript Cheatsheets from codecademy (and here's all their cheatsheets)
• McDonald, Jason C. (Dec 14, 2020). Basics and variables (Part 3 of the Javascript DevJournal). Dev.
• Traversy Media. (Mar 13, 2019). JavaScript crash course for beginners [video]. YouTube.
• Svaiko, Gert. (Dec 21, 2020). 10 javascript hacks every web developer should know. freeCodeCamp().
• Learn JavaScript - Full Course for Beginners - freeCodeCamp.org
• Javascript for Cats

Course Readings (History of the Web, Issues with Web and Internet Culture, and Ethical Design)

1. Teamwork and Connected Learning
• Duhigg, Charles. (Feb 25, 2016). What Google learned in its quest to build the perfect team. The New York Times Magazine.
• What is Connected Learning? The Connected Learning Alliance.
• Course Syllabus
2. History of the internet and the web (part 1)
• SciShow. (Mar 1, 2017). How the internet was invented | The history of the internet, part 1 [video]. YouTube
• Hoffmann, Jay. (ongoing, latest Nov 3, 2021). Web history. CSS-Tricks. - Chapters 1-3.
• Setting up workflow document (found in Perusall and in our Google drive)
3. History of the web (part 2)
• SciShow. (Mar 29, 2017). How the web became a thing | The history of the internet, part 2 [video]. YouTube
• Hoffmann, Jay. (ongoing, latest Nov 3, 2021). Web history. CSS-Tricks. - Chapter 4-7.
• Setting up domain document (found in Perusall and in our Google drive)
4. History of web (development)
• Hoffmann, Jay. (ongoing, latest Nov 3, 2021). Web history. CSS-Tricks. - Chapter 8-10.
• Jung, Jo. (Sep 4, 2018). A nostalgic journey through the evolution of web design. The Conversation.
• Some web fundamentals document (found in Perusall and in our Google drive)
5. Dark Patterns
• DarkPatterns.org - Watch the video, browse through the site.
6. Issues with algorithms and recommendation systems
• Bridle, James. (Nov 6, 2017). Something is wrong on the internet. Medium.
7. Who owns the web?
• Clark, Mitchell. (Feb 24, 2021). This browser extension shows what the Internet would look like without Big Tech. The Verge.
8. Wikipedia and the power of users
• Pasternack, Alex. (Mar 7, 2020). How Wikipedia's volunteers became the web's best weapon against misinformation. Fast Company.
• Cooke, Richard. (Feb 17, 2020). Wikipedia is the last best place on the Internet. Wired.
9. Ethical responsibility
• Debaque, Sidney. (Mar 10, 2021). Designers should redistribute power, not consolidate it. UX Collective.
• So the internet didn't turn out the way we hoped. (Nov 11, 2019). The New York Times Magazine.