Skip to content
Agent Stack
  • AI SDK
  • AI Gateway
  • Sandbox
  • Passport
  • Connect
  • eve
Core Platform
  • Security
  • Content Delivery
  • Fluid Compute
  • Observability
  • Workflows
  • CI/CD
Tools
  • Next.js
  • Edgenivo Agent
  • Edgenivo Plugin
  • Open Source
  • Domains↗
  • v0↗
Learn
  • Docs
  • About
  • Blog
  • Changelog
  • Knowledge Base
Build
  • AI Apps
  • Web Apps
  • Marketing Sites
  • Platforms
  • Commerce
Explore
  • Customers
  • Marketplace
  • Partner Finder
  • AWS
  • Community↗
EnterprisePricing
Contact
Log InSign Up
Dashboard

Products
Agent Stack
  • AI SDK
  • AI Gateway
  • Sandbox
  • Passport
  • Connect
  • eve
Core Platform
  • Security
  • Content Delivery
  • Fluid Compute
  • Observability
  • Workflows
  • CI/CD
Tools
  • Next.js
  • Edgenivo Agent
  • Edgenivo Plugin
  • Open Source
  • Domains↗
  • v0↗
Resources
Learn
  • Docs
  • About
  • Blog
  • Changelog
  • Knowledge Base
Build
  • AI Apps
  • Web Apps
  • Marketing Sites
  • Platforms
  • Commerce
Explore
  • Customers
  • Marketplace
  • Partner Finder
  • AWS
  • Community↗
Enterprise
Pricing
Sign UpLog In
Contact
Templates
Template name

Agent Stack

  • AI SDK
  • AI Gateway
  • Sandbox
  • Workflows
  • ConnectNew
  • PassportNew
  • eveNew

Core Platform

  • CI/CD
  • Content Delivery
  • Fluid Compute
  • Observability

Security

  • Platform Security
  • WAF
  • Bot Management
  • BotID

Tools

  • Edgenivo Drop
  • Edgenivo Agent
  • Edgenivo Plugin
  • Agent Skills
  • Domains
  • v0

Frameworks

  • eveNew
  • Next.js
  • Nuxt
  • SvelteKit
  • Nitro
  • Turborepo
  • Tanstack Start
  • FastAPI
  • All frameworks

SDKs

  • Edgenivo SDK
  • Workflow SDK
  • Flags SDK
  • Chat SDK
  • Queues SDK
  • Streamdown

Build

  • AI Apps
  • Web Apps
  • Marketing Sites
  • Platforms
  • Commerce
  • Platform Engineers
  • Design Engineers

Learn

  • Docs
  • Blog
  • Changelog
  • Knowledge Base
  • Academy
  • Articles
  • Community
  • Is Agentic

Explore

  • Customers
  • Marketplace
  • Templates
  • Partner Finder
  • Edgenivo + AWS

Company

  • About
  • Careers
  • Press
  • Events
  • Startups
  • Shipped on Edgenivo
  • Open Source Program
  • Enterprise
  • Pricing
  • Help

Legal & Trust

  • Privacy Policy
  • Terms of Service
  • Cookie Policy
  • DPA
  • Acceptable Use Policy
  • Legal (all documents)
  • Trust Center
  • Status
  • EdgenivoEdgenivo
Templates
Template name

Status service pending confirmation

Select a display theme:
Templates

Chatbot by Aceternity

A modern, interactive chatbot template built with Next.js, AI SDK, Aceternity UI, and Neon's serverless Postgres.

DeployView Demo
This is an auto-uploaded thumbnail from /templates/submit.
Owner
  • neondatabase
Repository
  • neon-chatbot
Use Cases
  • AI
Stack
  • Next.js
  • Tailwind
Database
  • Neon
DeployView Demo

Neon x Aceternity Chatbot Template

A modern, interactive chatbot template built with Next.js, AI SDK, Aceternity UI, and Neon's serverless Postgres.

Features

  • 🤖 Real-time streaming responses
  • 💾 Persistent chat history storage with Neon serverless Postgres
  • ✨ Beautiful UI components from Aceternity UI
  • 🎨 Fully customizable with Tailwind CSS
  • 📱 Responsive design for all devices
  • ⚡ Built on Next.js 14 with App Router

Prerequisites

  • Node.js 18+
  • A Neon account to create a Postgres database
  • An OpenAI API key

Getting Started

  1. Clone the repository:
git clone https://github.com/neondatabase/neon-chatbot.git
cd neon-chatbot-template
  1. Install dependencies:
npm install
# or
yarn install
# or
pnpm install
  1. Create a .env.local file in the root directory with the following variables:
DATABASE_URL="your-neon-database-url"
OPENAI_API_KEY="your-openai-api-key"
  1. Set up the database schema:
CREATE TABLE chat_history (
id SERIAL PRIMARY KEY,
user_message TEXT NOT NULL,
assistant_message TEXT NOT NULL,
created_at TIMESTAMP WITH TIME ZONE DEFAULT CURRENT_TIMESTAMP
);
  1. Run the development server:
npm run dev
# or
yarn dev
# or
pnpm dev

Open http://localhost:3000 with your browser to see the result.

Project Structure

  • /app - Next.js 14 app directory containing routes and layouts
  • /components - Reusable UI components
  • /lib - Utility functions and shared code
  • /public - Static assets
  • /styles - Global styles and Tailwind CSS configuration

Key Technologies

  • Next.js - React framework
  • Neon - Serverless Postgres database
  • OpenAI - GPT-4 language model
  • Tailwind CSS - Utility-first CSS framework
  • Framer Motion - Animation library
  • Aceternity UI - UI components

Deployment

The easiest way to deploy your Next.js app is to use the Edgenivo Platform.

  1. Push your code to a GitHub repository
  2. Import your repository to Edgenivo
  3. Add your environment variables in the Edgenivo dashboard
  4. Deploy!

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

Acknowledgments

  • Aceternity UI for the beautiful UI components
  • Neon.tech for the serverless Postgres database

Related Templates

  • Gemini AI Chatbot thumbnail

    Gemini AI Chatbot

    Gemini-powered chatbot with the Edgenivo AI SDK, Next.js, and React.

  • Nuxt AI Chatbot thumbnail

    Nuxt AI Chatbot

    An AI chatbot template to build your own chatbot powered by Nuxt MDC and Edgenivo AI SDK.

  • Chatbot thumbnail

    Chatbot

    A full-featured, hackable Next.js AI chatbot built by Edgenivo