Skip to content

ManINeedToSleep/FinTech_App

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 

History

12 Commits
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

Fintech Financial Bank

A modern financial management application with Nordic-inspired design, built with Next.js 14, TypeScript, and Prisma. Features a cosmic aurora theme, real-time financial tracking, and comprehensive financial tools.

โœจ Features

Core Features

  • ๐Ÿ” Secure JWT authentication
  • ๐Ÿ’ณ Transaction management (deposits, withdrawals, transfers)
  • ๐Ÿ“Š Interactive financial analytics with Recharts
  • ๐Ÿงฎ Comprehensive financial calculators
  • ๐ŸŒŒ Nordic-inspired cosmic design system

Financial Tools

  • ๐Ÿ’ฐ Savings calculator
  • ๐Ÿฆ Loan calculator
  • ๐Ÿ“ˆ Investment planner
  • ๐Ÿ’ต Tax calculator
  • ๐Ÿ  Mortgage calculator
  • ๐ŸŽฏ Retirement planner

Design System

  • ๐ŸŒ  Aurora borealis animations
  • โญ Twinkling star effects
  • ๐ŸŽจ Nordic color palette
  • ๐ŸŒŠ Glass-morphism UI elements
  • ๐Ÿ“ฑ Fully responsive design

๐ŸŽจ Theme Colors

:root {
  --aurora-green: #7CFCD0;
  --nordic-blue: #1E3D59;
  --frost-blue: #E2E8F0;
  --northern-pink: #FF61A6;
  --snow-white: #F7F9FC;
}

๐Ÿ›  Tech Stack

  • Framework: Next.js 14 (App Router)
  • Language: TypeScript
  • Database: Neon PostgreSQL
  • ORM: Prisma
  • Styling: Tailwind CSS
  • Authentication: JWT + bcrypt
  • Charts: Recharts
  • Animations: CSS + React
  • Icons: FontAwesome
  • Deployment: Vercel

๐Ÿ“ฆ Installation

  1. Clone the repository:
git clone https://github.com/yourusername/fintech-bank.git
cd fintech-bank
  1. Install dependencies:
npm install
  1. Set up environment variables:
# Database (Neon)
DATABASE_URL="postgresql://user:password@endpoint/database"
DIRECT_URL="postgresql://user:password@endpoint/database"

# Authentication
JWT_SECRET="your-secret-key"
JWT_EXPIRES_IN="7d"
  1. Initialize database:
npx prisma generate
npx prisma db push
npx prisma db seed
  1. Run development server:
npm run dev

๐Ÿš€ Deployment on Vercel

  1. Connect your repository to Vercel
  2. Add your environment variables in Vercel dashboard:
    DATABASE_URL="your-neon-db-url"
    DIRECT_URL="your-neon-direct-url"
    JWT_SECRET="your-secret"
    JWT_EXPIRES_IN="7d"
  3. Add build command override (optional, if needed):
    prisma generate && next build
  4. Deploy!

Note: Prisma Client needs to be generated during build time on Vercel. The build command in package.json already includes prisma generate to handle this automatically.

๐Ÿ“Š Database Schema

model User {
  id           Int           @id @default(autoincrement())
  email        String        @unique
  username     String
  passwordHash String
  firstName    String?
  lastName     String?
  accounts     Account[]
  transactions Transaction[]
  createdAt    DateTime      @default(now())
  updatedAt    DateTime      @updatedAt
}

model Account {
  id          Int           @id @default(autoincrement())
  accountType AccountType
  accountName String
  balance     Float         @default(0)
  userId      Int
  user        User          @relation(fields: [userId], references: [id])
  transactions Transaction[]
  createdAt   DateTime      @default(now())
  updatedAt   DateTime      @updatedAt
}

model Transaction {
  id          Int      @id @default(autoincrement())
  type        TransactionType
  amount      Float
  description String
  accountId   Int
  account     Account  @relation(fields: [accountId], references: [id])
  userId      Int
  user        User     @relation(fields: [userId], references: [id])
  categoryId  Int
  category    Category @relation(fields: [categoryId], references: [id])
  createdAt   DateTime @default(now())
}

model Category {
  id           Int           @id @default(autoincrement())
  name         String
  type         TransactionType
  icon         String
  transactions Transaction[]

  @@unique([name, type])
}

enum AccountType {
  CHECKING
  SAVINGS
  INVESTMENT
}

enum TransactionType {
  DEPOSIT
  WITHDRAWAL
  TRANSFER
}

๐Ÿ”’ API Routes

Authentication

  • POST /api/auth/register - Create new account
  • POST /api/auth/login - User login
  • GET /api/user - Get user profile

Transactions

  • GET /api/transactions - List transactions
  • POST /api/transactions/deposit - Make deposit
  • POST /api/transactions/withdraw - Make withdrawal
  • POST /api/transactions/transfer - Make transfer
  • POST /api/transactions/expense - Record expense

๐ŸŒŸ Contributing

  1. Fork the repository
  2. Create feature branch (git checkout -b feature/amazing-feature)
  3. Commit changes (git commit -m 'Add amazing feature')
  4. Push to branch (git push origin feature/amazing-feature)
  5. Open a Pull Request

๐Ÿ“ License

This project is licensed under the MIT License.

About

A Nordic-inspired financial management platform with secure authentication, transaction tracking, interactive analytics, and comprehensive financial planning tools, built on Next.js 14 with TypeScript and Prisma.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors