Welcome to web.lab!

Quick Survey:
What is web.lab?
 Course Staff!

Kenneth Choi Tony Cui Abby Chou Mark Tabor Andrew Liu Jay Hilton Joyce Yoon
Class of 2025 Class of 2024 Class of 2025 Class of 2025 Class of 2026 MEng MEng
President Co-Academic Chair Co-Academic Chair Operations Chair Treasurer Tech Chair Sponsor Chair

Andy Jiang Helen Yang Stanley Zhao Enrique Casillas Michael Kuoch Christine Imogu Nicholas Tsao
Class of 2026 Class of 2024 Class of 2027 MEng MEng Class of 2024 Class of 2024
Pub Chair Historian TA TA TA TA Eternal Staff
Reminders
● Register at weblab.is/portal
○ If you want credit for the class, you also need to register on websis (6.9620)
● Join the Piazza at weblab.is/piazza
○ Follow the installation guide immediately!
● Lectures will be livestreamed and recorded to Youtube. Join the livestream
at weblab.is/livestream!
○ No, lectures are not mandatory. We don’t take attendance. You get out as much as you
put into web.lab
Logistics
Logistics
● No, the competition is not mandatory. But it doesn’t hurt to submit your
website into the competition!
● We’ll have live help during workshops where you can add yourself to the
queue on weblab.is/q.
● You can find the questions doc at weblab.is/questions, where you can ask
questions anonymously during class.
● You can find the old questions doc at weblab.is/oldquestions
● bukabuka is at weblab.is/bukabuka
bukabuka
Logistics
● No, the competition is not mandatory. But it doesn’t hurt to submit your
website into the competition!
● We’ll have live help during workshops where you can add yourself to the
queue on weblab.is/q.
● You can find the questions doc at weblab.is/questions, where you can ask
questions anonymously during class.
● You can find the old questions doc at weblab.is/oldquestions
● bukabuka is at weblab.is/bukabuka
● Student hub for shortlinks and deadlines is at weblab.is/home
Logistics
● No, the competition is not mandatory. But it doesn’t hurt to submit your
website into the competition!
● We’ll have live help during workshops where you can add yourself to the
queue on weblab.is/q.
● You can find the questions doc at weblab.is/questions, where you can ask
questions anonymously during class.
● You can find the old questions doc at weblab.is/oldquestions
● bukabuka is at weblab.is/bukabuka
● Student hub for shortlinks and deadlines is at weblab.is/home
● Don’t have a team yet? Stay after lecture today for a team-finding mixer!
Course Overview
Schedule
Schedule
Week 1 we build an app from scratch together!
Schedule
Week 1 we build an app from scratch together!

Week 2 add cool features + advanced topics + sponsor

lectures
Schedule
Week 1 we build an app from scratch together!

Week 2 add cool features + advanced topics + sponsor

lectures

Week 3 code, code, code

Schedule
Week 1 we build an app from scratch together!

Week 2 add cool features + advanced topics + sponsor

lectures

Week 3 code, code, code

Week 4 CODE, CODE, CODE

final submission, judging, awards!

weblab.mit.edu/schedule
We take you end-to-end
We take you end-to-end
The world of websites is huge
How does this all work?
Accessing a Website
Accessing a Website

Client (you)
Accessing a Website

Request: GET facebook.com

Client (you) Server (facebook)

Accessing a Website

Request: GET facebook.com

Client (you) Server (facebook)

Stores and serves a

website
Accessing a Website

Request: GET facebook.com

Response: Webpage files

Client (you) Server (facebook)

Stores and serves a

website
Accessing a Website

Request: GET facebook.com

Response: Webpage files

Client (you) Server (facebook)
Chrome
Program used to view Stores and serves a
a website website
Webpage files
Webpage files
HTML
Webpage files
HTML

CSS
Webpage files
HTML

CSS

JS
Webpage files
HTML
Assets

CSS

