1. Change Background Colour Project
In short, the idea here is to create a background colour changing application. You are to create an array of different colours and then proceed in adding a “click” event listener to the button. In conclusion, the background colour will certainly change once the button is clicked.
- Within 5-7 minutes you are done coding it. That is to say, you waste no time writing it, and you so much like it when you try it out.
2. Hex Change Background Color Project
This project us somehow similar to the one we explained above but here you will have to make random hex value got from an array of every possible distinct hex values. Furthermore, the next you are to do is looping through them and concatenate six distinct values to a String that began with the # character.
- This is another project that looks simple and sweet to complete
- You will probably need 5-6 minutes to complete this project
- A nineteen lines of codes are enough to make this happen
3. Counter Project
This project is all about clicking on a possible one of two buttons which recorded the count of the on-page element.
- This project is so easy to perform
- Approximately 10 minutes is enough to complete it
- All things equal, the counting starts at number 0
- The counter will certainly increase when you click “Add Count”
- The counter will do the exact opposite of the above instruction when you click “Lower Count”
4. Pass the Message Project
This is all about selecting the value of the input element from the DOM. You are to see the message inputted in the box in the “Last Message Delivered” Section when you press the “Submit” button.
- This is another fairly simple project you can lay your hands-on
- About 10 minutes should suffice in trying this out
5. Random Quotes Project
This project offers you the opportunity to look into the properties on an object known to be embedded inside in an array. In addition, there is certainly a change in quote and the owner of the quote whenever users click on the “Generate Quote” button.
- A very simple project for beginners
- An approximately of about 5-6 minutes should be enough in writing this project
6. Testimonials Project
- Constructor function is used in the making of this project
- You shouldn’t spend up to 30 minutes in writing this project’s code
7. Background Image Slider Project
If you are observant you will certainly know that this particular project and the immediate previously explained project above look very similar. In addition, the next image will certainly show up when you click on the arrows.
- It’s an easy project that will only take you about 15 minutes to complete
- New or different images will certainly appear when you click on the “left” and “right” buttons
8. Calculator Project
- This calculator project you are to create should be good enough to evaluate simple basic expressions
- It relatively takes a longer time. An approximate of about 2 hours should be enough
9. To Do List Project
The idea behind the approach of this project is to create a todo list application.
- This project is relatively not difficult to accomplish this
- Users should be able to add new items, alternatively completed items, delete or edit items
- To clear pages, use the clear button
- In conclusion, this project will cost you lots of lines of codes
10. Grocery List Project
Here, you are going to know how to make a Grocery list through the use of local storage in storing items. In addition, Bootstrap alert-danger or the alert-success classes used to know when an item is added.
- This project utilizes the event propagation in traversing the DOM
- You should find adding items to your cart easy to perform
- There should be a notification that a new item has been added. That is to say, a green alert status should stand as the notification
- A red alert status should show up any time you try to add up an unknown item
- All items should be deletable
- In conclusion, an hour and some few minutes should be enough for this project
11. Flashcard Project
12. Budget Application Project
- This project is designed to accept budget and expenses by running balance in return
13. Random Joke AJAX Project
- This project is simple and straightforward
- You won’t necessarily spend up to half an hour completing this project
14. Random Person Ajax Project
This project is all about using Random User Generator API in retrieving a random user and yield user information in the DOM later.
15. Analogue Clock Project
- A working analogue time that shows your local time zone is what you are to create here
16. Mortgage Loan Calculator Project
- It’s so easy and straightforward as stated in the description above
- Beginners going to take on this project must know how to recover values from an HTML input field. In addition, you are going to use the recovered values to perform calculations
- Half an hour should be enough to complete this project
17. Quote of the Day Project
- This project is as simple as the previous one explained above
- A little time is needed in carrying out this project
18. BMI Calculator Project
- Only two inputs will be needed for this calculator. The first input is your height which must be in centimeters and your weight (second input) which is also in kilograms. In conclusion, a BMI readout is generated when you click on the calculate button.
19. Weight Conversion Project
- This particular project only needs just an input which is your weight in pounds. This calculator will certainly return the value of your weight in kilograms after you might have clicked the enter key.
20. Background Colour Switcher Project
- The project is so easy and straightforward that you won’t even need half an hour to complete it
21. 2D Breakout Game Project
- This project makes use of mathematics to manipulate the bouncing off from the wall and paddle
- It also uses mathematics in knowing the bouncing rate of the ball