1. Instant Search Bar: An instant search is a feature that allows you to display results as a user types in the search query. It improves user experience and the user does not need to wait. By building this you learn event listeners, API calls, CSS animation, some JS classes, and more.
2. Sticky Notes App: You can make sticky notes app with a movable feature like drag and drop anywhere on the board. You can also add user registration but you can also try with localstorage. By building this you learn HTML Drag and Drop API, events, JSON, CSS.
5. Habit Tracker: This is a productivity app idea. You can ask the user which habit you build or want to get rid of. The app will count days and store their progress. Also, you can add a journal feature where users can write logs. You need a backend for this to store the user’s data.
8. Reaction game: The reaction game test the player’s reaction time. Simple reaction game: a box will pop up anywhere on the page and track the reaction time of the user clicking on the box.
9. Meme generator: Start with a simple, with two inputs add text on top and bottom to the image with HTML5 canvas. You will learn how to draw text on image with HTML5 canvas and dimensions.
10. Browser extension: No it’s not complex. You can convert all the above projects with the browser extension. You will learn about manifest.json. This is where you determine your application’s data in a “manifest.json” file so the browser can perceive and acknowledge it.
Happy Coding 🙂