💳Ez Finance Dashboard

Explore the possibilities of financial success with us today

---

🔗Links

Template Link on Bubble Marketplace

Template Link on Our Website

Preview Link

Forum Link

---

Photos

1

2

3

4

5

6

7

---

Introduction

Ez Finance Dashboard is a modern web template designed for those who want to manage their money effectively. This template provides powerful tools for managing and monitoring financial transactions. With our template, you can easily track and analyze financial data, manage your investment portfolio, and monitor your budget. Integration with Plaid provides secure and convenient access to financial data, making it easy to manage bank accounts, complete transactions, and monitor financial health.

The application includes:

• Overview Tab Dashboard - Offers accurate control over the movement of funds across accounts, payment history, and income/expense schedules.

• Autopay & Templates - We've included an auto-payment feature to help you remember to pay your bills. Additionally, for payments with varying amounts, we've added the "templates" function.

• Transactions - We've included additional filters to speed up the search for required payments.

Our template is fully compatible and responsive across all device types. Our team has developed this template in line with up-to-date UX/UI design standards, providing an intuitive interface and visually pleasing aesthetics.

While we sell the template as is, we remain open to discussing additional modifications. Before purchasing the template, we recommend checking out the preview section. If you have any questions or require further clarification, please do not hesitate to contact us, and we'll be delighted to assist and tailor a solution to suit your needs.

---

Features

• Dashboard

• Transactions

• Payments

• Invoicing

• Trading

• Reports

• Responsive design

---

Notes

Important note: After purchasing this template and customizing it, be sure that you had a chance to learn how to set up data security.

Check all privacy settings by the following link before launch: Bubble Privacy

Since access to objects differs in each application and is unique for each case, ensure you have established all the privacy rules.

This template is not the final product. Any part of the application can be modified for different needs.

---

Pages

index

This page presents the features of this application. Also, on this page, clients can find links to other EazyCode templates on this topic.

authorization

This is the Sign-In / Sign-Up page.

dashboard

This is a user panel page. The page displays nine tabs.

• Dashboard - This tab contains general information about the current user's finances, including expenses and income graphs, a list of transactions, a list of added bank cards, and the total balance.

• Plaid Connect - This is the PLAID connection tab. On this tab, the user can connect Plaid account and make ACH transfers.

• Wallet - This tab with a list of all added bank cards. The user can add/delete/ edit any of them. For each card, he has a list of options, such as: setting a limit, replenishing the balance, making a transfer, changing the PIN code, blocking, and reissuing the card.

• Transactions - This tab displays a list of all completed transactions, with the option to filter the list by date, credit card, category, and status.

• Payments - A tab for creating automatic payments, templates, and making transfers of any type.

• Invoicing - In this tab, the user can see the list of invoices, and their status. Also, create new invoices.

• Trading - This tab displays stock market trends.

• Reports - This tab displays categories by customer spending.

• Settings - Tab with user personal information and change password form.

reset_pw

This page allows the user to reset the password.

404

This page appears when something goes wrong in the app's work

---

Reusable elements

Footer

This reusable element includes links to the EazyCode templates, socials, and personal web.

Header

This reusable element includes the app navigation panel.

header dashboard

This reusable element includes the app navigation panel while a user logged in.

---

Workflow

Highlighting the workflow with color is a great way to separate actions in essence and significance. Below is the EazyCode standard for the use of colors with a detailed explanation.

The standards below are for informational purposes only. Any discrepancy is not related to the functionality of the application.

Blue - The actions taking place on our screen do not utilize the application's resources. For instance, when an element is clicked and a popup is opened or closed.

Green - These actions involve creating or modifying entries in the database. For example, "Create a new Thing," "Make changes to a thing or a list of things," as well as "Copy a list of things," and so on.

Red - This action involves deleting or resetting values. For instance, "Delete a thing or a list of things," as well as "Reset a group" and "Reset inputs."

Orange - Actions related to your navigation. For example, "Navigate to a page," or "Do when a condition is true" – when you use specific values for checking, such as "When the current user is logged in," and so on.

