Learn how to use and build with Noted

Everything you need to get started as a user or contribute as a developer. From taking your first note to deploying your own instance.

Platform Guide

Using Noted

Noted is designed to be your all-in-one study workspace. Here is how to get the most out of it.

Getting Started

Sign up with email or OAuth (Google / GitHub). Once you are in, you land on the dashboard where all your folders and pages live. Click New Page to start writing.

Creating and Editing Notes

The editor is built on TipTap. You get rich formatting, code blocks, tables, images, embeds, and full markdown support. Every document is block-based, so you can rearrange content modularly. Use slash commands to quickly insert blocks.

AI Features

Highlight any text and hit the AI button, or use the command palette to trigger actions:

Free tier includes 10 AI requests per month. Upgrade to Pro for 500 or Team for unlimited.

Real-Time Collaboration

Click Share on any page to invite collaborators by email. They will see your cursor, you will see theirs. Changes sync instantly via WebSockets powered by Y.js CRDTs. No refresh needed.

Study Tools

Organization

Use Folders to nest pages infinitely deep. Color-code folders for quick visual scanning. Add Tags to pages for cross-cutting categories. Share individual pages or entire folders with public/private links and optional password protection.

Developer Guide

Building and Deploying Noted

Noted is open-source under the MIT license. Clone it, hack on it, self-host it.

Prerequisites

Installation

git clone https://github.com/Subham12R/Noted.git cd noted

npm install

cp .env.example .env

Environment Variables

Here are the key variables you need:

# Database
DATABASE_URL="postgresql://user:password@localhost:5432/noted"

# Auth
BETTER_AUTH_SECRET="your-secret-key"
BETTER_AUTH_URL="http://localhost:3000"

# OAuth
GOOGLE_CLIENT_ID="..."
GOOGLE_CLIENT_SECRET="..."
GITHUB_CLIENT_ID="..."
GITHUB_CLIENT_SECRET="..."

# AI
AI_PROVIDER="groq"
GROQ_API_KEY="..."
OPENAI_API_KEY="..."
ENABLE_AI_FEATURES="true"

# Redis (optional for dev)
REDIS_URL="redis://localhost:6379"

# Stripe (optional)
STRIPE_SECRET_KEY="..."
STRIPE_PUBLISHABLE_KEY="..."
STRIPE_WEBHOOK_SECRET="..."

# Storage (optional)
S3_BUCKET="..."
S3_REGION="..."
S3_ACCESS_KEY="..."
S3_SECRET_KEY="..."

Database Setup

Generate and push the schema to PostgreSQL:

npm run db:generate npm run db:push

You can also open Drizzle Studio to inspect the data:

npm run db:studio

Running the App

You need two terminal sessions:

# Terminal 1 — Next.js frontend
npm run dev

# Terminal 2 — Backend API + WebSocket server
npm run dev:backend

Then open http://localhost:3000.

Docker Deployment

For production, use the provided Docker Compose:

docker-compose -f docker-compose.prod.yml up -d

This spins up the web app, WebSocket server, PostgreSQL, and Redis.

Project Structure

noted/
├── src/app/           # Next.js App Router pages
│   ├── api/           # 34 API routes
│   ├── note/[id]/     # Note editor
│   ├── folder/[id]/   # Folder view
│   └── pricing/       # Subscription page
├── src/components/    # 152 React components
│   ├── dashboard/
│   ├── editor/        # TipTap editor
│   ├── ai/
│   ├── flashcards/
│   ├── pomodoro/
│   └── collaboration/
├── src/lib/           # Business logic
│   ├── ai/            # AI provider config
│   ├── auth.ts
│   └── subscription.ts
├── src/db/            # Drizzle ORM schema
├── backend/           # Hono + Socket.io + Y.js
│   └── src/index.ts
├── drizzle/           # Migrations
├── public/            # Static assets
└── docker-compose.yml

Available Scripts

API Overview

Key endpoints you will interact with:

Contributing

Fork the repository, create a feature branch, and open a Pull Request. All contributions are welcome — whether it is bug fixes, new AI providers, or UI improvements.

git checkout -b feature/your-feature git commit -m "Add your feature" git push origin feature/your-feature