html-tips-tricks is an open-source GitHub repository that curates underused HTML5 features with working examples and a live demo site, created by developer atapas. The project began as part of the #100DaysOfCode initiative, where the author revisited the HTML5 feature list first released in October 2014 and discovered several features they had never used. The repository documents these features in a README, provides code examples, and links to a companion blog post and a live demo hosted on Netlify.
What is html-tips-tricks?
html-tips-tricks is a GitHub repository by developer atapas that catalogs HTML5 features the author found underused. The repository takes the author's personal exploration and produces a curated list of tips, code examples, and a working demonstration site. It runs on Netlify at https://html5-tips.netlify.app/, and the code is written in HTML5 and JavaScript. The repository has 315 stars and is part of the #100DaysOfCode initiative.
Key Features
- Curated HTML5 feature list — A selection of HTML5 features the author revisited and found useful but hadn't used much, documented in the repository README.
- Live demo site — A working example flow hosted on Netlify at https://html5-tips.netlify.app/, allowing you to try the features interactively in a browser.
- Companion blog post — A post titled "10 useful HTML5 features You may not be using" on blog.greenroots.info explains the concepts alongside the code.
- Open-source and star-supported — The project has received 315 stars from GitHub users, and the README thanks all Stargazers who supported it.
- Hacktoberfest-friendly — The repository is tagged with hacktoberfest, indicating it accepts contributions during Hacktoberfest.
- Built with HTML5 and JavaScript — The examples rely on native HTML5 and vanilla JavaScript, with no external front-end framework required.
- #100DaysOfCode aligned — The project was created as part of the author's #100DaysOfCode learning journey, making it a relatable reference for others in similar challenges.
Who is it for?
- Web developers who want to deepen their HTML5 knowledge — They can review underused features and run the live demo to see each one in action.
- Self-taught programmers following coding challenges — The repository serves as a reference for #100DaysOfCode participants looking for HTML5 features to practice and experiment with.
- Open-source contributors — With the hacktoberfest tag, contributors can submit improvements or new tips to the repository and participate in Hacktoberfest.
What can you do with html-tips-tricks?
- Learn HTML5 features quickly: Browse the curated list and open the live demo to see each feature behave in a browser.
- Use it as a teaching aid: Educators or mentors can point learners to the live site and the companion blog post to illustrate HTML5 capabilities.
- Contribute to the project: Add your own underused HTML5 tips, fix examples, or improve documentation as part of Hacktoberfest.
FAQ
Is html-tips-tricks free to use?
Yes, the repository is open-source and publicly available on GitHub. There is no cost to view the code, run the demo on Netlify, or use the examples in your own projects.
What does the live demo on Netlify show?
The Netlify-hosted site at https://html5-tips.netlify.app/ is a working example flow that demonstrates the HTML5 features listed in the README. It lets you interact with the features directly in the browser.
Who created html-tips-tricks?
The repository was created by the developer atapas. It was developed as part of the #100DaysOfCode initiative, and the author also wrote a companion blog post on blog.greenroots.info.
Can I contribute to the repository?
Yes, the repository is tagged with hacktoberfest, indicating it welcomes contributions. You can submit issues or pull requests to add new tips, improve existing examples, or fix problems.
What are the main technologies used?
The repository focuses on HTML5 features and uses JavaScript for the interactive examples. The live demo is deployed on Netlify, and no specific front-end framework is mentioned.
