MLH through time

A time machine disguised as a web app to explore the history of MLH and its website

Live demo

Demo

Hackathon Submission

Devpost

Screenshot

Getting started

For starting the app in your machine, open the terminal and follow these commands:

git clone the repo

git clone https://github.com/8mn/mlh-through-time.git

cd into working directory

cd mlh-through-time

Install dependencies

npm install

For starting react app:

npm run start

open http://localhost:3000 in browser to access the app

Approach:

• Use web archive and iframe to render previous versions of mlh site
• gsap for building the starting header animation
• useState hook for maintaining different state of UI
• Several SVGs, CSS animations, CSS gradients for building fake widgets

Functionalities:

• Visit any version of mlh site since its inception
• Highlights brief moments happened in each year

What's next for Discover music

• Unified color palette
• Mobile responsiveness
• Adding interactivity to widgets

Contact

If you have any questions/suggestion, Contact me

• My Email: [email protected]
• Twitter: @oimanish