The goal is to create anything you want within 1 single html file. Practice your skills with the barebones of web development. How creative can you be with such restrictions?
- You must write all of your code in 1 single HTML file.
- Your file must be less than 1mb (measured by the file size on github).
- You cannot import any external files (this means you cannot import images, stylesheets or js files from external sources).
- Due to the nature of hiding lots of functionality behind APIs, you cannot have any incoming or outgoing network requests.
- You are allowed to use libraries, however the library must be hard coded into a script tag and still must fit under the 1MB file size. (I suggest using a cdn and replacing with hardcoding the minified library at the end, or use JSCompress).
- Fork the repository.
- Add your html file to the
/entriesdirectory. - Edit the
entries.jsfile in the root, with your information for the entry. - Commit to your forked repo.
- Make a pull request to master from your forked repo.
* You may submit as many entries as you'd like.
- Boing Boing - The "One HTML Page Challenge", a great example of view-source culture
- Medium - How Having No-Internet Lead Me to Building a Worldwide Viral Website.
- 10BestDesign - Coders Try a Single-page HTML Coding Challenge to Boost Skills
- University of Maryland - INST377 Resource
- What's Going On? - Ep #5 (Worst Traffic Bottleneck In North America, IOS vs Android, What's 5g?)
- JPEGZILLA - findings
- chenhuijing.com - Recreating the Fool's Mate chess move with CSS Grid
- Advent One - ansible-challenge
- Hello Github - Volume 70
- Dev Awesome - Issue #14
- Tympanus - Collective #531
- Phoenix Code Editor - Default Project for HTML Games
- Community Classroom - Frontend Development Course
- aiyoubucuo.com - July 3rd 2022 Post
- Anas Khan - Open Source is overrated 🤔
If you write a blog or post about the challenge, feel free to add to the list
- Fun Times with CSS Pixel Art
- Pixel Art to CSS
- How to make a simple HTML5 Canvas Game
- JSCompress: Compile Multiple JS Files Into a Single Script Tag
- Cookie Clicker
- List of Javascript Game Frameworks
- How to render images in HTML with base64 strings
- Convert images to base64