Next.jsAstroReactPortfolio

Personal-Portfolio-2.0 — Next.js Portfolio Template

By alvin-dennis

A personal developer portfolio template based on Next.js and Sanity, with content managed through an embedded Studio, under the MIT license.

Explore the design

Compare the page layouts and mobile experience. Open any screenshot for a closer look.

2 previews
Desktop homepage1 / 2
Desktop captureTop of page

Actual screenshot captured by the server browser.

All pages & views 2

Screenshots show visual appearance; interactive behavior may differ.

Recorded 2026-10-03View source

What stands out

A quick read of the recorded project description.

01

Content is managed through a Sanity Studio embedded at /manage, with hero, projects, experience, skills, testimonials, education, and site settings all updatable from the backend

02

Built with Next.js, React, TypeScript, Tailwind CSS, and Shadcn/UI, with Framer Motion for page and component animations

03

Provides Sanity-related scripts to run Studio independently, deploy Studio, and generate types from schema and queries

04

Schema definitions and GROQ queries are centralized in src/sanity/schemaTypes and src/sanity/lib/queries.ts respectively

05

The repository uses the MIT license, allowing free use, modification, commercial use, and distribution, provided the copyright and license notice are retained

Template Details

This is a personal developer portfolio website template for showcasing personal experience, skills, projects, and achievements. The pages include hero, projects, experience, skills, testimonials, education, and site settings. This content is not hardcoded; it is managed through a Sanity Studio embedded at the /manage path, so updating site content does not require code changes.

On the technical side, the project uses Next.js as the framework, React for building interactive interfaces, TypeScript for type support, Tailwind CSS and Shadcn/UI for styling and components, Framer Motion for page and component animations, icons from Lucide React and React-icons, and Bun for package management and runtime. Sanity serves as the headless CMS providing content data, with schema definitions located in src/sanity/schemaTypes and GROQ queries in src/sanity/lib/queries.ts.

Before use, you need to prepare your own Sanity project and configure NEXT_PUBLIC_SANITY_PROJECT_ID, NEXT_PUBLIC_SANITY_DATASET, and NEXT_PUBLIC_SANITY_API_VERSION in .env.local. The names, images, and content included in the repository belong to the original author; when using it as a template, you need to replace them with your own information. The code is under the MIT license, allowing free use, modification, commercial use, and distribution, but third-party assets such as demo images, fonts, and icons need to be checked separately under their respective licenses, and external services such as domains and hosting may incur costs.

Next.jsAstroReactPortfolio

Is it right for your project?

Use Cases

  • Building a personal developer portfolio website to centrally showcase projects, skills, and work experience
  • Scenarios where portfolio content needs to be continuously updated from the backend without modifying code
  • Using the combination of Next.js and a headless CMS as a foundation project for learning or secondary development
  • As a starting point for a personal brand or job-seeking showcase page after replacing the original author's information

Suitable For

  • Developers who want to build a personal portfolio with Next.js and Sanity
  • Users who accept managing content through a headless CMS rather than editing page code directly
  • Developers who need a portfolio template that can be freely modified and used commercially under the MIT license
  • Frontend users with the ability to configure environment variables and a Sanity project

Getting started & customization

Use these recorded setup notes alongside the repository instructions for your chosen version.

  1. 1

    After cloning the repository, install dependencies with bun install

  2. 2

    Create .env.local in the project root and fill in NEXT_PUBLIC_SANITY_PROJECT_ID, NEXT_PUBLIC_SANITY_DATASET, and NEXT_PUBLIC_SANITY_API_VERSION; these values can be obtained at sanity.io/manage

  3. 3

    Start with bun dev; the site runs at http://localhost:3000 and Sanity Studio is at http://localhost:3000/manage

  4. 4

    You can use bun sanity:dev, bun sanity:deploy, and bun sanity:typegen to run Studio independently, deploy Studio, and generate types respectively

  5. 5

    The names, images, and content in the template belong to the original author; before use, replace them with your own information and verify third-party asset licenses yourself

Read repository instructions

