FinWise is a UI-only React Native project that implements the interface of a personal finance management mobile app. While most screens are based on a community Figma design, some parts have been custom-designed or modified to better suit the app's flow or improve the user experience.
This project focuses solely on Front-End design using Expo and Tailwind CSS (via NativeWind), and does not include backend functionality or real data handling.
- Launch Screen – App splash screen
- Onboarding Screens – Introduction flow for new users
- Login Screen – Sign in to your account
- Signup Screen – Create a new account
- Forgot Password Screen – Reset your password
- Home Screen – Financial overview
- Analysis Screen – Spending analytics
- Category Screen – Manage or view spending categories
- Transaction Screen – List of income/expenses
- User Profile Screen – User information and settings
| Launch | Login | Signup |
|---|---|---|
 |
 |
 |
| OnBoarding | Home | Analysis |
|---|---|---|
 |
 |
 |
| Transaction | Category | Profile |
|---|---|---|
 |
 |
 |
Screenshots are from actual UI implementation based on the Figma design.
- React Native (via Expo)
- Expo CLI
- JavaScript
- React Navigation
- Styled Components / Custom Styles
- Tailwind CSS (via NativeWind)
-
Clone the repository:
git clone https://github.com/pnhoanganh/FinWise-app.git
-
Navigate to the project folder:
cd FinWise-app -
Install dependencies:
npm install
-
Start the development server:
npx expo start