Skip to content

feat: Add tags page with post count display #3

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

    Fields

    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions