Hanno Blog

Introduction · Demo · Setup · One-click Deploy · Tech Stack + Features · Author

Introduction

A blog template (by Neon) that is fully customizable from a (single file), integrated with GitHub Actions for automating blog search indexing (powered by Neon's pgrag), Resend to ensure high rate of email delivery, and Neon as the scalable serverless Postgres.

Demo

Untitled.mp4

Setup

Serverless Postgres (Neon)

1. Sign up or log in to your account on Neon.
2. Create a new database (or select an existing one).
3. Navigate to the database settings to find your connection string, which will be your DATABASE_URL.
4. Go to your GitHub repository.
5. Click on Settings in the repository menu.
6. In the left sidebar, click on Secrets and variables and then Actions.
7. Click on the New repository secret button.
8. Add a new secret with the name DATABASE_URL and paste your database URL as the value.

Resend

1. Sign up or log in to your account on Resend.
2. Navigate to the API settings to find your API Key, which will be your DATABASE_URL.

One-click Deploy

You can deploy this template to Vercel/Netlify/Render with the buttons below:

Tech Stack + Features

Frameworks

• Next.js – React framework for building performant apps with the best developer experience.

Platforms

(Postgres) Database

• Neon – A serverless database platform that provides instant scalability and high performance for your applications, allowing you to focus on building without worrying about infrastructure.

Email

• Resend – A platform for sending emails and managing email communications, providing a simple API for integrating email functionality into your applications.

Cron job

• GitHub Actions - A web-based platform for hosting and managing Git repositories.

Deployment

• Vercel – Easily preview & deploy changes with git.
• Netlify – A platform that simplifies the deployment process and provides continuous integration for your projects.
• Render – A cloud platform that offers instant deployment and automatic scaling for web applications.

UI

• Tailwind CSS – Utility-first CSS framework for rapid UI development.

Code Quality

• TypeScript – Static type checker for end-to-end typesafety.
• Prettier – Opinionated code formatter for consistent code style.

Author

• Rishi Raj Jain (@rishi_raj_jain_)