Workshop Archive

Filtered by tag: css
Spring 2024

Directed by Lillian Gonick and Kaylin Chung

  • Crafting Chrome

    chrome API
    html
    css
    javascript

    README 

    · Slides 

    Taught by James Wu and Kayla Hamakawa

Fall 2023

Directed by Abigail Tran

  • Session 1: HTML/CSS/JavaScript

    html
    css
    javascript

    README 

    · Slides 

    Taught by Abigail Tran

  • Session 2: Intro to React

    components
    props
    reactjs

    README 

    · Slides 

    · Recording 

    Taught by James Wu

  • Session 3: Events and State

    state
    hooks
    event handling
    reactjs

    Slides 

    Taught by Thomas McGall

  • Session 4: Navigation

    navigation
    reactjs

    README 

    · Slides 

    · Recording 

    Taught by Shiyu Ye

  • Session 5: Servers

    servers
    http
    nodejs
    express
    async
    reactjs

    Slides 

    · Recording 

    Taught by Jakob Reinwald

  • Session 6: Generative AI

    servers
    http
    api
    async
    ai
    reactjs

    Slides 

    · Recording 

    Taught by Einar Balan

  • Session 7: Deployment

    deployment
    github
    reactjs

    Slides 

    · Recording 

    Taught by James Wu

Winter 2023

Directed by Maggie Li and Katelyn Yu


Directed by James Wu and Nathan Zhang

  • Session 5: CSS and Components

    frontend
    reactjs
    css
    components
    props

    README 

    · Slides 

    · Recording 

    Taught by James Wu and Shiyu Ye

Fall 2022

Directed by Thomas McGall

  • Session 1: Intro to React/HTML

    reactjs
    html

    README 

    · Slides 

    Taught by Thomas McGall

  • Session 2: Intro to CSS/Layout

    css
    flexbox

    README 

    · Slides 

    · Recording 

    Taught by James Wu and Katelyn Yu

  • Session 3: Components and Props

    components
    props
    reactjs

    README 

    · Slides 

    Taught by Jakob Reinwald

  • Session 4: JavaScript and Navigation

    navigation
    javascript
    reactjs

    README 

    · Slides 

    · Recording 

    Taught by Alex Xia

  • Session 5: Handling State and Events

    state
    hooks
    event handling
    reactjs

    README 

    · Slides 

    · Recording 

    Taught by Nareh Agazaryan

  • Session 6: React Lifecycle

    reactjs
    hooks
    state
    event handling

    README 

    · Slides 

    · Recording 

    Taught by James Wu and Katelyn Yu

Winter 2022

Directed by Christina Tong and Einar Balan

Fall 2021

Directed by Eric Yang and Nareh Agazaryan

  • Session 1: Intro to HTML/CSS

    html
    css

    README 

    · Slides 

    · Recording 

    Taught by Eric Yang and Nareh Agazaryan

  • Session 2: Intro to JavaScript

    javascript

    README 

    · Slides 

    · Recording 

    Taught by Alex Xia

  • Session 3: Intro to React

    reactjs

    README 

    · Slides 

    · Recording 

    Taught by Nareh Agazaryan and Eric Yang

  • Session 4: Props and Layout

    props
    flexbox

    README 

    · Slides 

    · Recording 

    Taught by Alex Xia and Jody Lin

  • Session 5: Event Handling and State

    state
    event handling

    README 

    · Slides 

    · Recording 

    Taught by Miles Wu

  • Session 6: Asynchronous Programming and Web API's

    async
    await
    json
    api
    promise

    README 

    · Slides 

    · Recording 

    Taught by Einar Balan

  • Session 7: React Lifecyle

    useEffect

    README 

    · Slides 

    · Recording 

    Taught by Jamie Liu

Spring 2021

Directed by Nareh Agazaryan and Einar Balan

  • Session 6: Web Development with Django

    django
    html
    css

    README 

    · Slides 

    · Recording 

    Taught by Alex Xia and Eric Yang

Winter 2021

Directed by Asha Kar

Fall 2020

Directed by Miles Wu and Jamie Liu

  • Session 1: Introduction to HTML/CSS

    html
    css

    README 

    · Slides 

    · Recording 

    Taught by Miles Wu and Jamie Liu

  • Session 2: Introduction to JavaScript

    javascript

    README 

    · Slides 

    · Recording 

    Taught by Miles Wu and Jamie Liu

  • Session 3: Webpage Interaction with the DOM

    html
    css
    javascript

    README 

    · Slides 

    · Recording 

    Taught by Galen Wong

  • Session 4: Advanced CSS

    css
    flexbox

    README 

    · Slides 

    · Recording 

    Taught by Eugene Lo

  • Session 5: Asynchronous Programming and Web APIs

    javascript
    api
    async

    README 

    · Slides 

    · Recording 

    Taught by Alex Xia

  • Session 6: Responsive Design and Accessibility

    css
    screenreader
    design
    accessibility

    README 

    · Slides 

    · Recording 

    Taught by Kristie Lim

  • Session 7: Introduction to React.js

    reactjs
    javascript

    README 

    · Slides 

    · Recording 

    Taught by Eugene Lo and Jody Lin

  • Session 8: Node.js and Servers

    nodejs
    javascript
    express

    README 

    · Slides 

    · Recording 

    Taught by Jamie Liu and Timothy Gu

