portofolio-template — Next.js 作品集模板

SHA-256: c67d801e3183a7591add53539281e559699004d76259b8b75bbbfe1421202b8e

2026-10-14T19:09:40.633Z

<h1 align="center">Curzy</h1>
<p align="center">
  <strong>Premium Mobile Link Hub & Portfolio</strong>
</p>

<p align="center">
  <a href="https://portofolio-12.curzy.dev/"><strong>🌐 Live Demo</strong></a>
</p>

<div align="center">

[![Stars](https://img.shields.io/github/stars/Curzyori/portofolio-template?style=for-the-badge&color=teal)](https://github.com/Curzyori/portofolio-template/stargazers)
[![Forks](https://img.shields.io/github/forks/Curzyori/portofolio-template?style=for-the-badge&color=teal)](https://github.com/Curzyori/portofolio-template/network/members)
[![License](https://img.shields.io/badge/License-MIT-gold?style=for-the-badge)](LICENSE)
[![Platform](https://img.shields.io/badge/Platform-Web%20%7C%20Static-black?style=for-the-badge)](#)

</div>

<p align="center">
  <a href="#-why-curzy">Why This</a> ·
  <a href="#-key-features">Features</a> ·
  <a href="#-tech-stack">Tech Stack</a> ·
  <a href="#-quick-start">Quick Start</a>
</p>

---

## 🕒 Why Curzy?

Curzy is a premium mobile-first link hub and portfolio template for developers with a **Terminal Glass** aesthetic — inspired by products like Raycast, Linear, and Apple.

### The Problem

Free link hub services like Linktree often have limited features and lack the distinctive character developers want. On the other hand, building a full-stack portfolio from scratch requires database maintenance, complex API setup, and monthly server costs.

### The Solution

Curzy solves this: a premium mobile-first link hub that is **100% static with no backend or API required**.

- Extremely lightweight, instant page loads
- Zero maintenance cost
- Highly interactive experience like a native mobile app

---

## 🎯 Key Features

| Feature | Status | Description |
| :--- | :---: | :--- |
| **100% Mobile-First** | ✅ | Optimized for 70%+ visitors on mobile devices |
| **Terminal Glass UI** | ✅ | Premium dark theme inspired by Raycast, Linear, Apple |
| **5-Tabs Navigation** | ✅ | Home, Bisnis, Projects, Sertifikat, Contact |
| **Dynamic Content Filter** | ✅ | "All vs Fav" filter on Projects tab |
| **Consistency Index** | ✅ | Project numbers stay locked during filtering |
| **Graceful Empty State** | ✅ | Clean feedback for empty categories |
| **SEO & Accessibility** | ✅ | Static prerender, semantic HTML, complete meta tags |

---

## 🛠️ Tech Stack

| Technology | Why |
| :--------- | :-- |
| **Next.js (App Router)** | Static content prerender, < 1s load time, max SEO |
| **Tailwind CSS** | Efficient Terminal Glass theme implementation |
| **TypeScript** | Type-safe links, projects, and certificates data |

---

## 🚀 Quick Start

### Prerequisites
Make sure you have Node.js (v18+) and npm installed.

### Clone & Install

```bash
git clone https://github.com/Curzyori/portofolio-template.git
cd portofolio-template
npm install
```

### Run Development Server

```bash
npm run dev
```

Open [http://localhost:3000](http://localhost:3000) in your browser.

### Customizing Data

You **do not need to modify UI code**. Simply edit:

```
data/links.ts
```

Update the object properties with your own information — Next.js will refresh automatically.

---

## 🖼️ Preview

<table align="center">
  <tr>
    <td align="center"><b>Web App Preview</b></td>
  </tr>
  <tr>
    <td><img src="images/web.gif" width="250" alt="Curzy Portfolio Demo"/></td>
  </tr>
</table>

---

## 📄 License

This project is released under the **MIT License** — fully open source, free to use for personal and commercial purposes, see [LICENSE](LICENSE) for full text.

---

## 🔗 Connect

<p align="center">
  <a href="https://github.com/Curzyori">
    <img src="https://img.shields.io/badge/GitHub-181717?style=for-the-badge&logo=github&logoColor=white"/>
  </a>
  <a href="https://curzy.dev">
    <img src="https://img.shields.io/badge/Portfolio-58A6FF?style=for-the-badge"/>
  </a>
  <a href="https://linkedin.com/in/curzy">
    <img src="https://img.shields.io/badge/LinkedIn-0A66C2?style=for-the-badge&logo=linkedin&logoColor=white"/>
  </a>
</p>



## ☕ Support

If this project is useful, consider supporting its development!

<p align="center">
  <a href="https://donate.curzy.dev/"><strong>💝 Donate via Crypto or QRIS</strong></a>
</p>

Crypto payment details are maintained at [donate.curzy.dev](https://donate.curzy.dev/).

<sub>Built with passion as the 12th Project of the <strong>50 Projects Challenge</strong> by <strong>@curzyori</strong></sub>