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

Web Components Demystified

Web Components Demystified

Sources: Scott Jehl
If you are like me, then you have probably been hearing a lot about web components lately. Many of us are looking for ways to integrate web components into...
7 hours 51 minutes 36 seconds
Learn Astro

Learn Astro

Sources: Chris Pennington
In a world of overly complex web frameworks, Astro stands out for its simplicity, excellent developer experience, and high performance. But behind this...
17 hours 12 minutes 58 seconds
The Approachable Guide to Accessible Components

The Approachable Guide to Accessible Components

Sources: fullstack.io
"A Clear Guide to Creating Accessible Components" is intended to provide a comprehensive understanding of web accessibility. The course covers the basics...
2 hours 19 minutes 45 seconds
Scalable TDD & Testing

Scalable TDD & Testing

Sources: Logic Room
The course "Scalable TDD and Testing" will help JavaScript UI engineers master an approach to scalable testing that is not dependent on a specific framework.
2 hours 56 minutes 56 seconds
Web Animations Full Course | Build a GTA VI Website & Master GSAP

Web Animations Full Course | Build a GTA VI Website & Master GSAP

Sources: jsmastery.pro, Adrian Hajdin
More than 70% of leading design-oriented companies use GSAP in production. Now you will not only be able to understand their approach, but you will also...
3 hours 31 minutes 47 seconds