基于AI开发blog系统

[xyandy]

我想基于Nextjs + Github Issue API构建一个博客系统，它有以下功能：
1. 展示所有博客列表，列表每一行就是博客标题 + Labels
2. 展示某一篇博客内容 + 评论，每个Issue就是一篇博客，Issue评论就是用户评论，Issue内容就是博客内容，这里需要将MarkDown格式内容转化Html
3. 支持关键字搜索博客
4. 支持Github登录 评论

请你帮我设计一段Prompt，方便AI代码生成

Create a blog system using Next.js and GitHub Issue API with the following features:

1. Blog List Page:
   - Display a list of all blog posts
   - Each list item should show the blog title and associated labels
   - Implement pagination if there are many posts

2. Single Blog Post Page:
   - Display the full content of a selected blog post
   - Show comments for the blog post
   - Convert Markdown content to HTML for proper rendering
   - Display the author and publication date

3. Search Functionality:
   - Implement a search bar to filter blog posts by keywords
   - Search should cover both titles and content of the posts

4. GitHub Authentication:
   - Allow users to log in using their GitHub accounts
   - Implement OAuth flow for GitHub authentication

5. Commenting System:
   - Allow authenticated users to post comments on blog posts
   - Comments should be saved as GitHub Issue comments

Technical Requirements:
- Use Next.js 14 or later with App Router
- Utilize GitHub REST API or GraphQL API for fetching issues and comments
- Implement server-side rendering (SSR) for better SEO
- Use a Markdown to HTML converter (e.g., remark or marked)
- Implement proper error handling and loading states
- Ensure responsive design for mobile and desktop views
- Use TypeScript for type safety
- Implement proper caching strategies to minimize API calls to GitHub

Additional Considerations:
- Implement rate limiting to avoid hitting GitHub API limits
- Add syntax highlighting for code blocks in blog posts
- Consider implementing a simple admin interface for managing posts (optional)

Please provide the necessary code structure, main components, and API integration for this blog system. Include examples of how to fetch data from GitHub, render blog posts, and handle user authentication.

[!NOTE] Useful information that users should know, even when skimming content.

[!TIP] Helpful advice for doing things better or more easily.

[!IMPORTANT] Key information users need to know to achieve their goal.

[!WARNING] Urgent info that needs immediate user attention to avoid problems.

[!CAUTION] Advises about risks or negative outcomes of certain actions.

[xyandy]

OK

[xyandy]

感谢支持这个功能！！