A
Anonymous

Finance Dashboard - Copy this React, Tailwind Component to your project

Prompt:-Create-a-finance-and-investment-application-using-React-and-Tailwind-CSS.-The-focus-should-be-on-designing-a-clean-and-functional-dashboard-that-displays-key-financial-data.-The-application-should-have-the-following-features:-Dashboard-Overview:-A-central-place-where-the-user-can-see-an-overview-of-their-investment-portfolio,-including-total-value,-current-balance,-and-portfolio-performance-(e.g.,-%-change).-A-net-worth-summary-that-combines-both-investments-and-current-account-balances.-Include-visualizations-like-charts-and-graphs-that-show-portfolio-distribution,-historical-performance,-and-comparison-with-major-stock-indices-(e.g.,-S&P-500).-Transaction-History-Tab:-A-detailed-list-of-all-past-transactions-(both-purchases-and-sales-of-financial-instruments-such-as-stocks,-bonds,-etc.).-For-each-transaction,-display-the-ticker,-quantity,-price,-transaction-date,-and-performance-(the-change-in-value-since-purchase,-showing-both-total-gain/loss-and-percentage-gain/loss).-Add-filters-to-view-transactions-by-date-range,-instrument-type,-and-performance-(e.g.,-filter-by-profitable-vs.-unprofitable-transactions).-Account-Movements-Tab:-A-tab-dedicated-to-the-user’s-checking-account-movements.-This-should-show-deposits,-withdrawals,-fees,-and-account-balance.-Each-entry-should-include-the-date,-description,-amount,-and-balance-after-the-movement.-Include-filters-to-search-for-specific-transactions-or-view-by-date,-type,-or-amount.-Investment-Portfolio-Tab:-Show-the-user’s-investment-portfolio-with-a-breakdown-of-all-assets-(stocks,-bonds,-mutual-funds,-etc.).-For-each-asset,-display-ticker-symbol,-quantity-owned,-current-price,-purchase-price,-and-current-value.-Display-the-overall-portfolio-performance,-including-percentage-change-and-total-returns.-Watchlist-Tab:-Allow-users-to-add-stocks,-bonds,-or-other-financial-instruments-to-their-watchlist.-Show-real-time-data-for-each-ticker-(price,-%-change,-etc.).-Additional-Features:-Include-a-search-bar-to-quickly-find-specific-transactions,-accounts,-or-assets.-Allow-the-user-to-sort-or-filter-data-based-on-different-criteria,-such-as-date,-type-of-transaction,-performance,-and-investment-category.-Make-the-UI-responsive-and-easy-to-navigate,-ensuring-smooth-transitions-between-tabs-and-clear-visual-presentation-of-data.

Prompt
Component Preview

About

FinanceDashboard - View your investment portfolio, transaction history, and account movements. Built with React and Tailwind. Copy component code!

Share

Last updated 1 month ago