L4U_Blog is a multi-user blogging platform built for developers and community members to create, share, and discover articles. Designed as a full-stack capstone project, it incorporates modern web development practices along with AI-assisted development tools and workflows.
L4U_Blog offers:
- 🧑💻 User Authentication via Supabase Auth
- 📝 Post Creation & Sharing: Users can write, publish, and read blog posts
- 💬 Comment System for community interaction
- 🌓 Dark/Light Mode Toggle for accessibility
- 🧠 AI-Assisted Development integrated throughout the stack
This platform supports both knowledge sharing and personal portfolio building, showcasing real-world full-stack engineering and AI-enhanced workflows.
- Next.js (React-based framework) for SSR and routing
- Tailwind CSS for utility-first styling and responsive UI
- Supabase (PostgreSQL)
- Authentication via Supabase Auth
- Real-time database operations
- Storage for blog content and user metadata
- Cursor and Træ (TRAE): AI-assisted IDEs for writing code via instructions
- Gemini CLI: Google's AI-powered CLI for generating code and querying the database via natural language
- CodeRabbit: Automated AI code reviews in GitHub PRs
- Jest and React Testing Library for unit and integration testing
- Vercel or Supabase Hosting for frontend/backend deployment
- GitHub for version control (Repo: favour-22/L4U_Blog)
L4U_Blog leverages AI tools across the development lifecycle:
-
AI-Powered Prompts used to generate components, routes, and functions
-
Example prompt:
“Generate a Next.js API route
/api/posts/createthat validates inputs and saves the post to Supabase.” -
Gemini CLI used for tasks like:
- “Create Supabase table schema for blog posts”
- “Generate login logic using Supabase Auth”
-
Context7 ensures prompts use the latest API docs and conventions
-
AI generates test cases for:
- Authentication workflows
- Blog post creation/validation
- Edge/error cases
-
Example prompt:
“Write Jest tests for loginUser including valid, invalid, and empty credential cases.”
-
Inline documentation and README sections generated using AI
-
Example:
“Explain the purpose of this function/module”
-
AI tools keep in-code comments and README updated as development progresses
-
Context7 used to pull accurate docs per library/package
-
Model Context Protocol (MCP) enables AI to query live Supabase schema
-
Example usage:
- “List all columns in
userstable” - “Generate SQL to fetch posts by a user ID”
- “List all columns in
-
For REST or GraphQL APIs, OpenAPI specs and schemas are provided to the AI to generate client functions
- Cursor and Træ provide smart suggestions, code completions, and AI-generated scaffolding
- Developers can describe functionality, and the IDE will generate corresponding code
-
CodeRabbit reviews each PR with:
- Line-by-line analysis
- Suggestions for fixes or improvements
- Summaries of commits and changes
-
Reduces review time and improves code quality with AI precision
- Every PR triggers CodeRabbit analysis
- Gemini CLI and AI tools suggest commit messages based on the diff
- Clean, AI-reviewed code pushed with well-written PR summaries
Generate a Next.js API route handler for /api/createPost that accepts title and content, validates them, and inserts a new row into the Supabase posts table.
Write a Jest test suite for the loginUser function, covering successful login, incorrect password, and missing fields errors. Mock Supabase Auth calls.
By including specific function names, fields, and framework context, we ensure highly relevant AI-generated code and tests.
- Support for image uploads in blog posts
- Rich text editor integration (e.g., TipTap or Quill)
- Enhanced search & tagging system
- User profiles & follower system
- AI-generated content recommendations
🔗 GitHub Repo: https://github.com/favour-22/L4U_Blog
If you find L4U_Blog useful or inspiring, consider sponsoring me on GitHub to help sustain future open-source work. Your support makes a big difference!
This project is open source and available under the MIT License.