scribbly

Scribbly

An open source Journal Web App

About this project

Scribbly is a web application that provides a platform for users to create and manage their digital journal. With Scribbly, users can easily jot down their thoughts, experiences, and ideas, and organize them in a personal and customizable journal.

• Digital Journaling: Users can create and store their journal entries online, eliminating the need for physical notebooks or papers.
• User-Friendly Interface: Scribbly offers a clean and intuitive user interface, powered by Radix UI and Shadcn/UI components, making it easy for users to navigate and interact with their journal.
• Secure and Private: Scribbly prioritizes user data security and privacy, ensuring that journal entries are kept confidential and protected.
• Subscription Plan: Scribbly offers a monthly subscription plan that provides users with additional features and benefits.
• Reminder Feature: The reminder feature is a valuable addition to Scribbly. By sending reminder emails to users who have activated this option every day at 9 pm, you help users stay consistent with their journaling habit and make it a part of their daily routine.
• Mood and Tags: Add a mood and comma-separated tags to each entry so journal cards can be scanned and organized by context.
• Autosave: Entry title, content, mood, and tags are saved automatically after a short pause while editing. Manual saving remains available.

Features

• Next.js /app dir,
• Routing, Layouts, Nested Layouts and Layout Groups
• Data Fetching, Caching and Mutation using TanStack Query
• Route handlers
• Metadata files
• Server and Client Components
• API Routes and Middleware
• Authentication using Better Auth
• Block-Style editor with Editor.js
• ORM using Drizzle ORM
• PostgreSQL database
• Creating and sending emails with React Email and Resend
• UI Components built using Radix UI and shadcn/ui
• Subscriptions using Stripe
• Styled using Tailwind CSS
• Analytics with PostHog
• Error Handling in Sentry
• Validations using Zod
• Written in TypeScript

Running Locally

1. Install dependencies using pnpm:

pnpm install

2. Copy .env.example to .env.local and update the variables.

cp .env.example .env.local

Required local services and credentials include:

• PostgreSQL connection string in DATABASE_URL
• Better Auth secret in BETTER_AUTH_SECRET
• UploadThing token for editor images
• Stripe credentials for subscriptions
• Resend credentials for reminder emails

Apply database migrations before starting the app:

pnpm db:migrate

For Vercel deployments, set the project Root Directory to . (the repository root), not src. The Next.js app uses src/ as its source directory, and setting Vercel’s root to src causes middleware/proxy paths to be resolved as src/src/....

3. Start the development server:

pnpm dev

Star History

License

Licensed under the MIT license.