Astro Themes & Templates Logo Astro Themes & Templates
Astro Portfolio screenshot

Astro Portfolio

Author Avatar Theme by Uzzii 21
Updated: 18 Nov 2023
122 Stars

This repo contains the source code for a personal portfolio website built with Astro, a framework for building fast and modern websites with your favorite frontend tools. The website showcases the developer's skills, projects, and contact information. The website is responsive, accessible, and SE...

Github Live Preview

Categories

Tailwind Portfolio Templates & themes

Overview:

The Portfolio Website - Astro is a template designed for developers to create their own personal portfolio websites. By simply changing the src/data/info.ts file, developers can customize the portfolio to suit their needs. The project boasts a clean and professional design, making it ideal for showcasing projects and skills.

Features:

  • Customizable Portfolio: Easily personalize the portfolio by editing the src/data/info.ts file.
  • Project Structure: Clearly organized folders and files make it easy to navigate and manage the project.
  • Route-Based Pages: Pages are automatically created based on file names in the src/pages/ directory.
  • Component Usage: Utilize Astro/React/Vue/Svelte/Preact components conveniently stored in src/components/.
  • Static Asset Management: Store images and other static assets in the public/assets directory.
  • User Data Management: Manage personal data in the src/data directory.
  • Convenient Commands: Various commands available for installation, development, building, previewing, and more.
  • Documentation and Support: Access Astro documentation or join the Astro Discord server for assistance.

Installation:

  1. To begin, navigate to the root directory of your project in the terminal.
  2. Install dependencies by running the command:
    npm install
  3. Start the local development server at localhost:3000 with:
    npm run dev
  4. Build your production site to ./dist/ using:
    npm run build
  5. Preview your build locally before deployment by running:
    npm run preview
  6. Utilize Astro CLI commands such as astro add or astro check with:
    npm run astro ...
  7. For help on using the Astro CLI, refer to:
    npm run astro --help

Summary:

The Portfolio Website - Astro template offers developers a convenient solution for creating personalized portfolio websites. With a simple structure, easy customization options, and helpful commands, developers can efficiently showcase their skills and projects. Additionally, access to documentation and support channels adds to the overall usability of this template.