Cyan - Actions utilizing Custom Events – lengthy tasks that involve the creation, modification, deletion, and plugins within a single comprehensive workflow as steps.

Brown - Custom workflow, API workflow, and similar tasks.

Purple - The significance of this color is determined by the developer themselves, as it is done due to the fact that everyone has their own approach to development.

Grey - All other actions.

---

Plaid

Plaid is a financial technology company that provides a platform for connecting financial accounts with various applications and services. It acts as an intermediary between consumers, banks, and fintech apps, allowing users to securely link their bank accounts, credit cards, and other financial accounts to these apps. The Plaid platform provides developers with tools and APIs to access and work with financial data, enabling features such as account verification, balance checking, transaction history access, and more. This allows fintech apps to offer a range of services like budgeting tools, investment advice, loan applications, and payment options, all while keeping data secure and compliant with regulations.

Below is a step-by-step instruction for configuring the plugin.

1. Install the Ez Plaid Connect & ACH Transfers plugin.

1. For each call in the plugin, two keys are required: the client ID and the secret key. They are repeated in every call. You can get these keys for free by registering at this link: https://dashboard.plaid.com/signup

1. You need to get keys in your dashboard: https://dashboard.plaid.com/developers/keys

1. There are 3 types of environments in the Plaid ecosystem. Sandbox, development, production. To get started, we recommend choosing Sandbox and trying to integrate this test environment. Each call has a required parameter to fill in. It can be dynamic depending on your conditions.

1. The last step in the dashboard panel of the Plaid, you need to type "redirect URL" of your application. In our case, we want the user to return to the dashboard page after authorization. 2 links for the test and live version.

1. You are ready to start integration. The first step is to create a link token using the "Get Link Token" plugin API data call, filling in the fields of the main settings of your application. In the following example, we immediately write "link_loken" in the current user field. In the Call Data parameters, we specify the user ID, Application Name, and a link to the created Endpoint (Backend Workflow) for the subsequent configuration of the webhook and our specified redirect URI.

1. Next, you need to install the plugin element (Windows Auth) in your App. It is required to specify our saved link token for authorization to work. In the preview, with the correct link token, you will have the opportunity to select a bank to connect to. For test mode, we recommend using "Chase"

1. After passing the authorization stage, you are returned to the "redirect uri" that you entered earlier in Plaid Dash. The link will contain the oauth_state_id parameter, which you will accept on the BUBBLE side when the page is loaded. You create a workflow and the first step is to set the plugin action - Handle Public Key.

1. Next step, install the Plugin Event upon successful generation of the Public Key.

1. Inside the event, your first action is to exchange your public key for the main "access token" using the Public Token Exchange API call.

1. In response to your call, the next step you can use is an "access token". In our example, we write it to the current user field.

1. Using this token, you can get permission to conduct subsequent ACH transactions or use this token in conjunction with other Plaid BUBBLE plugins.

To get data about the current account and available payment methods, use the plugin call - "Get Account Info"

---

Data Types

This data type contains information only for demonstration purposes.

Card

This data type is used to store bank card proprieties.

Field name	Type	Notes
accountNumber	text	Stores the card account number.
balance	number	Stores the card balance.
block	yes/no	Stores the card status(blocked or not).
cardCredit	number	Stores the credit card number.
cardholder	text	Stores the card holder name.
cardLimit	number	Stores the card limit.
cardName	text	Stores the card title.
cardNumber	number	Stores the card number.
expirationDate	date	Stores the card expiration date.
image	image	Stores the card image.
image on click	image	Stores the card image when clicked.
PINcode	text	Stores the card PIN code.
valid	text	Stores the card valid information.

Chart Sectors

This data type is used to store chart proprieties in the trading tab.

Field name	Type	Notes
name	text	Stores the sector title.
percent	numebr	Stores the sector percentage.

ChartBreakdown

This data type is used to store chart proprieties in the report tab.

Field name	Type	Notes
Labes	Chat	Stores the sector title.
num	text	Stores the sector percentage.

ChartJs

This data type is used to store chart proprieties in the dashboard tab.

