Creating a Basic CRUD Application with Backbone.js Starter Kit

This is a first part of a multi-part series article where I will show you how to create a relatively simple CRUD Application with Backbone.js. The Application is a personal finance application where the user will be able to create multi-currency accounts and should be able to track expenses and incomes. The application is created with the Backbone.js Starter Kit of my previous post and the full source code is hosted on GitHub.

First, lets take a quick look at some of the functionalities of this application. When the application loads it will show the following screen, the transactions, accounts and categories menu can be only accessed if the user is signed-in.

Home
My Walletz Home

When the user sign ups it will populate few default expense and income categories which can be later modified.

Categories
My Walletz Categories

When creating a new account the user should be able to specify the type, currency and the initial balance of the account.

New Account
My Walletz New Account

Once the account is saved, it should show the account list in a sortable data grid

Accounts
My Walletz Accounts

Also the transactions` menu would be populated with account names.

Transactions Menu
My Walletz Transactions Menu

When selecting an account from the transactions menu it should show the transactions of that account in sortable and pageable data grid, but unlike the accounts, the sorting and paging should be done in server side.

Transactions
My Walletz Transactions

And when creating transaction the user should be able to specify the category (expense/income) which automatically adjust the balance of the account.

New Transaction
My Walletz New Transaction

That's it for it today, in the upcoming posts I will go into detail explaining how each piece was built, so stay tuned.

Comments

blog comments powered by Disqus