mcpField
D
developer-portfolio

developer-portfolio

github.com/rebyteai-templateDesign & UI1796 installsUpdated 19w ago
Repository

About developer-portfolio

A customizable Next.js portfolio template for developers, with animated sections, a contact form, and dev.to blog integration. Content is maintained in separate data files.

Key features

  1. 01Responsive Next.js portfolio
  2. 02Lottie animations
  3. 03Email and Telegram contact form
  4. 04dev.to blog integration
  5. 05Editable profile, projects, and skills

Use cases

  1. 01Publishing a developer portfolio
  2. 02Presenting work history and projects
  3. 03Receiving inquiries through email or Telegram

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/rebyteai-template/rebyte-skills --skill developer-portfolio

After installing, type/developer-portfolioin Claude Code to confirm it loaded.

Details

From the project README

Developer Portfolio Pro

A modern, responsive portfolio with Next.js, Lottie animations, contact form with Email/Telegram, and dev.to blog integration.

Tech Stack

  • Framework: Next.js 16 with App Router
  • React: React 19
  • Styling: Tailwind CSS 4
  • Animation: Lottie
  • Package Manager: pnpm
  • Output: .next directory
  • Dev Port: 3000

Setup

1. Clone the Template
git clone --depth 1 https://github.com/Eng0AI/developer-portfolio-template.git .

If the directory is not empty:

git clone --depth 1 https://github.com/Eng0AI/developer-portfolio-template.git _temp_template
mv _temp_template/* _temp_template/.* . 2>/dev/null || true
rm -rf _temp_template
2. Remove Git History (Optional)
rm -rf .git
git init
3. Install Dependencies
pnpm install

Build

pnpm build

Deploy

Vercel (Recommended)
vercel pull --yes -t $VERCEL_TOKEN
vercel build --prod -t $VERCEL_TOKEN
vercel deploy --prebuilt --prod --yes -t $VERCEL_TOKEN
Netlify
netlify deploy --prod

Customization

Edit content in utils/data/:

  • personal-data.js - Name, bio, social links
  • experience.js - Work history
  • projects-data.js - Portfolio projects
  • skills.js - Technical skills
  • educations.js - Education background

Environment Variables

VariableRequiredDescription
NEXT_PUBLIC_GTMNoGoogle Tag Manager ID
NEXT_PUBLIC_APP_URLYesYour portfolio's public URL
TELEGRAM_BOT_TOKENNoTelegram bot token for contact form
TELEGRAM_CHAT_IDNoTelegram chat ID
GMAIL_PASSKEYNoGmail app password
EMAIL_ADDRESSNoGmail address for contact form

Development

pnpm dev

Opens at http://localhost:3000

Requires Node.js 18.17+ (Node.js 20+ recommended)

Comments

Markdown supported