EazyCode Documentation
Visit Our Website
  • ๐Ÿ“‘EazyCode Docs
  • ๐Ÿ“—FlutterFlow Templates
    • ๐ŸฌEz Booking
    • ๐Ÿ‘จโ€๐Ÿ’ปEz Job
  • ๐Ÿ“•Bubble Templates
    • ๐Ÿ“Ez AI Quiz Generator
    • ๐Ÿ‘ฉโ€โš•๏ธEz Mental Health Mobile
    • ๐Ÿ’ธEz Crypto Dashboard
    • ๐ŸกEz Real Estate CRM
    • ๐ŸššEz Delivery CRM
    • ๐Ÿ’ณEz Finance Dashboard
    • ๐Ÿ“ฑEz Marketplace Mobile
    • ๐ŸงฅEz AI Marketplace
    • ๐ŸŒEz Social Dashboard
    • ๐ŸกEz Smart House Dashboard
    • ๐Ÿ‘•Ez T-shirt Design Landing
    • ๐Ÿ‘ฉโ€๐ŸŽ“Ez Education Portal
    • ๐ŸจEz Hotel CRM
    • ๐Ÿ–ฅ๏ธEz Dashboard RTL
    • ๐Ÿ“—Ez Education Admin System CRM
    • ๐Ÿ–ฅ๏ธEz Store Admin Panel, CRM
    • ๐Ÿ’ถEz Accountant CRM
    • โ›‘๏ธEz Med CRM Appointment
    • ๐Ÿ–จ๏ธEz HR CRM Dashboard
    • ๐Ÿช™Ez Nft Dashboard
    • ๐ŸŒดEz Tours
    • โค๏ธEz Donations
    • ๐Ÿ“ˆEz Crypto IDO
    • ๐Ÿ“‡Ez Card Landing
    • ๐ŸงชEz Med Laboratory
    • ๐ŸคEz CRM Dashboard 2.0
    • ๐Ÿ’ปEz Freelance
    • ๐Ÿ“’Ez Base Multi Pages
    • ๐ŸŽซEz Tickets & Events
    • ๐Ÿ›๏ธEz Market Shop
    • ๐Ÿ“ธEz Photographer
    • ๐Ÿ’ปEz LinkedIn - Jobs Network
    • ๐Ÿ–ผ๏ธEz Crypto & NFT Market
    • ๐ŸงฉEz Multipurpose
    • ๐Ÿ›๏ธEz Marketplace Shop
    • ๐Ÿฝ๏ธEz Fast Food - Restaurant
    • ๐Ÿ–ฑ๏ธEz Task Manager Pro
    • ๐Ÿ“–Ez Quiz Generator
    • ๐Ÿ Ez Travel Shop
    • โ˜•Ez Buy Me a Coffee - Donations
    • ๐Ÿ“ฑEz Mobile App Pro
    • ๐ŸฉบEz Appointments - Telemedicine
    • ๐Ÿ’ฌEz Messages - Chat
    • ๐Ÿ“Ez Listings App
    • ๐ŸŽฎEz Game Dashboard
    • ๐Ÿ“šEz School - Learning & Booking
    • ๐Ÿ“ฆEz Relocation / Moving Company
    • ๐Ÿ“‹Ez Dashboard Pro
    • ๐Ÿ“ฑEz Socialgram like Instagram
    • ๐Ÿ› ๏ธEz Profi
    • ๐ŸŽฏEz Membership like Patreon
    • ๐ŸขEz Rent - Real Estate
    • ๐Ÿ“–Ez Courses
    • ๐ŸฌEz Real Estate
    • ๐Ÿš˜Ez Car Dealer
    • ๐ŸจEz Hotels and Home Booking
    • โš™๏ธEz Crowdfunding & Fundraising
    • ๐Ÿ“ฐEz Journal - Blog Template
    • ๐Ÿ’ตEz Job Board
    • ๐Ÿ›’Ez Marketplace Pro - Shop
    • ๐ŸฆทEz Doc - Appointments Book
    • ๐Ÿ‹๏ธEz Fitness Club Template
    • ๐Ÿช™Ez Crypto Coin Landing
    • ๐Ÿ’ตEz Ecommerce CRM
    • โœˆ๏ธEz Travel Marketplace
    • ๐ŸEz Food Delivery App
    • ๐Ÿ“ˆEz Dashboard + OpenAI
    • ๐Ÿ—’๏ธEz Task Manager V2.0
    • ๐Ÿ›๏ธEz Marketplace - Shop v3.0
    • ๐Ÿ›ซEz Traveler
    • ๐Ÿ“‡Ez Starter - Landing Page
    • ๐Ÿ“ฒEz Mobile PWA
  • ๐Ÿ”ŒBubble Plugins
    • ๐Ÿ’ณEz Plaid Connect & ACH Transfers
    • ๐Ÿ“–Ez Organization Chart
    • ๐Ÿ—„๏ธEz Google AI
    • โœจEz Particles
    • โŒจ๏ธEz OCR
    • ๐Ÿ“ฒEz ScreenShot
    • ๐Ÿ”ŽEz WebTour
    • โš™๏ธEz Phosphor Icons
    • ๐ŸEz Progress/Countdown Time Bar
    • โณEz Simple Timer
    • ๐Ÿ”Ez MINUT
    • ๐Ÿ“…Ez ICS File Generator (Calendar)
    • ๐Ÿ”‘Ez Nuki
