Improved User Profile SEO with Meta Tags

[NayanUnni95]

Summary

Generate user-specific SEO-friendly content using GitHub profile data and Gen AI
Closes #96

Description

Using Generative AI and prompt engineering to create optimized, user-specific titles, descriptions, and keywords. This approach allows for dynamic generation of meta tags tailored to individual user profiles, significantly enhancing SEO and social sharing.

Motivation and Context

Enhance user profile visibility and engagement for better platform growth.
Need to implement meta titles, descriptions, and other tags for improved search rankings and compelling sharing.

How has this been tested?

To ensure proper functionality, I'll test this feature with various usernames. I'll also share the development URL on social media platforms to verify the correct implementation of Open Graph (OG) and Twitter tags.

Additional Info

Currently using additional GenAI requests to generate user SEO content (titles, descriptions, and keywords), which increases GenAI usage. This will optimize in the future by consolidating user "About" data and SEO information into a single prompt.

Screenshots (if appropriate):

Types of changes

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)

Checklist:

• My code follows the code style of this project.
• My change requires a change to the documentation.
• I have updated the documentation accordingly.

[vercel]

@NayanUnni95 is attempting to deploy a commit to the lamsta Team on Vercel.

A member of the Team first needs to authorize it.

[gemini-code-assist]

Summary of Changes

Hello @NayanUnni95, I'm Gemini Code Assist¹! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request introduces dynamic, AI-generated SEO meta tags for user profile pages. By leveraging Gen AI to create personalized titles, descriptions, and keywords based on GitHub profile data, I aim to significantly improve the search engine visibility and social sharing appearance of individual user profiles on the platform.

Highlights

• AI-Generated SEO Content: I've added functionality to generate SEO-optimized titles, descriptions, and keywords for user profiles using Gen AI (Groq/Llama 3.1).
• API Integration: The backend now fetches and includes the AI-generated SEO data when retrieving a user's profile, storing it under a new seo key.
• Frontend Metadata: The Next.js layout for user profile pages (www/app/[username]/layout.tsx) now dynamically sets the page's meta tags (title, description, keywords, Open Graph/Twitter images) using the generated SEO data from the API.
• Type Definitions: Updated the frontend types (www/types/types.ts) to include the new SEOContent type and add the seo field to the Profile type.

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point in your pull request via creating an issue comment (i.e. comment on the pull request page) using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands.

Feature	Command	Description
Code Review	/gemini review	Performs a code review for the current pull request in its current state.
Pull Request Summary	/gemini summary	Provides a summary of the current pull request in its current state.
Comment	@gemini-code-assist	Responds in comments when explicitly tagged, both in issue comments and review comments.
Help	/gemini help	Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist is currently in preview and may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments to provide feedback.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Footnotes

1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configureGemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩

[gemini-code-assist]

Code Review

This pull request introduces functionality to generate and use SEO-specific metadata (title, description, keywords) for user profiles, leveraging a GenAI service. The changes involve updates to the backend API to fetch and cache this SEO data and modifications to the frontend to use this data in <meta> tags for user profile pages.

Key feedback points include:

• Robustness in AI response handling: Adding try-except blocks for JSON parsing and checking for the existence of expected keys in the AI's response in modules/ai_generator.py.
• Frontend safety: Ensuring that accesses to nested user.seo properties in www/app/[username]/layout.tsx are safe and handle cases where seo data might be missing.
• Type correctness and clarity: Minor adjustments to type hints and docstrings for better maintainability.
• Prompt clarity: A suggestion to refine the AI system prompt to avoid potential contradictions with the user prompt regarding output format.

Overall, the feature is a valuable addition for SEO. Addressing the highlighted points will improve the reliability and maintainability of the new functionality.

[gemini-code-assist]

The type for params is Promise<{ username: string }>. In Next.js App Router's generateMetadata function, params is typically passed as a resolved object (e.g., { username: string }), not a Promise. If this is standard Next.js usage, the type should be params: { username: string }, and await params on line 10 would not be necessary (it would be const { username } = params;). Please verify if this Promise-based type is intentional due to a custom setup or if it should align with the standard Next.js pattern.

  params: { username: string };