Autonoma Bank Demo WebApp

Live Demo

A demo front-end application simulating a modern banking UI, built with Next.js, TypeScript, and Tailwind CSS.

Table of Contents

• About
• Features
• Tech Stack
• Getting Started
  • Prerequisites
  • Installation
  • Running Locally
  • Building for Production
• Project Structure
• Contributing
• License
• Acknowledgments

About

The Autonoma Bank Demo is a showcase application that mimics a real-world banking experience — complete with dashboards, transactions, and account management screens.

This demo is designed to be used with Autonoma AI to automatically generate, execute, and maintain end-to-end tests across both web and mobile environments. It provides realistic user flows for testing login, payments, transfers, and UI consistency, serving as a sandbox to demonstrate Autonoma’s no-code AI testing capabilities.

And yes — it was vibe-coded proudly with v0.

Features

• Modern banking flows: login, dashboard, transfers, transaction history
• Responsive UI optimized for desktop and mobile
• Component-driven architecture for easy maintenance
• Tailwind-based design system
• Ideal testbed for Autonoma AI to generate and run end-to-end tests automatically

Tech Stack

• Framework: Next.js (React)
• Language: TypeScript
• Styling: Tailwind CSS
• Build Tools: PostCSS, Next.js config, Tailwind config
• Package Manager: pnpm

Getting Started

Prerequisites

• Node.js (v16 or newer)
• pnpm installed (npm install -g pnpm)

Installation

1
git clone https://github.com/scafati98/autonoma-bank-demo.git
2
cd autonoma-bank-demo
3
pnpm install

Running Locally

1
pnpm dev

Open your browser at http://localhost:3000.

Building for Production

1
pnpm build
2
pnpm start

Project Structure

1
.
2
├── app/                    # Next.js “app” directory (routes / pages)
3
├── components/             # Reusable UI components
4
├── hooks/                  # Custom React hooks
5
├── lib/                    # Utility modules
6
├── public/                 # Static assets
7
├── styles/                 # Global styles / Tailwind overrides
8
├── next.config.mjs         # Next.js configuration
9
├── tailwind.config.ts      # Tailwind CSS configuration
10
├── postcss.config.mjs      # PostCSS config
11
├── tsconfig.json           # TypeScript config
12
└── package.json

Contributing

Contributions are welcome! Fork the repo, make your changes, and open a PR — we’d love to see new features, UI improvements, or better Autonoma testing examples.

License

Licensed under the MIT License. See LICENSE for details.

Acknowledgments

• Built and vibe-coded proudly with v0.dev
• Powered by the Autonoma AI team
• Inspired by modern fintech UIs

Demo app for testing, showcasing, and experimenting with Autonoma AI.