Skip to content

feat: Add tags page with post count display #3

@p-iknow

Description

@p-iknow

Feature Description

Create a tags page that displays all blog post tags with their respective post counts, similar to: https://p-iknow.netlify.app/categories/

Requirements

  • Create /tags/ page for both languages (/en/tags/, /ko/tags/)
  • Display total number of tags
  • List all tags with post count in parentheses
  • Sort tags by post count (descending) or alphabetically
  • Make tags clickable to filter posts by tag

Implementation Details

  • Extract tags from all blog posts (frontmatter)
  • Count posts per tag for each language separately
  • Create responsive layout with Tailwind CSS
  • Add TypeScript types for tag data structure
  • Implement tag filtering functionality

Technical Tasks

  • Create tags.astro page or [...slug].astro for tags
  • Build tag collection logic in Astro
  • Style tags list with hover effects (Tailwind)
  • Add click handlers for tag filtering
  • Ensure i18n support (separate tag counts per language)

UI/UX Requirements

  • Clean, readable list layout
  • Show "There are X tags" summary
  • Consistent styling with blog theme
  • Responsive design for mobile/desktop
  • Hover effects and visual feedback

Acceptance Criteria

  • Tags page displays all tags with accurate post counts
  • Clicking a tag filters and shows related posts
  • Works correctly for both English and Korean content
  • Responsive and accessible design
  • Fast loading and good performance

Reference

Similar layout to: https://p-iknow.netlify.app/categories/ (but using "tags" terminology)

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions