FlowWise 💸

Your Intelligent, Agent-Powered Financial Companion

FlowWise is a modern personal finance application built with React Native and Expo. Experience seamless expense tracking, secure authentication, and AI-driven insights to master your financial flow.

Dashboard	Transactions	Add Expense	Insights
Spending	Goals	Profile	Onboarding

• 🛍️ Expense & Transaction Tracking: Log, categorize, and monitor your expenses seamlessly.
• 🤖 AI-Powered Assistant: Leverage Google's Gemini to analyze your spending and get smart financial advice.
• 🔐 Secure Authentication: Enterprise-grade security handling identity management via Clerk.
• 🗃️ Local First SQLite: Fast and reliable persistent local database using Expo SQLite.
• 🎨 Modern UI/UX: Smooth animations powered by Reanimated, Bottom Sheets, and custom Google Fonts (DM Sans, Syne).
• 📱 Cross-Platform: Write once, run seamlessly on Android, iOS, and Web.

• Framework: Expo & React Native
• Routing: Expo Router (app/ directory)
• State Management: Zustand
• Authentication: Clerk Expo (@clerk/clerk-expo)
• Database: Expo SQLite
• AI Integration: Google Gemini API
• Animations: React Native Reanimated & React Native Gesture Handler

Follow these instructions to get a local copy up and running on your machine, whether you are on macOS or Windows.

Before you begin, ensure you have the following installed on your machine:

• Node.js: (v18 or newer recommended). Download from Node.js Official Site.
• npm or yarn or bun: Node package managers.
• Git: Version control system.

• Xcode: Required for iOS simulation. Download from the Mac App Store.
  • Setup: Open Xcode -> Settings -> Locations -> Ensure Command Line Tools are selected.
  • Install the iOS Simulator inside Xcode.
• Android Studio: Required for Android emulation. Download from the Android Developer Site.
  • Setup: Follow Android Studio prompts to install the Android SDK and create an Android Virtual Device (AVD).

• Note: You cannot run an iOS simulator natively on Windows. To test on iOS, you must use the Expo "Go" app on a physical iPhone.
• Android Studio: Required for running the Android emulator. Download from the Android Developer Site.
  • Ensure you set up your ANDROID_HOME Environment Variable to point to your Android SDK.
  • Create a Virtual Device in the Device Manager.

1. Clone the repository

   git clone https://github.com/your-username/flowwise.git
   cd flowwise

2. Install dependencies

   npm install
   # or yarn install

You need to set up environment variables for Authentication (Clerk) and AI (Gemini).

1. Create a .env file at the root of your project:

   # On macOS/Linux
   touch .env
   
   # On Windows (Command Prompt)
   type nul > .env

2. Add the following keys to your .env (obtain your API keys from Clerk and Google AI Studio):

   # Clerk Authentication Keys
   EXPO_PUBLIC_CLERK_PUBLISHABLE_KEY=your_clerk_publishable_key
   CLERK_SECRET_KEY=your_clerk_secret_key
   
   # Gemini AI Key
   EXPO_PUBLIC_GEMINI_KEY=your_gemini_api_key

Once setup is complete, you can start the development server.

# Start the Expo Metro Bundler
npx expo start

From the terminal prompt, you can press:

• i to open the iOS simulator (macOS only).
• a to open the Android emulator (macOS & Windows).
• w to open it in a web browser.
• Or scan the QR code with the Expo Go app on your physical iOS/Android device!

flowwise/
├── app/               # Expo Router pages and layouts (Navigations)
│   ├── (auth)/        # Authentication screens (Sign In, etc.)
│   ├── expense/       # Expense management screens
│   ├── transaction/   # Transaction detailed views
│   └── index.tsx      # Main application entry point
├── assets/            # Images, icons, and fonts
├── components/        # Reusable UI React components
├── constants.js       # App-wide constants (themes, configurations)
├── db/                # SQLite database schemas and queries
├── store/             # Zustand state management slices
├── services/          # API calls (e.g., Gemini integration)
└── utils/             # Helper functions and hooks

The full UI/UX design process, wireframes, and visual design decisions for FlowWise are documented on Behance.

📐 View the FlowWise Case Study on Behance →

Contributions are what make the open-source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

1. Fork the Project
2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
3. Commit your Changes (git commit -m 'Add some AmazingFeature')
4. Push to the Branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

Distributed under the MIT License. See LICENSE for more information.