Mobile banking app

Klyro

A mobile banking app for Android, with its own API and database: sign in, check your balance, send money, track spending and manage a virtual card. It is a simulator, so no real money is ever involved.

Install on Android(opens in a new tab)
QR code that opens the Klyro Android install page

Scan to installPoint your Android phone’s camera here

Start a similar project

01The challenge

Banking apps have to feel instant and trustworthy while the server does careful work behind every tap. Klyro had to show that full journey honestly: a balance you can rely on, transfers that can never be sent twice, and an app that still works when the network is slow or the server is waking up.

02Our approach

We built the backend first: a Django REST API with an append-only ledger, so every balance comes from recorded transactions, and idempotent transfers, so a repeated request can never move money twice. The React Native app sits on top, with short-lived sign-in tokens that refresh themselves, cached data for weak connections, and light and dark themes.

03What we built

  1. 01Android app built with React Native, Expo and TypeScript
  2. 02Django REST API with one consistent response and error format
  3. 03Append-only ledger: balances are calculated from transactions, never edited
  4. 04Transfers protected against double-sending, with row locking on the server
  5. 05Secure sign-in with short-lived tokens that refresh automatically
  6. 06Spending insights by week and month, with top categories
  7. 07Virtual card with freeze, limit and online-payment controls
  8. 08Profile photo upload, light and dark mode, and accessibility support
  9. 09Hosted API (Render) and PostgreSQL database (Neon), with over-the-air app updates

●Screens

Explore the screens

10 screens from the Klyro Android app, in light and dark mode. Select any screen to see it full size, then step through the rest.

  • Welcome Mobile

  • Sign in Mobile

  • Home Mobile

  • Activity Mobile

  • Send money Mobile

  • Transfer receipt Mobile

  • Cards Mobile

  • Insights Mobile

  • Profile & settings Mobile

  • Home in light mode Mobile

●Pages & features

Inside the Klyro app

9 screens, grouped by what you do in them. Each card says what the screen is for and what it does.

  • 01

    Welcome

    First screen: what Klyro is, with a clear way in for new and returning users.

    • Animated card, payment and chart illustration
    • ‘Get started’ and ‘I already have an account’
    • States clearly that no real money is used
  • 02

    Sign in

    Signs people in securely and explains any wait while the server wakes up.

    • Email and password with inline validation
    • Short-lived tokens stored in the phone’s secure storage
    • ‘Waking up the server’ message on slow first sign-in
  • 03

    Home

    The dashboard: balance, this month’s money in and out, quick actions and recent spending.

    • Balance card with a hide/show toggle
    • Money in and out for the month
    • Send, Top up, Cards and Insights shortcuts
    • 7-day spending chart and recent activity
    • Pull to refresh
  • 04

    Activity

    Every transaction, grouped by day, loading more as you scroll.

    • Search by name, note or reference
    • Filters for money in, money out and cards
    • Infinite scroll, 20 transactions at a time
  • 05

    Send money

    Pick a recipient, enter an amount and add a note.

    • Recipient by Klyro tag or account number
    • Amount keypad with the available balance
    • Confirmation step before money moves
  • 06

    Transfer receipt

    Confirms the transfer with a reference number.

    • Amount, recipient, note, reference and date
    • ‘Send another’ shortcut
    • Safe to retry: a repeated request never sends twice
  • 07

    Cards

    A virtual card the user controls.

    • Freeze and unfreeze
    • Monthly limit with progress
    • Online payments on or off
  • 08

    Insights

    Where the money went, by week or month.

    • Total spent with change versus the last period
    • Category breakdown chart
    • Top categories with payment counts
  • 09

    Profile & settings

    Personal details, security and app preferences.

    • Profile photo upload
    • System, light or dark theme
    • Hide balance on launch, notifications and haptics
    • Log out

How it fits together

Built with
  • React Native
  • Expo
  • TypeScript
  • Django REST Framework
  • PostgreSQL
  • TanStack Query
  1. 01Sign in

    The app signs in through the API and keeps short-lived tokens in secure storage.

  2. 02Load the dashboard

    Balance, activity and insights load from the API and are cached for weak connections.

  3. 03Send money

    Each transfer carries a unique key, so the server records it once even if the request is repeated.

  4. 04Record in the ledger

    The server locks both accounts, writes the ledger entries and returns the new balance.