skills.rest
Eng0AI
Eng0AIOFFICIAL
Explore all skills by this author →
GitHub

dillion-portfolio

Build a minimalist developer portfolio with Next.js 14, MDX, and Framer Motion.

15|5|Updated Dec 5, 2025
Search Tags:#portfolio#nextjs#projects#tailwind#blog
One-click install
npx skills add https://github.com/Eng0AI/eng0-template-skills --skill dillion-portfolio
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: dillion-portfolio
Source: https://github.com/Eng0AI/eng0-template-skills/tree/main/dillion-portfolio
Command: npx skills add https://github.com/Eng0AI/eng0-template-skills --skill dillion-portfolio

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill delivers a minimalist developer portfolio with blog, work timeline, and project showcase to help developers present their work efficiently.

Core Features & Use Cases

  • MDX for blogging: Blog content with MDX.
  • Timeline & Projects: Work history and portfolio display.
  • Next.js 14: Modern front-end stack.

Quick Start

Clone, install, and run:

  • git clone --depth 1 https://github.com/Eng0AI/portfolio-template.git .
  • pnpm install
  • pnpm build
  • pnpm dev

Frequently Asked Questions about dillion-portfolio

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I build a developer portfolio with Next.js and MDX blogging?▼

Build a developer portfolio using Next.js 14 with MDX-based blog content by cloning the template, running pnpm install, then pnpm dev. This combines React 18, Framer Motion animations, and Tailwind CSS styling into a minimalist site featuring projects, work timeline, and blog posts.

Can I use Tailwind CSS and shadcn/ui with Next.js 14 for portfolio styling?▼

Yes. This portfolio uses Tailwind CSS and shadcn/ui components with Next.js 14 for consistent, modern styling. The combination provides pre-built accessible components integrated with Tailwind utility classes for rapid design implementation.

What's the best way to add animations to a Next.js portfolio site?▼

Framer Motion integrates seamlessly with Next.js 14 to add smooth animations throughout your portfolio. This Skill uses Framer Motion for interactive elements on the blog, timeline, and project showcase pages without additional configuration.

How do I deploy a Next.js portfolio to Vercel or Netlify?▼

Deploy a Next.js 14 portfolio to Vercel or Netlify directly from your repository. Both platforms offer native Next.js support with zero-config builds, automatic optimization, and one-click deployment from git push.

Do I need to write blog content in Markdown or MDX for a Next.js site?▼

MDX allows you to write blog content with embedded React components, combining Markdown readability with interactive elements. This portfolio uses MDX for blog posts, giving you richer content options than plain Markdown while maintaining simple file-based storage.

What package manager should I use with a modern Next.js portfolio?▼

pnpm is the package manager for this portfolio, offering faster installations and strict dependency resolution compared to npm. Install dependencies with pnpm install, build with pnpm build, and run locally with pnpm dev.

Related Skills

Explore More Design & Creative Skills→
UiPathUiPath
18

apollo-install

Clone the apollo-ui repository, install dependencies, build packages, and start Storybook on port 6006.

Official
Intermediate
mqzkimmqzkim

domain-setup

Automate custom domain acquisition and Vercel deployment integration.

Community
Advanced
DITEKmaxDITEKmax

animated-component-libraries

Provide pre-built animated React components for Tailwind CSS and Framer Motion.

Community
Intermediate
jackspacejackspace
16

sveltia-cms

Integrate Sveltia CMS into static-site projects across eight frameworks.

Community
Advanced