Powered by GitBook
On this page
  • ๐Ÿ”—Links
  • Photos
  • Introduction
  • Features
  • Notes
  • Pages
  • index
  • authorization
  • dashboard
  • reset_pw
  • 404
  • Reusable elements
  • Footer
  • Header
  • header dashboard
  • Workflow
  • Plaid
  • Data Types
  • Card
  • Chart Sectors
  • ChartBreakdown
  • ChartJs
  • Checkout
  • Commodities Chart
  • Currencies
  • Invoicing
  • Service_Category
  • Service_Providers
  • Templates
  • Transactions
  • Treasuries
  • User
  • Option sets
  • AutoPay
  • Status

Was this helpful?

  1. Bubble Templates

Ez Finance Dashboard

Explore the possibilities of financial success with us today

PreviousEz Delivery CRMNextEz Marketplace Mobile

Last updated 11 months ago

Was this helpful?


๐Ÿ”—Links


Photos


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.

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.

  • 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. 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

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

Stores the card data type.

Complete

yes/no

Stores the transfer status(done or not).

providers

Stores the service provider data type.

serviceCategory

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

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

Stores the service providers data type.

serviceProviders

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

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

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

Stores the card data type.

templateCategory

Stores the service category data type.

templateProviders

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

Stores the card data type.

checkout

Stores the checkout data type.

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

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.

text

Stores the user plaid access token.

text

Stores the user plaid session link token.


Option sets

AutoPay

  • Weekly

  • Monthly

  • Quarterly

  • Annually

Status

  • Paid

  • Rejected

  • Unpaid


Hire us:

Check all privacy settings by the following link before launch:

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

Install the plugin.

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:

You need to get keys in your dashboard:

List of

Access Token

Session linkToken

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 โ€“

Follow us:

Template Link on Bubble Marketplace
Template Link on Our Website
Preview Link
Forum Link
Bubble Privacy
Ez Plaid Connect & ACH Transfers
https://dashboard.plaid.com/signup
https://dashboard.plaid.com/developers/keys
http://eazycode.com/
Plaid
Chat
Card
Service_Providers
Service_Category
Status
Service_Providers
Service_Providerses
Service_Category
AutoPay
Card
Service_Category
Service_Providers
Card
Checkout
Status
Card
Plaid
Plaid
๐Ÿ“•
๐Ÿ’ณ
https://www.fiverr.com/share/qQoDQZ
https://www.upwork.com/freelancers/~01c1a4cbef44ecb5f1
https://www.facebook.com/eazycode
https://twitter.com/ezcode_official
https://www.instagram.com/eazycodecom/
https://www.linkedin.com/company/eazycodecom/
test
Page cover image