Add Deploy on Hanzo badge to template pages + README

- TemplatePageClient: hoist repoUrl to a single derived const, reuse it in
  openGitHubRepo and a new Deploy on Hanzo badge linking to
  hanzo.app/new?template=<repoUrl>. Badges all templates via the one component.
- README: replace Deploy on Vercel boilerplate with Deploy on Hanzo badge.
This commit is contained in:
hanzo-dev
2026-07-04 13:22:27 -07:00
parent 43c689503a
commit 68d6a124d0
2 changed files with 17 additions and 4 deletions
+3 -3
View File
@@ -31,8 +31,8 @@ To learn more about Next.js, take a look at the following resources:
You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome!
## Deploy on Vercel
## Deploy on Hanzo
The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
[![Deploy on Hanzo](https://hanzo.app/deploy-badge.svg)](https://hanzo.app/new?template=https://github.com/hanzoai/gallery)
Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details.
One click provisions this app on Hanzo Cloud; every template in the gallery carries the same badge on its page.
+14 -1
View File
@@ -19,6 +19,10 @@ export function TemplatePageClient({ variants, prevTemplate, nextTemplate, curre
const router = useRouter();
const [selectedVariant, setSelectedVariant] = useState<Template>(variants[0]);
// Canonical repo URL for the selected variant (single source of truth).
const repoUrl = `https://github.com/hanzo-apps/template-${selectedVariant.slug}`;
const deployUrl = `https://hanzo.app/new?template=${encodeURIComponent(repoUrl)}`;
// Navigate to random template
function goToRandomTemplate() {
const currentSlug = variants[0].slug;
@@ -31,7 +35,6 @@ export function TemplatePageClient({ variants, prevTemplate, nextTemplate, curre
// Open GitHub repository
function openGitHubRepo() {
const repoUrl = `https://github.com/hanzo-apps/template-${selectedVariant.slug}`;
window.open(repoUrl, '_blank');
}
@@ -113,6 +116,16 @@ export function TemplatePageClient({ variants, prevTemplate, nextTemplate, curre
>
🚀 Deploy
</button>
<a
href={deployUrl}
target="_blank"
rel="noopener noreferrer"
title="Deploy on Hanzo"
className="inline-flex items-center whitespace-nowrap"
>
{/* eslint-disable-next-line @next/next/no-img-element */}
<img src="https://hanzo.app/deploy-badge.svg" alt="Deploy on Hanzo" className="h-9" />
</a>
<button
onClick={() => {
navigator.clipboard.writeText(selectedVariant.path);