Field name	Type	Notes
LabelsMonth	text	Stores the chart month.
lable Week	text	Stores the chart week.
MonthExp	number	Stores the month expenses value.
MonthInc	number	Stores the month income value.
WeekExp	number	Stores the week expenses value.
weekInc	number	Stores the week income value.

Checkout

This data type is used to store transfer proprieties.

Field name	Type	Notes
additionalData	text	Stores the transfer message.
card	Card	Stores the card data type.
Complete	yes/no	Stores the transfer status(done or not).
providers	Service_Providers	Stores the service provider data type.
serviceCategory	Service_Category	Stores the service category data type.
theAmount	number	Stores the transfer ammount.

Commodities Chart

This data type is used to store commodities chart proprieties in the trading tab.

Field name	Type	Notes
Date	date	Stores the chart date.
last	number	Stores the chart value number.
last2	number	Stores the chart value number.
last3	number	Stores the chart value number.
last4	number	Stores the chart value number.

Currencies

This data type is used to store currency proprieties in the trading tab.

Field name	Type	Notes
% Change	number	Stores the currency change percentage.
Change	number	Stores the currency change vlaue.
Price	number	Stores the currency price.
Symbol	text	Stores the currency symbol.
SymbolImage	image	Stores the currency symbol image.

Invoicing

This data type is used to store invoicing proprieties.

Field name	Type	Notes
Amount	number	Stores the invoice amount.
Due date	date	Stores the invoice due date.
ID	text	Stores the invoice ID.
Name	text	Stores the invoice title.
status	Status	Stores the status option set.

Service_Category

This data type is used to store service category proprieties.

Field name	Type	Notes
name	text	Stores the category title.
service	Service_Providers	Stores the service providers data type.
serviceProviders	List of Service_Providerses	Stores the service providers data type.

Service_Providers

This data type is used to store service provider proprieties.

Field name	Type	Notes
imageSubtype	image	Stores the provider image.
serviceCategory	Service_Category	Stores the service category data type.
subtype	text	Stores the provider title.

Templates

This data type is used to store template proprieties.

Field name	Type	Notes
automaticPayment	AutoPay	Stores the auto pay option set.
AutoPay	yes/no	Stores the auto pay status(enable or not).
templateAdditional	text	Stores the template aditional informaition.
templateAmount	number	Stores the template ammount.
templateCard	Card	Stores the card data type.
templateCategory	Service_Category	Stores the service category data type.
templateProviders	Service_Providers	Stores the service provider data type.
templateTitle	text	Stores the template title.

Transactions

This data type is used to store transaction proprieties.

Field name	Type	Notes
additionalData	text	Stores the transaction ID.
amount	number	Stores the transaction ammount.
card	Card	Stores the card data type.
checkout	Checkout	Stores the checkout data type.
status	Status	Stores the status option set.

Treasuries

This data type is used to store treasure proprieties in the trading tab.

Field name	Type	Notes
Asked	number	Stores the treasure asked value.
Asked Yield	number	Stores the treasure asked yield value.
Bid	number	Stores the treasure bid value.
CHG	number	Stores the treasure CHG value.
Coupon	number	Stores the treasure coupon value.
Maturity	text	Stores the treasure maturity value.

User

This data type is used to store user proprieties.

Field name	Type	Notes
card	Card	Stores the card data type.
Mobile	number	Stores the user mobile number.
name	text	Stores the user full name.
photo	image	Stores the user image.
Plaid Access Token	text	Stores the user plaid access token.
Plaid Session linkToken	text	Stores the user plaid session link token.

---

Option sets

AutoPay

• Weekly

• Monthly

• Quarterly

• Annually

Status

• Paid

• Rejected

• Unpaid

---

The template is sold as is, although additional modifications can be discussed. Feel free to contact us for any inquiries and we’ll be happy to find a solution for your ideas – http://eazycode.com/

Hire us:

https://www.fiverr.com/share/qQoDQZ https://www.upwork.com/freelancers/~01c1a4cbef44ecb5f1 Follow us:

https://www.facebook.com/eazycode https://twitter.com/ezcode_official https://www.instagram.com/eazycodecom/ https://www.linkedin.com/company/eazycodecom/