Nextjs-Supabase-Blog
Introduction
The Blogging application is a multi-user, full-stack Next.js app with Supabase support. Built with Next.js App Router, Supabase Auth and Supabase Database, Supabase Storage.
💻 Frontend
https://github.com/BTC415/Nextjs-Supabase-Blog/assets/25026241/c0488b1b-ff48-4871-849d-806f09c39322
🧰 Backend
https://github.com/BTC415/Nextjs-Supabase-Blog/assets/25026241/29c35c5f-ad67-4f5b-9943-0fd0d94448b8
📚 Tech Stacks
- App Router,
- Server Actions
- Server and Client Components
- Data Fetching, Insertion using Supabase-JS-Client
- API Routes and Middlewares
- Cookie based Authentication using Supabase Auth
- CMS using Supabase Database
- Metadata files
- Open Graph Image Generation using Vercel/Og
- Image Upload using Uppy and Supabase Storage
- Styled using Tailwind CSS
- UI Components using HeadlessUI, Radix-UI, Shadcn-UI
- WYSIWYG editor using Novel
- Loading, Error, NotFound, Empty pages
- Sending emails using NodeMailer and React Email, Gmail
- Forms using React-Hook-Forms
- Toasts using React-Hot-Toast
- Validations using Zod
- Icons using HeroIcons & Lucide-Icon
- Newsletter using ConvertKit
- Drawer using Vaul
- Written in TypeScript
⌨️ Code Quality
📈 Miscellaneous
⚙️ Getting Started
Requirements
To run this app locally you need
- Node.js (Version: >=18.x)
- Node Package Manager NPM - included in Node.js
- PostgreSQL (local or remote)
Developer Quickstart
Want to get up and running quickly? Follow these steps:
-
Clone the repository it to your local device.
git clone https://github.com/BTC415/Nextjs-Supabase-Blog.git -
Set up your Supabase Database and Auth wit with Social Logins
-
Set up your ConverKit
-
Set up your
.envfile using the recommendations in the.env.examplefile. -
Run
npm installationin the root directorynpm installation --legacy-peer-deps -
Run
npm run devin the root directory -
Want it even faster? Just use
npm run d
That's it! You should now be able to access the app at http://localhost:3000
Admin dashboard will also be available on http://localhost:300/editor/posts