The technical aspects of were inspired by the interest to create a website that accounts for CDN downtimes. That idea evolved to create an unbreakable site that would protect its code and function offline.

What it does uses CSS, JavaScript and cache storage to lock the page's source code, restrict inspect element, ensure the website can be loaded offline and fallback to local resources if CDNs fail. To demonstrate these features, we created a small point-and-click environment to be accessed offline.

How we built it

We built using HTML, CSS, and JS. The CSS and JS work together to lock down the user's access when on the website. JS was used to store the website in cache storage with web service workers. The images were illustrated in Photoshop.

Challenges we ran into

The biggest challenge of this project was caching the website so it could later be used offline. We had to research and implement web service workers to achieve the feat.

Accomplishments that we're proud of

Having the website work offline and using cookies to continuously play music through different webpages.

What we learned

Our team has worked on various web-related projects in the past, yet during this hackathon, we discovered even more about the vast capabilities of web development.

What's next for's clever methods could be implemented in other websites that wish to restrict access to their source code, lock inspect element, have backups for CDNs and support offline usage. Our site's structure also makes it feel like a desktop program (no selectable text, unable to drag links around, etc) which might be useful to create web-based applications or games.

Built With

Share this project: