Resources

Class Materials

• GitHub: Getting Started
• Class Are.na
• RISD Code Lab

• HTML Basics and Setup
• How the Internet Works & How to Stay Organized
• CSS Form and Content
• CSS Layout
• CSS Transforms
• CSS Motion
• JavaScript Basics
• Responsive Web
• Javascript Toggle [🎥]
• Using Randomness [🎥]

Other Online Courses

• CodeAcademy
• Coding Train

File Structures & Naming Principles

• Mozilla: Dealing with Your Files
• Google Developer Documentation Style Guide: Filenames and File Types
• BEM(Block, Element, Modifier) Methodology
• More Transparent UI Code with Namespaces

Debugging & Troubleshooting

• Mozilla: Developer Tool Guide
• Chrome Dev Tools
• W3C HTML Validator
• Stackoverflow
• SublimeLinter

Responsive Web & Media Queries

• Fluid Grids
• Chris Coyier’s simple grid approach
• 7 Habits of Highly Effective Media Queries
• CSS viewport units
• 8px grid
• CSS Grid Generator
• Fluid Grids
• Screensiz.es
• Mediaqueri.es

Cross Browser Compatibility

• Can I Use
• CSS Trigers
• Autoprefixer CSS

SVG

• SVG on the Web
• SVG animations
• CSS clip-path maker

HTML

• Getting Started with HTML
• HTML / CSS a Beginner’s Guide

CSS

• CSS Beginner Tutorial
• Mozilla: Why is CSS So... Weird?
• CSS-tricks
• CSS Property Index
• Listmatic

CSS: Typography

• Setting Type on the Web to a Baseline Grid
• Controlling Spacing Web Typography
• A responsive typographic baseline for the web
• Leading-Trim: The Future of Digital Typesetting

CSS: Layout

• 1-Line Layouts
• Learn CSS Grid

Javascript

• Eloquent JavaScript
• 33 Concepts Every JavaScript Developer Should Know
• Javascript Visualizer
• Javascript Object Explorer