License & source material

Usage conditions & limitations

Free to use · keep license notice

This entry covers the free version in the public repository under the MIT license; the free scope is the code of this version and does not mean external services or third-party assets are free.

Must comply with when using

  • The code of this version may be used, modified, used commercially, and distributed for free.
  • When distributing copies or substantial portions of the code, retain the original author's copyright notice and the full MIT license notice.
  • The code is provided as is; warranties and limitations of liability are governed by the original license and applicable law.

Additional costs & items to verify

  • Before use, you must create your own Sanity project and configure environment variables; site content depends on this external headless CMS service, and content will not display properly without configuration.
  • You need to register a Sanity account and create a project on its platform to obtain the project ID and dataset, which is an external service dependency.
  • The names, images, and text content built into the template belong to the original author; when using it as a template, you need to replace them with your own information, and third-party asset licenses must be verified yourself.
  • Demo images, fonts, icons, and other third-party assets need to be checked under their respective licenses and cannot be judged solely by the code's MIT license.
  • External services such as domains, hosting, databases, payments, or AI may incur additional charges.
View Original Text Basis

Permission is hereby granted, free of charge

Original License Text

Create a `.env.local` file in the project root with your Sanity project details

Original README

You can find/create these at [sanity.io/manage](https://www.sanity.io/manage).

Original README

The information contained in this template, including names, images, and content, has been created entirely by me

Original README
https://github.com/alvin-dennis/Personal-Portfolio-2.0/blob/main/LICENSEhttps://github.com/alvin-dennis/Personal-Portfolio-2.0/blob/main/README.md

Compiled by DeepSeek based on repository license and README ·2026-10-03. Results only cover the materials read; dependencies, images, fonts, and subsequent term changes are subject to their respective original texts.

Project checks & description sources

Template Information

Source platforms
GitHub
Documentation and maintenance reference score
More documented · 92 / 100
Technologies
Next.js · Astro · React
Website type
Portfolio
How this score is calculated

Our heuristic uses license records (up to 30), a demo link (12), a preview (10), stars (15), recorded maintenance (15), description completeness (8), feature records (5) and classification data (5). It is not a code, security or performance test, or a Google score. A link does not establish tested functionality.

What to verify for this project

Repository update recorded
2026-09-11
Screenshot last checked
2026-10-03

A demo link is listed. Check it with your own content and viewport sizes; its presence does not confirm that forms, authentication or payments work.

The catalog identifies Next.js as the primary stack. Check the actual dependency manifest and lockfile for versions and hosting requirements. These notes use recorded metadata, not a code audit or a deployment test.

Use a selection guide →

How this description was prepared

AI-assisted description based on catalog records and repository material. Repository authors are not automatically the reviewers of this description.

Review declaration: [email protected] · 2026-10-04

Inspect the recorded source material

SHA-256: 179378734e423147e21f978f6f969acb0ea42b8d23518fa92c3e128baa2435f9

2026-10-03T13:48:33.036Z

Source file / repository
# Portfolio Website

## 👋 Welcome to my portfolio website

This platform serves as a digital showcase of my professional journey, skills, projects, and achievements. Feel free to explore my portfolio and discover the projects I've worked on. From web development and design to digital marketing and beyond, each project represents a labor of love and a testament to my commitment to excellence.

Content (hero, projects, experience, skills, testimonials, education, site settings) is managed through an embedded [Sanity](https://www.sanity.io) Studio rather than hardcoded, so the site can be updated without touching code.

## Demo

You can also check out the live demo of the portfolio website [here](https://alvinn.me).

## Technologies Utilized

- **Next.js** → All-in-one web framework for building fast, performance oriented websites.
- **React 19** → Latest React release with enhanced features for building dynamic and interactive user interfaces.
- **TypeScript** → Strongly typed JavaScript for improved developer productivity, maintainability, and code quality.
- **Sanity** → Headless CMS powering site content, embedded as a Studio at `/manage`.
- **Tailwind CSS** → Utility-first CSS framework for rapid UI development, responsive design, and modern styling.
- **Shadcn/UI** → Accessible, customizable component library built on Radix UI primitives.
- **Framer Motion** → Animation library used for page and component motion.
- **Lucide React** → Lightweight, customizable SVG icon set for modern UI design.
- **React-icons** → Unified icon library providing easy access to multiple icon packs in React.
- **Bun** → Fast JavaScript runtime and package manager for an improved development experience.

## Installation

Clone the Repo

```bash
git clone https://github.com/alvin-dennis/Personal-Portfolio-2.0.git
```

Installation of dependencies

```bash
bun install
```

### Environment Variables

Create a `.env.local` file in the project root with your Sanity project details:

```bash
NEXT_PUBLIC_SANITY_PROJECT_ID=your-project-id
NEXT_PUBLIC_SANITY_DATASET=your-dataset-id
NEXT_PUBLIC_SANITY_API_VERSION=api-verson
```

You can find/create these at [sanity.io/manage](https://www.sanity.io/manage).

Start Server

```bash
bun dev
```

The site runs at `http://localhost:3000`, and the Sanity Studio is available at `http://localhost:3000/manage`.

### Sanity Scripts

```bash
bun sanity:dev        # run Studio standalone (outside Next.js)
bun sanity:deploy      # deploy the Studio
bun sanity:typegen     # generate types from your schema/queries
```

Schema definitions live in `src/sanity/schemaTypes`, and GROQ queries live in `src/sanity/lib/queries.ts`.

> [!NOTE]
> The information contained in this template, including names, images, and content, has been created entirely by me and reflects my own work and experiences. Any resemblance to real-life people, events, or situations is purely coincidental. You are encouraged to replace this content with your own information if using it as a template.

## Contributing

Contributions are welcome! Feel free to open an issue or submit a pull request. Follow the [guidelines](https://github.com/alvin-dennis/Personal-Portfolio-2.0/blob/main/CONTRIBUTING.md) for contributing.

## Security

Found a vulnerability? See [SECURITY.md](https://github.com/alvin-dennis/Personal-Portfolio-2.0/blob/main/SECURITY.md) for how to report it privately.

Thank you for visiting, and I hope you enjoy your time here! If you have any questions or would like to collaborate, don't hesitate to reach out.

Happy browsing! ✨
Report a correction

Explore similar templates

Compare previews and descriptions within the same stack and category.

react-resume-template

react-resume-template

A personal resume website template for software developers, built with Next.js, React, and TypeScript and styled with Tailwind CSS. Site content is driven by a single data file at /src/data/data.tsx, with types in dataDef.ts and images in src/images/.

Next.js · Portfolio

nxt-lnk

nxt-lnk

nxt-lnk is a Next.js-based bio link page template that manages personal information and links via BioData.js and LinksData.js, positioned as a self-hosted alternative to Linktree. It groups links by type, supports enabling/disabling individual links, and offers hexagonal or oval avatars.

Next.js · Portfolio

sylph

sylph

Sylph is a minimal portfolio and blog template built on Next.js, supporting MDX/Markdown writing, light/dark themes, and automatic OG image generation. It includes sitemap, robots.txt, metadata, and syntax highlighting, with automatic blog timestamps.

Next.js · Portfolio

sleek-portfolio

sleek-portfolio

A modern, responsive portfolio template built with Next.js 15, TypeScript, Tailwind CSS, and Shadcn UI. It includes an MDX blog, project showcase, work experience timeline, and a contact form that receives messages via Telegram Bot.

Next.js · Portfolio

research-website-template

research-website-template

A React + Next.js template for research personal websites, aimed at PhD students and researchers. It centralizes publications, projects, and other content in src/data as arrays of objects, with optional fields automatically generating UI components.

Next.js · Portfolio

shadcn-portfolio

shadcn-portfolio

A developer portfolio template built with Next.js 15, shadcn/ui, Tailwind CSS, and Framer Motion, featuring an MDX blog, light and dark modes, responsive design, and SEO meta tags.

Next.js · Portfolio