DevBlog is an open-source developer blog template built on Astro 6 that combines statically generated articles with server-side-rendered dynamic routes, backed by Supabase for authentication and real-time social interactions.
What is DevBlog?
DevBlog is a full-stack technical content platform written in TypeScript 5 and styled with Tailwind CSS 4, created by Sebastián Zhunaula (devsebastian44). It takes content written for programming, cybersecurity, data science, and AI topics and serves it as a high-performance blog with static article pages and dynamic profile/activity pages. The project runs on Astro 6.1.3+ in hybrid SSR/SSG mode, uses Supabase 2.93+ as its Backend-as-a-Service for PostgreSQL storage and auth, manages the database schema with Prisma ORM, and is designed for deployment on Vercel.
Key Features
- Hybrid SSR + SSG rendering — Astro 6 statically generates article pages at build time for speed while dynamic routes like profile and activity are served via SSR.
- Full authentication system — Supabase Auth provides email registration, secure login, persistent sessions, and a personalized activity page per authenticated user.
- Guest interactions without accounts — Anonymous visitors can like, bookmark, and comment on articles, with their state stored in the browser's localStorage until they optionally register.
- Interactive article sidebar — The PostSidebar.astro component shows real-time counters for likes, comments, and bookmarks, updated client-side through the Supabase JavaScript SDK.
- Row-Level Security (RLS) — PostgreSQL policies on all interaction tables guarantee each user can only read and modify their own records directly at the database layer.
- Account deletion Danger Zone — A custom Supabase RPC function handles full transactional account removal (posts, likes, comments, bookmarks) to prevent race conditions.
- Prisma ORM schema — The prisma/schema.prisma file defines models and relations with versioned migrations and automatic TypeScript typing.
- Dark glassmorphism design — Premium futuristic UI with dark aesthetics, smooth transitions, Aldrich typography, and Tailwind CSS 4's @tailwindcss/typography plugin for Markdown rendering.
- Quality tooling — Playwright 1.59+ E2E tests, ESLint with @typescript-eslint, Prettier formatting, and type-check via tsc --noEmit are all configured.
Who is it for?
- Technical blog authors — Developers and writers covering programming, cybersecurity, data science, or AI who want a fast, SEO-friendly static blog with social features.
- Full-stack developers — Those who want to study or reuse a complete Astro + Supabase + Prisma authentication and interaction architecture with RLS security.
- Portfolio builders — Developers looking for a production-ready project to demonstrate modern SSR/SSG integration, CI/CD, and Vercel deployment in their portfolio.
What can you do with DevBlog?
- Publish technical articles: Write posts in Markdown and have them statically generated into fast-loading pages with a typographic layout.
- Engage readers with social features: Allow both registered users and anonymous visitors to like, bookmark, and comment on posts in real time.
- Implement user accounts: Let readers register with email, log in securely, and view their personal activity history on a dedicated profile page.
- Deploy to production: Connect the repository to Vercel, add Supabase environment variables, and get automatic Astro builds.
How does DevBlog work?
After cloning the repository, you run nvm use to select the Node version from .nvmrc, install dependencies with npm install, and copy .env.example to .env with your Supabase URL and anonymous key. Then apply the Prisma schema with npx prisma db push (development) or npx prisma migrate deploy (production), start the dev server on port 4321 with npm run dev, and deploy to Vercel, which auto-detects Astro.
Pricing
DevBlog is free open-source software released under the MIT license. You can use, copy, modify, merge, publish, distribute, and sublicense it freely as long as the original copyright notice is included.
FAQ
Is DevBlog free?
Yes, DevBlog is open source under the MIT license. There are no paid tiers, and you can use it for personal or commercial projects, with the only requirement being to keep the original copyright notice.
Does DevBlog require a backend?
Yes, DevBlog uses Supabase as a Backend-as-a-Service. You need to create a Supabase project, configure the public URL and anon key in a .env file, and apply the database schema using Prisma migrations.
Can visitors interact without registering?
Yes, anonymous visitors can like, bookmark, and comment on articles. These interactions are stored locally in the browser's localStorage and are not saved to the database until the user optionally creates an account.
What technologies does DevBlog use?
DevBlog uses Astro 6.1.3+ in hybrid SSR/SSG mode, TypeScript 5.9+, Tailwind CSS 4 with the typography plugin, Supabase 2.93+ for database and auth, Prisma ORM for schema management, Playwright 1.59+ for E2E tests, and Vercel for deployment.