Fall 2019

Directed by Timothy Gu and Timothy Rediehs

  • Session 1: Introduction to Frontend Development

    html
    css
    javascript

    README 

    · Slides 

    Taught by Timothy Gu

  • Session 2: Introduction to Backend Development

    javascript
    nodejs

    README 

    · Slides 

    Taught by Timothy Rediehs

  • Session 3 Backend: What’s an API?

    api
    javascript
    nodejs

    README 

    · Slides 

    Taught by Jody Lin

  • Session 3 Frontend: JavaScript and the DOM

    javascript
    html

    README 

    · Slides 

    Taught by Kristie Lim

  • Session 4 Backend: Introduction to Express.js

    express
    nodejs

    README 

    · Slides 

    Taught by Galen Wong

  • Session 4 Frontend: CSS Layout

    css

    README 

    · Slides 

    Taught by Shirly Fang

  • Session 5 Backend: Asynchronous Actions

    nodejs
    javascript
    async

    README 

    · Slides 

    Taught by Timothy Rediehs

  • Session 5 Frontend: Introduction to React

    reactjs
    javascript

    README 

    · Slides 

    Taught by Timothy Gu

  • Session 6 Backend: Introduction to Database

    database
    firebase
    javascript

    README 

    · Slides 

    Taught by Galen Wong

  • Session 6 Frontend: More on React

    reactjs
    javascript

    README 

    · Slides 

    Taught by Shirly Fang

  • Session 7: Full Stack: Bringing It Together

    fullstack
    reactjs
    nodejs

    README 

    · Slides 

    Taught by Kristie Lim and Timothy Rediehs

Spring 2019

Directed by Jody Lin and Rajeshwari Jadhav

  • Session 6: Web Dev Part 1

    django
    html
    css

    README 

    · Slides 

    Taught by Connie Chen

Fall 2018

Directed by Kristie Lim and Prateek Singh

  • Session 1: Introduction to Frontend Development

    html
    css
    javascript

    README 

    · Slides 

    Taught by Kristie Lim and Prateek Singh

  • Session 2: Introduction to Backend Development

    javascript
    nodejs

    README 

    · Slides 

    Taught by Timothy Gu and Galen Wong

  • Session 3 Frontend: JavaScript and the DOM

    html
    css
    javascript

    README 

    · Slides 

    Taught by Dustin Newman

  • Session 3 Backend: What is an API?

    api
    javascript
    nodejs
    express

    README 

    · Slides 

    Taught by Galen Wong

  • Session 4 Frontend: CSS Layout

    css
    flexbox

    README 

    · Slides 

    Taught by Kristie Lim

  • Session 4 Backend: More on Express

    api
    nodejs
    express

    README 

    · Slides 

    Taught by Timothy Gu

  • Session 5 Frontend: Introduction to React

    reactjs
    javascript

    README 

    · Slides 

    Taught by Galen Wong

  • Session 5 Backend: Asynchronous Actions

    nodejs
    javascript
    async

    README 

    · Slides 

    Taught by Kristie Lim

  • Session 6 Frontend: Dynamic Content

    reactjs
    api

    README 

    · Slides 

    Taught by Prateek Singh

  • Session 6 Backend: Databases

    database
    firebase
    javascript

    README 

    · Slides 

    Taught by Prateek Singh

Fall 2017

  • Session 1: Intro to Web Development

    html
    css

    README 

    · Slides 

  • Hack Session 1: Build a Personal Website

    html
    css
    javascript
  • Session 2: Grids & JavaScript

    css
    javascript

    README 

    · Slides 

    Taught by Yvonne Chen and Nathan Smith

  • Hack Session 2: Build an Interactive Photo Gallery

    html
    css
    javascript

    README 

    · Slides 

  • Session 3: Node.js

    nodejs
    backend
    npm
    handlebars

    README 

    · Slides 

    Taught by Kevin Tan and Shannon Phu

  • Hack Session 3: Node.js and Templating

    nodejs
    backend
    handlebars

    README 

    · Slides 

    Taught by Yvonne Chen and Nathan Smith

  • Session 4: Relational Databases

    database
    mysql
    sql

    README 

    · Slides 

    Taught by Shannon Phu

  • Hack Session 4: Final Project - BruinPlay

    final project

    README 

    · Slides