A responsive, realtime chat message component built with React, Supabase, and Zustand. It supports optimistic UI updates, smooth auto-scrolling, and animated scroll-down controls.
- ⚡ Realtime Supabase sync (Insert, Update, Delete)
- 🌐 Optimistic updates for smoother user experience
- 🔽 Auto scroll to latest messages
- 🛆 Modular components and hooks
- 🧼 Clean layout with TailwindCSS styling
- Clone the repository:
git clone https://github.com/yourusername/realtime-chat-ui.git
cd realtime-chat-ui- Install dependencies:
npm install- Add your Supabase project credentials in
.env.local:
NEXT_PUBLIC_SUPABASE_URL=your-supabase-url
NEXT_PUBLIC_SUPABASE_ANON_KEY=your-anon-key- Run the app:
npm run devMIT © Ashley Ken Comandao