Blog layout

[nirnejak]

Pull Request

Summary

Blog: new on home, 3 featured on list page

Type of Change

• Bug fix (non-breaking change that fixes an issue)
• New feature (non-breaking change that adds functionality)
• Breaking change (fix or feature that causes existing functionality to change)
• Documentation update
• Refactoring/code cleanup
• Content update (blog posts, tools data, etc.)

Changes Made

Testing

• Local development tested
• Build passes (npm run build)
• No TypeScript errors
• No linting errors
• Manual testing completed

Database Changes (if applicable)

• Database migration included
• Migration tested locally
• Rollback plan documented

Content Changes (if applicable)

• Tool data updated in src/lib/toolData.json
• Blog post follows content guidelines
• Images optimized and properly sized
• SEO metadata updated

UI/UX Changes (if applicable)

• Responsive design tested
• Accessibility considerations addressed
• Dark mode compatibility verified
• Loading states implemented

Checklist

• Code follows project style guidelines
• Self-review completed
• Documentation updated if needed
• No new console warnings or errors
• Performance impact considered

Screenshots/Demo

Related Issues

Additional Notes

Summary by CodeRabbit

• New Features

  • Redesigned blog post cards with improved visual layout including post metadata
  • Featured blog posts section added to the blog page

• Updates

  • Blog display now prioritizes recent posts instead of featured posts
  • Updated post status indicators for better content organization

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Review	Updated (UTC)
devtoolsacademy	Ready	Preview, Comment	Jan 20, 2026 2:36pm

[coderabbitai]

Walkthrough

This PR adds developer documentation (AGENTS.md), updates blog entry metadata flags, introduces a reusable BlogCard component with a featured posts grid section, and modifies FeaturedPosts to display recent posts instead of featured posts.

Changes

Cohort / File(s)	Summary
Documentation AGENTS.md	New 411-line developer guide covering tech stack, build/test commands, code style, component patterns, Tailwind/CVA styling, naming conventions, error handling, form validation with Zod, database/API patterns, performance/accessibility practices, Git workflow, and project structure.
Blog Data src/app/blog/data.ts	Updated blog entry metadata: toggled isFeatured and isNew flags on multiple entries to reflect current content status.
Blog Page Components src/app/blog/page.tsx	Added new internal BlogCard component with support for image, category, title, excerpt, author, read time, and "NEW" badge. Integrated featured posts grid section at top of BlogPage with conditional right border styling based on card index.
Featured Posts Component src/components/FeaturedPosts.tsx	Changed rendering source from featured posts (featuredPosts.slice(0, 3)) to recent posts (allBlogs.slice(0, 3)). Updated section heading from "Featured Posts" to "Recent Posts" and subtext accordingly.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Possibly related PRs

• Blog Layout #164 — Both PRs add AGENTS.md documentation and update blog layout/component structure (BlogCard, featured/recent posts rendering).
• feat: implement SEO improvements #138 — Both PRs modify src/app/blog/data.ts isFeatured flags and alter src/components/FeaturedPosts.tsx logic.
• Eloqdoc vs Mongodb Articles #158 — Both PRs update src/app/blog/data.ts entries with changes to blog metadata and rendering configuration.

Suggested reviewers

• tyaga001

🚥 Pre-merge checks | ❌ 3

❌ Failed checks (2 warnings, 1 inconclusive)

Check name	Status	Explanation	Resolution
Description check	⚠️ Warning	The description is substantially incomplete, with most required 'Changes Made' details missing and several UI/UX sections unchecked despite layout modifications being the core change.	Expand 'Changes Made' with specific details about the featured blog grid, BlogCard component, and page updates. Check relevant UI/UX checkboxes and provide concrete details about responsive and accessibility testing.
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.
Title check	❓ Inconclusive	The title 'Blog layout' is vague and generic, using non-descriptive phrasing that doesn't convey specific information about the changeset beyond a broad category.	Consider a more specific title such as 'Add featured blog grid and update blog page layout' to better communicate the primary changes.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing touches

• 📝 Generate docstrings

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}