Skip to main content

Build a Monthly Spending Tracker with HTML, JavaScript and CSS

2h 26m 14s
English
Paid

Course description

This practical course will teach you how to create a real personal budget management application—both useful and impressive. You will develop a neat and interactive interface where users can add expenses, choose categories, and immediately see the results on a dynamic chart.

With the help of Chart.js, the data will come to life—visually, beautifully, and functionally. Along the way, you will deal with forms and input processing, and you'll also learn how to save data using localStorage so that everything remains in place even after the page is refreshed.

By the end of the course, you will have a stylish and fully functional web application that you can be proud of. Most importantly, you will strengthen the key frontend development skills necessary for every developer!

Watch Online

This is a demo lesson (10:00 remaining)

You can watch up to 10 minutes for free. Subscribe to unlock all 14 lessons in this course and access 10,000+ hours of premium content across all courses.

View Pricing
0:00
/
#1: Introduction

All Course Lessons (14)

#Lesson TitleDurationAccess
1
Introduction Demo
04:25
2
Form Elements UI
09:07
3
Form Styling UI
13:42
4
Date & Expenses Setup JS
10:56
5
Submit & LocalStorage JS
15:15
6
Chart Functionality JS
16:42
7
Let's Keep Learning Together!
01:23
8
Introduction
05:02
9
Mac / Linux Device Setup
05:35
10
Windows Device Setup
06:58
11
VSCode Setup & Template
19:27
12
VSCode Extensions
09:11
13
DevTools
13:57
14
GitHub
14:34

Unlock unlimited learning

Get instant access to all 13 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.

Learn more about subscription

Comments

0 comments

Want to join the conversation?

Sign in to comment

Similar courses

Epic Web. Ship Modern Full-Stack Web Applications

Epic Web. Ship Modern Full-Stack Web Applications

Sources: Kent C. Dodds
Whether you and your team are working on an existing enterprise-scale web app, or you've just come up with an amazing idea for a new project , the one thing standing between you...
39 hours 2 minutes 51 seconds
Advanced FrontEnds

Advanced FrontEnds

Sources: Gary Simon
"Advanced FrontEnds" is a comprehensive course by Gary Simon, focusing on creating highly animated, interactive landing pages. It covers JavaScript, GSAP, and Three.js, with a p...
8 hours 58 minutes 38 seconds
The Complete 2023 Web Development Bootcamp

The Complete 2023 Web Development Bootcamp

Sources: udemy
Welcome to the Complete Web Development Bootcamp, the only course you need to learn to code and become a full-stack web developer. With over 12,000 ratings and a 4.8 average, my...
62 hours 32 minutes 23 seconds
SolidJS: The Complete Guide

SolidJS: The Complete Guide

Sources: Sinan Polat
This book is the result of two years of meticulous work. SolidJS may seem simple at first glance, but its internal structure includes complex...
Normal UI

Normal UI

Sources: Anthony Alicea
You don't need to be a designer to make a web application more user-friendly. Successful web applications are user-friendly web applications. The better...
39 minutes 16 seconds