Skip to content

Title: [FE] Implement README Generator UI & Markdown Previewer #15

@naheel0

Description

@naheel0

Description
The backend API route (/api/generate) and GitHub integration are complete and tested. We now need a frontend interface to allow users to input a GitHub URL and view the generated README.

Tasks
[ ] URL Input Component: Create a search bar that validates GitHub URLs before submission.

[ ] Loading States: Implement a "Generating..." state (spinner or progress bar) while waiting for the Gemini API response.

[ ] Markdown Renderer: Integrate a library like react-markdown to render the raw Markdown string as formatted HTML (GitHub style).

[ ] Copy to Clipboard: Add a button to quickly copy the generated Markdown.

[ ] Error Handling: Display user-friendly error messages (e.g., "Invalid URL", "Rate limit reached").

Technical Notes
Use Tailwind CSS for styling to match the modern look of the project.

Use Lucide-react for icons (GitHub icon, Copy icon, etc.).

The frontend should call the POST /api/generate endpoint.

Proposed UI Mockup

Metadata

Metadata

Assignees

No one assigned

    Labels

    area: frontendChanges specifically for the UI/Tailwind components.good first issueGood for newcomersrefactorCleaning up existing code without changing functionality.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions