FinMan UI

FinMan UI is a modern web client for financial management, built as a React single-page application with a focus on clean design and responsive interaction.

Features

• Authentication-enabled protected routes
• Transaction creation and management
• Dashboard-style transaction views
• Responsive layout with navigation and footer components
• Form validation and user-friendly input handling
• Firebase integration for backend services

Technology Stack

• React 18 for UI components and application logic
• Vite for fast development and production builds
• Tailwind CSS for utility-first styling
• React Router DOM for client-side routing
• Firebase for authentication and data storage
• React Hook Form and Yup for form handling and validation
• Radix UI and Lucide for accessible UI primitives and icons
• Axios for HTTP request handling
• ESLint for code quality and linting

Project Structure

• src/ - application source files
• src/components/ - reusable UI components
• src/pages/ - page-level routes and views
• src/routes/ - route protection logic
• config/ - application and Firebase configuration

Available Scripts

• npm run dev - start development server
• npm run build - build production assets
• npm run preview - preview production build
• npm run lint - run ESLint

Getting Started

1. Install dependencies:

   npm install

2. Start the app:

   npm run dev

Built for clear financial workflows and a polished developer experience.