Let us assume that you want to break down essential steps into bite-sized chunks for your website users. You may change the timeline code to show tiny bits of a particular event or piece of material to your users without flooding them with too much detail at once. If you missed part one, HTML & CSS project ideas, feel free to jumphere.
File Sharing App
A similar tool to this is called CodeWars where you have to solve code challenges by following a set of instructions. As part of this project, try to build a similar tool where the user can write code that can be executed and verified. If you want to learn a bit about user identification, then you can think about building a poll app where each user can vote only one time. We all know the rules, you need to find all words to win the game. You will learn about working with keyboard events, manipulating the DOM, and implementing a scoring mechanism.
- Start small and create a single list where you can simply add and delete items.
- Building a blog as a side project is a great way to get familiar with a handful of things.
- How to offset the displayed elements, and how to set a limit, so only a predefined number of elements are rendered on the page at any given time.
- This character counter app will have a simpletextarea where we can write our text until the character limit.
Here you can learn more about the different CSS filters available, how to work with the Canvas API, and more specifically, how to work with image data. In this project, you will learn how to create a basic IMDB clone. You will learn about routing, fetching data from an API, and consuming it to display it in a meaningful way.
We will use the fetch method to fetch the API calls along with the React hooks and conditional rendering. Web Development is the category of software development process which involves the design, development and maintenance of a full website or mobile website for the Internet. Today, Websites are the essential part of any business to showcase the online presence and provide availability of products across the globe.
You will be able to visually see which files/folders take up the most space. You will be also able to navigate between different levels, and even change the styles of the treemap. If you ever wanted to learn more about recursions, then this is the right project as we will also look into that. If you are into working with visualizing data, then the following two projects might be just for you.
Get creative with the canvas API
Using the two functions above, create a function to make the mole emerge out of the random hole. A function that generates a random length of time for the mole to peep. To make this project more complex, try this slideshow project from W3Schools. You can change the onClick events to onmousehover and onmouseout events, in which case, the images will change once the user hovers over the images. Once the user hovers over the images, more details will appear. You can download images from anywhere or use the ones you already have.