web

OnChat Frontend

The web client for OnChat, a decentralized messaging platform on Base.

Tech Stack

• Framework: Next.js 16 (App Router)
• Web3: Wagmi, Viem, and Reown AppKit
• Styling: Tailwind CSS 4

Getting Started

Prerequisites

• Node.js
• npm

Installation

1. Install dependencies:

   npm install

2. Set up environment variables in .env.local:

   NEXT_PUBLIC_REOWN_PROJECT_ID=your_reown_project_id

Development

npm run dev

Build

npm run build

Structure

• src/app/: App router pages and layouts.
• src/components/: UI components (chat, modals, rewards).
• src/hooks/: Chat logic (useChat) and profile fetching.
• src/context/: Blockchain event and state providers.
• src/helpers/: Contract interactions and utilities.
• src/configs/: Wagmi/Viem configuration and ABIs.