Personal data is centralized in src/data/info.ts; replacing this file switches the portfolio content to your own
AstroPortfolio
astro-portfolio — Astro Portfolio Template
By uzzii-21
An Astro-based personal portfolio website template; by editing src/data/info.ts, you can replace it with your own skills, projects, and contact information.
Explore the design
Compare the page layouts and mobile experience. Open any screenshot for a closer look.
Desktop homepage1 / 3
Desktop captureTop of page
Actual screenshot captured by the server browser.
All pages & views 3
Screenshots show visual appearance; interactive behavior may differ.
Recorded 2026-10-02View source
What stands out
A quick read of the recorded project description.
Pages are organized by routes in src/pages, including the home page and projects page
Components are divided into home and general groups, including common parts such as Header and Footer
Styles are centralized in src/styles, including custom-styles.css, fonts.css, and styles.css
Static assets are uniformly placed in public/assets, with fonts and images managed in separate directories
Uses the MIT license, allowing free use, modification, commercial use, and distribution
Template Details
This is the source code for a personal portfolio website built with Astro, showcasing the developer's skills, projects, and contact information. The README explains that usage is straightforward: edit src/data/info.ts to get your own portfolio, with personal data centralized in the src/data directory.
In terms of project structure, pages are located in src/pages (such as index.astro and projects.astro), components are under src/components and divided into home and general (including Header.astro, Footer.astro, etc.), layouts are in src/layouts, styles are in src/styles (custom-styles.css, fonts.css, styles.css), and there are also src/types and src/utils. Static assets such as images are placed in public/assets, and fonts in public/assets/fonts.
The repository description states that the pages are responsive, accessible, and SEO-friendly, but the materials do not provide specific implementation details or verification results. The template uses the MIT license, allowing free use, modification, commercial use, and distribution, provided that copyright and license notices are retained; third-party assets such as images, fonts, and icons in the demo need to be checked separately for their licenses.
AstroPortfolio
Is it right for your project?
Use Cases
- Developers building a personal portfolio website to showcase skills, projects, and contact information
- Using an existing Astro project as a starting point and quickly generating your own site by replacing the data file
- A reference project for learning Astro page routing, components, and style organization
Suitable For
- Developers who want to build a personal portfolio with Astro
- Those who need a static site template where content can go live by simply editing the data file
- Learners who want to reference the Astro project directory structure and component division
Getting started & customization
Use these recorded setup notes alongside the repository instructions for your chosen version.
- 1
Install dependencies with npm install
- 2
Start the local development server with npm run dev (README notes localhost:3000)
- 3
Build the production site to ./dist/ with npm run build, and preview locally before deployment with npm run preview
- 4
Write personal data into the src/data directory, and place static assets such as images into public/assets
- 5
Third-party assets such as images, fonts, and icons in the demo need to be checked separately under their respective licenses
License & source material
Usage conditions & limitations
Free to use · keep license noticeThis entry covers the free version under the MIT license in a public repository; the free scope is the code of this version and does not imply that external services or third-party assets are free.
Must comply with when using
- Free use, modification, commercial use, and distribution of this version's code are permitted.
- 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
- 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
https://github.com/uzzii-21/astro-portfolio/blob/master/LICENSEhttps://github.com/uzzii-21/astro-portfolio/blob/master/README.mdPermission is hereby granted, free of charge
Original License Text
Compiled by DeepSeek based on repository license and README ·2026-10-02. 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 · 76 / 100
- Technologies
- Astro
- 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
- 2023-11-18
- Screenshot last checked
- 2026-10-02
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 Astro 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.
Automatically checked against source and license rules; no manual editorial review.
Inspect the recorded source material
SHA-256: 103e13354256dffd6c69de01b21e2309a4253d8701195e432ffd363dfcf32dcf
2026-10-02T16:00:20.592Z
Source file / repository# Portfolio Website - Astro Just change `src/data/info.ts` to get your personal portfolio. ## portfolio template for Developers!  ## 🚀 Project Structure Inside of your Astro project, you'll see the following folders and files: ``` / ├── public/ │ ├── assets │ │ ├── fonts | | └── images │ └── favicon.ico ├── src/ │ ├── components/ │ │ ├── home/ | | └── general/ | | ├── Header.astro | | ├── Footer.astro | | └── ... │ ├── data/ │ ├── layouts/ │ | |── Layout.astro │ | └── ... │ ├── pages/ │ | ├── peojects.astro │ | ├── index.astro │ ├── styles/ │ | |── custom-styles.css │ | |── fonts.css │ | └── styles.css │ ├── types/ │ ├── utils/ ├── package.json └── ... ``` Astro looks for `.astro` or `.md` files in the `src/pages/` directory. Each page is exposed as a route based on its file name. There's nothing special about `src/components/`, but that's where we like to put any Astro/React/Vue/Svelte/Preact components. Any static assets, like images, can be placed in the `public/assets` directory. Your personal data would be go on `src/data` directory. ## 🧞 Commands All commands are run from the root of the project, from a terminal: | Command | Action | | :--------------------- | :----------------------------------------------- | | `npm install` | Installs dependencies | | `npm run dev` | Starts local dev server at `localhost:3000` | | `npm run build` | Build your production site to `./dist/` | | `npm run preview` | Preview your build locally, before deploying | | `npm run astro ...` | Run CLI commands like `astro add`, `astro check` | | `npm run astro --help` | Get help using the Astro CLI | ## 👀 Want to learn more? Feel free to check [Astro documentation](https://docs.astro.build) or jump into Astro [Discord server](https://astro.build/chat).
Explore similar templates
Compare previews and descriptions within the same stack and category.
astro-theme-cactus
Astro Cactus is an Astro-based blog and portfolio theme that uses Markdown/MDX content collections to manage posts, notes, and tags, with frontmatter type-checked by a schema.
Astro · Portfolio
astrofy
Astrofy is a free and open-source personal portfolio website template built with Astro and TailwindCSS, with built-in blog, CV timeline, project showcase, store, and RSS feed modules.
Astro · Portfolio
astro-nano
Astro Nano is a static, minimalist portfolio and blog template built with Astro, Tailwind, and TypeScript without frontend frameworks. It includes light/dark themes, animated UI, automatic sitemap and RSS feed generation, and Markdown/MDX support with component imports.
Astro · Portfolio
astro-erudite
astro-erudite is an opinionated, unstyled static blog template built with Astro and native CSS, with no UI or CSS framework and minimal dependencies.
Astro · Portfolio
astro-sphere
Astro Sphere is a static, minimalist portfolio and blog theme maintained by markhorn-dev, built mainly with Astro, Tailwind, and TypeScript, with a small amount of SolidJS for stateful components.
Astro · Portfolio
astro-micro
Astro Micro is a framework-free blog and portfolio theme for Astro, forked from Astro Nano. It adds Pagefind search and Giscus comments while retaining type safety, sitemap, RSS, Markdown and MDX support, and TailwindCSS with system, light, and dark themes.
Astro · Portfolio