A modern blogging platform designed specifically for the tech community. Built for developers, by developers.

TechDiary is a feature-rich blogging platform that empowers developers and tech enthusiasts to share knowledge, document their journey, and build meaningful connections within the tech community. With support for multiple languages, intuitive writing tools, and powerful engagement features, TechDiary creates the perfect environment for technical content creation and discovery.

• Rich Markdown editor with Markdoc parsing, live preview, and auto-save
• Drag-and-drop image upload with cropping (Cloudflare R2)
• Series support for organizing related articles
• Draft management with periodic autosave
• SEO with meta tags and structured data

• Code snippets with multiple files, browsing, and sharing (/gists)

• Bengali and English UI (dictionary for Bengali; English uses keys as fallback)
• Localized formatting for dates and numbers where applicable
• Language preference persisted via cookie and client state

• Full-text search powered by Algolia
• Filtering by tags, authors, and dates
• Fast, typo-tolerant queries

• Emoji reactions (Love, Fire, Wow, Haha, Cry, Unicorn)
• Threaded comments
• Bookmarks and following authors
• In-app notifications with background processing (Inngest)
• Realtime updates over the Pusher protocol; use Pusher or self-host Soketi (open-source, drop-in compatible) for selective UI refresh

• WorkOS AuthKit as the primary sign-in path
• GitHub OAuth available as a legacy alternative
• Secure sessions stored in PostgreSQL with HTTP-only cookies

• Dark/light theme
• Responsive layout
• Web app manifest and service worker registration for installable / app-like behavior

• Next.js 16 — App Router, React Server Components, Turbopack in dev (next dev --turbo)
• React 19
• TypeScript
• Tailwind CSS 4
• shadcn/ui — Radix-based components

• Next.js Server Actions — primary server API surface
• SQLKit — lightweight query builder for most database access
• Drizzle ORM — schema and migrations only (db:generate / db:push)
• PostgreSQL — primary database

• Algolia — search index and queries
• Cloudflare R2 — S3-compatible uploads (presigned URLs)
• Inngest — scheduled jobs (e.g. article cleanup) and notification queueing
• Pusher-compatible WebSockets — managed Pusher or self-hosted Soketi (same wire protocol and client libraries; point PUSHER_* / NEXT_PUBLIC_PUSHER_* at your Soketi host)

• Jotai — client UI state
• TanStack Query — server state and cache invalidation
• React Hook Form + Zod — forms and validation

• Bun — scripts and package management (Node-compatible)
• ESLint — eslint-config-next
• Prettier — formatting

• Bun (recommended) or Node.js 22+ (aligned with dev dependencies)
• PostgreSQL 14+
• Algolia application
• WorkOS account (AuthKit) for primary login, and/or GitHub OAuth app for legacy flow
• Cloudflare R2 for uploads (see env below)

Create a .env.local in the project root. Required variables are validated in src/env.ts at runtime; WorkOS is used by AuthKit alongside those (see CLAUDE.md).

# Database
DATABASE_URL="postgresql://username:password@localhost:5432/techdiary"

# WorkOS (primary auth — AuthKit)
WORKOS_API_KEY=""
WORKOS_CLIENT_ID=""
WORKOS_COOKIE_PASSWORD=""
NEXT_PUBLIC_WORKOS_REDIRECT_URI="http://localhost:3000/api/auth/wos/callback"

# GitHub OAuth (legacy)
GITHUB_CLIENT_ID=""
GITHUB_CLIENT_SECRET=""
GITHUB_CALLBACK_URL="http://localhost:3000/api/auth/github/callback"

# Unsplash (required by env schema — used for integrations)
UNSPLASH_API_KEY=""

# Cloudflare R2 (S3-compatible — names match src/env.ts)
S3_ENDPOINT=""
S3_REGION="auto"
S3_BUCKET=""
S3_ACCESS_KEY_ID=""
S3_ACCESS_SECRET=""

# Algolia
ALGOLIA_APP_ID=""
ALGOLIA_ADMIN_API_KEY=""
NEXT_PUBLIC_ALGOLIA_APP_ID=""
NEXT_PUBLIC_ALGOLIA_SEARCH_API_KEY=""

# Inngest (optional in schema — omit or leave empty for local-only)
INNGEST_EVENT_KEY=""
INNGEST_SIGNING_KEY=""

# Realtime: Pusher SaaS or self-hosted Soketi (drop-in Pusher replacement — same env names)
PUSHER_WS_HOST=""
PUSHER_APP_ID=""
PUSHER_APP_KEY=""
PUSHER_APP_SECRET=""
NEXT_PUBLIC_PUSHER_APP_KEY=""
NEXT_PUBLIC_PUSHER_WS_HOST=""

1. Clone the repository

   git clone https://github.com/techdiary-dev/techdiary.dev.git
   cd techdiary.dev

2. Install dependencies

   bun install

3. Database

   bun run db:generate   # generate migrations from schema when you change Drizzle tables
   bun run db:push       # apply schema to your database

4. Development server

   bun run dev

5. Open http://localhost:3000

├── src/
│   ├── app/                      # Next.js App Router
│   │   ├── (home)/               # Homepage and feed
│   │   ├── (dashboard-editor)/   # Editor-related dashboard routes
│   │   ├── dashboard/            # Dashboard layout
│   │   ├── gists/                # Gists (list, create, view)
│   │   ├── [username]/           # Profiles and article pages
│   │   ├── api/                  # API routes (auth, storage, etc.)
│   │   └── sitemaps/             # Dynamic sitemaps
│   ├── backend/
│   │   ├── models/               # Domain types and action contracts
│   │   ├── persistence/          # Drizzle schemas, SQLKit repositories, PG client
│   │   └── services/             # Server actions, inputs (Zod), integrations
│   ├── components/               # UI and feature components
│   ├── hooks/
│   ├── i18n/
│   ├── lib/
│   ├── store/                    # Jotai atoms
│   └── styles/
├── docs/                         # Internal docs (components, hooks, PRD)
├── public/
└── migrations/                   # Generated SQL migrations

• Server actions return a consistent ActionResponse<T> union; TanStack Query calls actions directly from the client where appropriate.
• Caching uses Next.js Cache Components / Partial Prerendering; user-specific data stays dynamic (cookies, session).
• Article soft-delete uses delete_scheduled_at; cleanup runs on an Inngest schedule.

• Component docs
• Hooks docs
• PRD
• Agent / contributor reference: CLAUDE.md (commands, env vars, auth flow, caching rules)

• Runtime: Node-compatible host for Next.js (e.g. Vercel) or your platform of choice.
• Data: Managed PostgreSQL; Algolia for search.
• Auth: Set WorkOS production redirect URI and cookie secret; align NEXT_PUBLIC_WORKOS_REDIRECT_URI with your domain.
• Storage: R2 credentials for production uploads.
• Inngest: Configure event and signing keys for production workers.

1. Fork the repository and create a branch for your change.
2. Follow existing TypeScript, ESLint, and formatting conventions.
3. There is no automated test suite in this repo; use bun run play to exercise backend code when needed.
4. Open a pull request with a clear description.

For deeper conventions (actions, repositories, i18n), see CLAUDE.md.

MIT

Next.js, shadcn/ui, Algolia, WorkOS, and the open-source ecosystem this project builds on.

• Site: techdiary.dev
• Community: Discord
• Issues: GitHub
• Email: [email protected]