Skip to content

Feature: Implement blog detail page #18

@amaydixit11

Description

@amaydixit11

Implement blog detail page

This is a sub-issue of #15

Overview

Create or update the BlogDetail.jsx component to render individual blog posts from Markdown files with proper formatting and navigation.

Tasks

  • Update BlogDetail.jsx to fetch and display a single blog post using the slug from URL parameters
  • Implement Markdown rendering with appropriate styling for different elements (headings, lists, code blocks, etc.)
  • Add metadata section displaying author, date, read time, and tags
  • Include author information with optional GitHub profile link
  • Create navigation controls to return to the blog listing
  • Add social sharing functionality (optional)
  • Implement related posts section based on tags (optional)
  • Add syntax highlighting for code blocks

Technical Details

  • Use the getBlogBySlug utility from Issue Feature: Set up Markdown file structure and parser #16
  • Implement responsive design for the blog content
  • Ensure proper rendering of embedded images and other media
  • Use semantic HTML for better accessibility and SEO
  • Add proper metadata for search engines

Definition of Done

  • Blog detail page correctly renders Markdown content with appropriate styling
  • Metadata is clearly displayed at the top of the post
  • Navigation controls work properly
  • Page is responsive across different devices
  • Code blocks render with syntax highlighting

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