Build Creator Public Profile Page

[aji70]

Task: Build Creator Public Profile Page

Overview

Each creator needs a public profile fans can visit before subscribing. Build /creators/[handle] with profile header, bio, subscriber count, and subscribe CTA.

---

Goals

• Dynamic route: /creators/[handle]
• Profile header: banner, avatar, handle, displayName, bio, category badge
• Subscribe button (logged-in fan) / Login prompt (guest)
• Posts section placeholder ("Posts coming soon" or mock list)
• 404 state for unknown handle
• Fetch from API when available; fallback to mock data map

---

Deliverables

• app/creators/[handle]/page.tsx
• components/creator/ProfileHeader.tsx, SubscribeButton.tsx
• lib/api/creators.ts stub + mock fallback
• SEO metadata: generateMetadata with creator displayName

---

Acceptance Criteria

• Valid handle renders profile; invalid shows 404 page
• Subscribe button disabled for own profile (if current user is creator)
• Guest sees login link instead of subscribe action
• Page responsive on mobile
• No layout shift on image load (aspect-ratio placeholders)

[jaynomyaro]

Hi! I’m a full-stack developer with a strong blockchain background. I’d love to handle this issue and can deliver a clean, reliable solution. Kindly assign it to me.

[Menjay7]

Hi! I came across this issue and would love to work on it. I have experience with similar tasks and I'm confident I can investigate, implement a clean solution, and thoroughly test it before submitting a PR. If the issue is still open, I would appreciate it if you could assign it to me. Thank you!

[cristianFleita]

Hey there! I'd love to grab this issue. I’ve been a web developer for over two years now.

To get this done, I'll set up the dynamic route and generateMetadata for SEO, alongside the responsive profile header and a placeholder for posts. I'll build out the conditional subscribe button to properly handle guests, fans, and the creator's own view, plus an API stub with mock data that triggers a clean 404 for invalid handles. Finally, I'll make sure everything is fully responsive and lock down the image loading with CSS aspect ratios to guarantee zero layout shift.Hello! Im an

[grantfox-oss]

🦊 GrantFox — @cristianFleita has been assigned to this issue as part of the Official Campaign campaign!

Next steps:

1. Open a Pull Request referencing this issue (e.g., Closes #19)
2. Your PR will be reviewed by the MyFanss maintainers

Good luck! Track your progress on GrantFox.

[grantfox-oss]

🎉 This issue has been marked as completed on GrantFox as part of the Official Campaign campaign!

@cristianFleita's PR #36 was approved and merged by @aji70.

🏆 @cristianFleita: You earned 35 FoxPoints for this contribution! Your current tier: Explorer (83 total points). Track your full progress on GrantFox.

👏 Great work, @cristianFleita! Keep contributing to MyFanss.