The all-in-one starter kit
for building multi-user, full-stack blogging applications.
Introduction · Demo · Guide · Contributing
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.
![Cover](https://private-user-images.githubusercontent.com/25026241/272384992-d263479c-853f-40ed-aed4-58c5cbb8b14c.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTg5MzIxMzQsIm5iZiI6MTcxODkzMTgzNCwicGF0aCI6Ii8yNTAyNjI0MS8yNzIzODQ5OTItZDI2MzQ3OWMtODUzZi00MGVkLWFlZDQtNThjNWNiYjhiMTRjLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA2MjElMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNjIxVDAxMDM1NFomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTgzYzMxN2I4MGY5ZDk4ZDg5YzA1ZjE1YjU0ZmQzODNhY2JiN2VkODc3MTc1MWExNmRkYzFkNTk5MzJlMGExM2ImWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.9uaFam-xprgU9NEBU2RfCq4CHXP1zfbK2SFxlnDFOlY)
frontend.mp4
![Cover](https://private-user-images.githubusercontent.com/25026241/272385218-c5cd3077-b955-43fd-b6ea-2f3b5f9297c9.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTg5MzIxMzQsIm5iZiI6MTcxODkzMTgzNCwicGF0aCI6Ii8yNTAyNjI0MS8yNzIzODUyMTgtYzVjZDMwNzctYjk1NS00M2ZkLWI2ZWEtMmYzYjVmOTI5N2M5LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA2MjElMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNjIxVDAxMDM1NFomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWJjYmVlYWU4MDMxMWJkZTk4OTE1MjVkNjRjMTAyZjBkNjNiMGQ4YTI5MjczYWFmNGQyZWRkOTE5ZmIyOTgxMzkmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.DvTlNW9Anqxs9OemKMxGoEPQcHKvxNIQOCJaPRIberA)
backend.mp4
Database schema & dummy data: here
![Screenshot 2023-06-10 at 10 00 18 PM](https://private-user-images.githubusercontent.com/25026241/264497517-729e2d22-2467-4d5b-9c6c-e6a5ea58c717.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTg5MzIxMzQsIm5iZiI6MTcxODkzMTgzNCwicGF0aCI6Ii8yNTAyNjI0MS8yNjQ0OTc1MTctNzI5ZTJkMjItMjQ2Ny00ZDViLTljNmMtZTZhNWVhNThjNzE3LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA2MjElMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNjIxVDAxMDM1NFomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTZlMjMxODQ4Y2NkNzA0NmJmMTQ3MzY3N2RmMDYzN2JkNjQ1ZWI2ZWQ0YTU5ZjRlOTI2ODIxYzdhN2ZiMTliNGEmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.0Te51LC9_z3H0DwCZK-Jmn1S34Xe5hOu6iDlLjZOh9w)
![Screenshot 2023-06-10 at 10 00 18 PM](https://private-user-images.githubusercontent.com/25026241/266735708-2a4f693b-5c0d-4647-8444-291e1f635ee7.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTg5MzIxMzQsIm5iZiI6MTcxODkzMTgzNCwicGF0aCI6Ii8yNTAyNjI0MS8yNjY3MzU3MDgtMmE0ZjY5M2ItNWMwZC00NjQ3LTg0NDQtMjkxZTFmNjM1ZWU3LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA2MjElMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNjIxVDAxMDM1NFomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWEwOTg4OWQyZjU4YTI3MWRjMzA0ODkyZThjNTFhNDI5MmI3YWFkMjhmMDcxY2I0NzMzMTk2ZjBkOWQwMmMwMjkmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.rJRSAo5DbJd03P8w3ztg-L4gcg2JaDiUta2_Zy3z2uQ)
- 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
To run this app locally you need
- Node.js (Version: >=18.x)
- Node Package Manager NPM - included in Node.js
- PostgreSQL (local or remote)
Want to get up and running quickly? Follow these steps:
-
Clone the repository it to your local device.
git clone https://github.com/timtbdev/Next.js-Blog-App.git
-
Set up your Supabase Database and Auth wit with Social Logins
-
Set up your ConverKit
-
Set up your
.env
file using the recommendations in the.env.example
file. -
Run
npm installation
in the root directorynpm installation --legacy-peer-deps
-
Run
npm run dev
in 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
- Start a discussion with a question, piece of feedback, or idea you want to share with me.
- Open an issue if you believe you've encountered a bug with the starter kit.
- Tim (@timtbdev)
Licensed under the MIT license.