Achebestan™

A modern web fiction reading platform — where stories live.

There are no happy endings here 🙃

Visit Achebestan →

---

📱 Previews

Home Page	Story View
Story Actions	Stories Grid

---

📖 Overview

Achebestan is a full-stack web fiction platform designed for an immersive, distraction-free reading experience. It is optimized for serialized fiction, and chapter-based progression.

By leveraging the latest Next.js features, the platform eliminates the need for a separate backend, running everything—from authentication to server actions—within a single unified application deployed to the edge.

---

✨ Features

• Serialized Reader – Clean UI focused entirely on the reading experience.
• Advanced Caching – Instant content invalidation using Tanstack with Next.js cacheTag and revalidateTag.
• Type-Safe Actions – End-to-end type safety for all mutations via next-safe-action.
• Offline Support – Progressive Web App (PWA) capabilities powered by Serwist 9.x.
• Secure Auth – Reliable session management with better-auth.
• Modern UI – Beautifully crafted with Mantine v8, supporting both Light and Dark modes.

---

🛠 Tech Stack

Layer	Technology
Framework	Next.js 16 (App Router)
Language	TypeScript 5
Styling	Mantine v8
Database	PostgreSQL (Neon)
ORM	Drizzle ORM
Auth	better-auth
Service Worker	Serwist 9.x
State Management	Tanstack v5
Deployment	Vercel

---

📂 Project Structure

achebestan/
├── app/                # Next.js App Router (pages, layouts, loading states)
│   ├── (auth)/         # Authentication routes
│   └── (achebestan)/       # Fiction reader & content routes
    └── sw.ts               # Serwist service worker entry
├── components/         # Reusable UI components
├── lib/
│   ├── drizzle/             # Drizzle schema and migrations
│   ├── auth/           # better-auth configuration
│   └── actions/        # next-safe-action server actions
├── public/             # Static assets and PWA manifest

---

🚀 Getting Started

Prerequisites

• Node.js >= 20
• npm (recommended) or pnpm
• PostgreSQL database (Neon recommended)

1. Clone the repository

git clone [https://github.com/CrusaderGoT/achebestan.git](https://github.com/CrusaderGoT/achebestan.git)
cd achebestan

2. Install dependencies

npm install

3. Configure environment variables

Create a .env.local file in the root directory:

BETTER_AUTH_SECRET=your-better-auth-secret
LOCAL_DATABASE_URL=postgresql://your-local-db

VAPID_SUBJECT="https://achebestan.vercel.app"
NEXT_PUBLIC_VAPID_PUBLIC_KEY=your-vapid-public-key
VAPID_PRIVATE_KEY=your-vapid-private-key

ADMIN_IDS=["user_id"]
CODE=0000

4. Database Setup

npm run upgrade

5. Run the development server

npm run dev

Open http://localhost:3000 to see the result.

---

⚠️ Known Limitations

• Experimental Caching: The "use cache" directive requires strict Suspense boundary placement. Missing boundaries will result in static prerender failures during build.
• PWA Performance: Service worker caching behavior is experimental and may require tuning based on your specific deployment environment.
• Migration Hashes: To prevent schema mismatches, always ensure you run drizzle-kit generate before applying migrations or npm run upgrade.

---

Built and written by CrusaderGoT

"Imagination supplements reality."