BeeNote is an open-source full-stack CRUD web application for language learning, built on Next.js 13's app directory and integrating ChatGPT for AI-assisted writing.
What is BeeNote?
BeeNote is a full-stack web application that demonstrates how to combine Next.js 13 with the app directory routing system, PocketBase for database and user authentication, TailwindCSS and DaisyUI for styling, Tiptap for rich text editing, AWS SES for email delivery, and the OpenAI ChatGPT API for generative writing assistance. The project provides working CRUD operations for user accounts and content entries, plus audio recording and file upload. It is designed as a learning showcase for these technologies and a starting point for building language-learning tools.
What makes BeeNote stand out?
BeeNote stands out by bundling eight commonly used open-source libraries into one working Next.js application:
- Next.js 13 app directory — Uses the beta routing system introduced in Next.js 13, showing file-based routing with the app directory for a real CRUD application.
- PocketBase backend — PocketBase serves as both the database and the authentication provider, reducing the need for a separate server and auth service.
- Tiptap rich text editor — Content entries are edited with Tiptap, a flexible and extensible rich text editor built on ProseMirror.
- TailwindCSS and DaisyUI — The interface is styled with TailwindCSS utility-first classes and pre-built DaisyUI components, including support for dark theme.
- AWS SES email integration — Email sending is handled through Amazon's Simple Email Service for notifications or account-related messages.
- ChatGPT AI writing — The OpenAI API, specifically the gpt-3.5-turbo model, is integrated to assist with writing or generating language-learning content.
- Audio recording and file uploads — Users can attach audio recordings and upload files to their language notes, expanding the types of media stored per entry.
- Typed with TypeScript — The project is written in TypeScript, giving type safety across the Next.js and React codebase.
Who should use BeeNote?
BeeNote is aimed at developers and self-hosters who want a concrete, working example of a full-stack Next.js application with a self-contained backend. It fits three groups:
- Next.js developers who want to see the app directory in action with CRUD, auth, and external API integrations.
- Language learning app builders who need a base with rich text, audio, file upload, and AI writing already wired up.
- Hobbyists exploring PocketBase who want a reference app that shows PocketBase handling both data and authentication in a real project.
What can you do with BeeNote?
- Build a vocabulary notebook: Create, edit, and organize language notes with the Tiptap rich text editor and attach audio recordings for pronunciation practice.
- Experiment with AI writing: Use the ChatGPT integration to generate example sentences, translations, or writing prompts inside the app.
- Customize the styling: Re-theme the entire UI with DaisyUI's component classes and Tailwind utility classes, including toggling dark mode.
- Deploy a self-hosted language platform: Run PocketBase on your own server and use BeeNote as the frontend for a self-managed language learning tool.
FAQ
Is BeeNote free to use?
BeeNote is an open-source project and the code is publicly available on GitHub, so it can be used and modified freely. There is no pricing or subscription for the source code itself.
Does BeeNote support OAuth2 login?
Not yet. The project's TODO list includes adding more signup options with OAuth2 providers, so currently authentication is handled through PocketBase's built-in user management.
Can I use BeeNote without AWS SES?
The source code integrates AWS SES for email sending, but you could replace or remove that service in your own deployment. The page does not specify a fallback, so you would need to adapt the email logic.
Does BeeNote have batch delete?
No. Batch delete is listed in the TODO as something to implement once PocketBase supports the functionality, so the current version only performs single-item deletes.
