Understanding Frameworks: Rebuilding the Expense Tracker

Rebuilding an application with a framework.

In this course, you'll get firsthand experience using Backbone.js - one of the earlier, popular frameworks for JavaScript. Learning Backbone is an excellent stepping stone to understanding other newer frameworks like Angular and React, as many foundational concepts can be traced to this framework. Backbone is a common requirement in web developer job listings.

Here, you'll get to rebuild the application you previously built (the Expense Tracker). This will give you a unique perspective on the differences between coding an application from scratch, versus using a modern framework to aid in the development process.

This course is taught by Senior Software Engineer and mentor Gerard O'Neill (Trello/Atlassian). Get ready because you're going to learn a lot of useful skills in this course!

Skills covered in this course: HTML CSS JavaScript Frameworks Backbone.js jQuery Data Storage HTTP Form Validation Sorting Routing MVC

This course requires a PRO account. Access all courses for $19/month with a Pro membership.
Or try our free courses.

Lessons

1. Demo (1:02) Preview

2. Basic Setup (1:44)

3. Backbone Setup (5:39)

4. Add Form (4:51)

5. Add App and View (2:39)

6. Form View Intro (3:37)

7. Append Form View (4:38)

8. Move Form to Js (4:39)

9. Form Submit Setup (3:29)

10. Log Form Values (3:08)

11. Expense Model (4:26)

12. Expenses Collection (5:26)

13. Expenses View (5:06)

14. Expense (5:57)

15. Fix Expenses View (1:34)

16. Display Expense (5:52)

17. Expense Id (3:57)

18. Save Expense to Localstorage (4:43)

19. Load Expenses From Localstorage (5:03)

20. Remove Expense View (3:25)

21. Remove Expense Model (3:43)

22. Edit Expense Form Setup (4:24)

23. Edit Expense Form Complete (4:58)

24. Basic Amount Validation (3:43)

25. Render Validation Errors (4:46)

26. Validate Expense Edit (3:03)

27. Validate Expense Amount Complete (5:38)

28. Validate Date Complete (5:28)

29. Format Amount Setup (5:41)

30. Format Amount Complete (5:44)

31. Fix Broken Validation (1:47)

32. Format Dates (4:09)

33. Format on Edit (1:48)

34. Fix Firefox (2:43)

35. Sorting Setup (4:29)

36. Router Setup (4:35)

37. Router Params (4:32)

38. Sort Collection Setup (3:18)

39. Expenses Sort Parameters (2:05)

40. Comparator (5:20)

41. Expenses View Sort Links (1:33)

42. Expenses View Sort Direction (5:39)

43. Expense Sorting Complete (3:23)

44. Form Reset and Closing (2:03)