Installation

How to install and set up YourBanK in your project.

Framework Setup

YourBanK is built on top of Next.js. Run one of the following commands to create a new Next.js project:

npx create-next-app@latest my-app --typescript --tailwind --eslint

Install YourBanK

Install YourBanK and its dependencies:

npm install @hookform/resolvers@^3.3.4 @radix-ui/react-dialog@^1.0.5 @radix-ui/react-label@^2.0.2 @radix-ui/react-navigation-menu@^1.2.1 @radix-ui/react-progress@^1.1.0 @radix-ui/react-select@^2.0.0 @radix-ui/react-slot@^1.0.2 @radix-ui/react-tabs@^1.0.4 @sentry/nextjs@^8.42.0 chart.js@^4.4.2 class-variance-authority@^0.7.0 clsx@^2.1.1 dwolla-v2@^3.4.0 framer-motion@^11.14.4 jsonwebtoken@^9.0.2 lucide-react@^0.374.0 next@14.2.3 node-appwrite@^12.0.1 plaid@^23.0.0 query-string@^9.0.0 react@^18 react-chartjs-2@^5.2.0 react-countup@^6.5.3 react-dom@^18 react-hook-form@^7.51.3 react-plaid-link@^3.5.1 tailwind-merge@^2.3.0 tailwindcss-animate@^1.0.7 zod@^3.23.4

Environment Setup

Create a .env.local file in your project root and add your API keys:

#NEXT
NEXT_PUBLIC_SITE_URL=http://localhost:3000

#APPWRITE
NEXT_PUBLIC_APPWRITE_ENDPOINT=https://cloud.appwrite.io/v1
NEXT_PUBLIC_APPWRITE_PROJECT=next_pubic_appwrite_project_id
APPWRITE_DATABASE_ID=database_id
APPWRITE_USER_COLLECTION_ID=user_collection_id
APPWRITE_BANK_COLLECTION_ID=bank_collection_id
APPWRITE_TRANSACTION_COLLECTION_ID=transaction_collection_id
NEXT_APPWRITE_KEY=next_appwrite_key_here

#PLAID
PLAID_CLIENT_ID=plaid_id_here
PLAID_SECRET=plaid_secret_here
PLAID_ENV=sandbox
PLAID_PRODUCTS=auth,transactions,identity
PLAID_COUNTRY_CODES=US,CA

#DWOLLA
DWOLLA_KEY=dwolla_key_here
DWOLLA_SECRET=dwolla_secret_here
DWOLLA_BASE_URL=https://api-sandbox.dwolla.com
DWOLLA_ENV=sandbox

JWT_SECRET=your_jwt_secret_here

Next Steps

Now that you have installed YourBanK, you can start using the components in your application. Check out the components section to learn more about available components and their usage.