JS
What app will we build?
What app will we build?
weblab.is/example
Milestones!
Milestones!
Ideation MILESTONE 0 due Wed,
Jan 10
Milestones!
Ideation MILESTONE 0 due Wed,
Jan 10

Project Pitches MILESTONE 1 due Fri, Jan 12

Milestones!
Ideation MILESTONE 0 due Wed,
Jan 10

Project Pitches MILESTONE 1 due Fri, Jan 12

Minimum Viable Product MILESTONE 2 due Wed, Jan 24

Milestones!
Ideation MILESTONE 0 due Wed,
Jan 10

Project Pitches MILESTONE 1 due Fri, Jan 12

Minimum Viable Product MILESTONE 2 due Wed, Jan 24

Final Website! MILESTONE 3 due Wed, Jan 31

Milestones!
Ideation MILESTONE 0 due Wed,
Jan 10

Project Pitches MILESTONE 1 due Fri, Jan 12

Minimum Viable Product MILESTONE 2 due Wed, Jan 24

Final Website! MILESTONE 3 due Wed, Jan 31

Passing the class requires completing ALL milestones!

You must build...
You must build...
Dynamic website supported by a back-end
You must build...
Dynamic website supported by a back-end

Personalized experience based on user accounts

You must build...
Dynamic website supported by a back-end

Personalized experience based on user accounts

Minimum security requirements fulfilled

You must build...
Dynamic website supported by a back-end

Personalized experience based on user accounts

Minimum security requirements fulfilled

Original design and implementation

You must build...
Dynamic website supported by a back-end

Personalized experience based on user accounts

Minimum security requirements fulfilled

Original design and implementation

Use Git on a web.lab Github repo

You CANNOT...
You CANNOT...
Use anything like Drupal, Wordpress or Squarespace
You CANNOT...
Use anything like Drupal, Wordpress or Squarespace

Use any part of a previous project

You CANNOT...
Use anything like Drupal, Wordpress or Squarespace

Use any part of a previous project

Outsource your development. Hire minions.

You CANNOT...
Use anything like Drupal, Wordpress or Squarespace

Use any part of a previous project

Outsource your development. Hire minions.

Evil
You CANNOT...
Use anything like Drupal, Wordpress or Squarespace

Use any part of a previous project

Outsource your development. Hire minions.

Evil

weblab.mit.edu/about/ -- post a private Piazza post for any questions

Judging
Functionality technical components of your core features

Usability ease-of-use of the website

Aesthetics look-and-feel of the website

Concept Execution applicability of the solution to the problem

weblab.mit.edu/about/
Where do we get help from?
Learning Resources

PIAZZA!!! PLS POST ON PIAZZA

The Course Website weblab.mit.edu

Resources Compilation weblab.mit.edu/resources

Office Hours

“Hackathon” during Week 2 + 3

Hackathon
Extended Office Hours

Try to get as much sh*t done as possible

We have generous help from staff <3 (and food/snacks/boba !!)

What else is there to web.lab?
 i g n
e s
U ID

What else is there to web.lab?

 i g n
e s
U ID

What else is there to web.lab?

c o nt rol
ng v e rsion
learni
 a ta
n ste
si g o f co
e
U ID u rs
e6
-3

What else is there to web.lab?

c o nt rol
ng v e rsion
learni
 a ta
n ste
si g o f co
e
U ID u rs
e6
-3

What else is there to web.lab?

a first exp nt rol

erience in c o
creating s ng v e rsion
omething learni
 a ta
n ste
si g o f co
e
U ID u rs
e6
-3
And much more!
What else is there to web.lab?

a first exp nt rol

erience in c o
creating s ng v e rsion
omething learni
Most importantly...
web.lab is not a classic MIT class
THEME!
Theme...
2015 Theme Around the World
2016 Theme Remember the Future
2017 Theme Beyond the Horizon
2018 Theme Back to the Roots
2019 Theme Press Any Key to Start
2020 Theme Craft your own ____
2021 Theme Tag yourself
2022 Theme Imagine
2023 Theme U&I
2024 Theme ???
send it or blend it
Quick Survey