Portable Portfolio screenshot

Portable Portfolio

Author Avatar Theme by Eldoraboo
Updated: 2 Apr 2023
111 Stars

Portfolio Template built with React.js and Chakra UI

Categories

Overview:

The heroPortfolio is a portfolio website built using React.js and Chakra UI. It provides a quick and easy way to create and customize your own portfolio website using markdown files. With its mobile-responsive design and editable content, it allows users to showcase their work experiences and projects effectively.

Features:

  • Document your work experiences: Easily edit and update your work experience using the Experience.md file.
  • Showcase your best projects: Display your projects and items in an organized format using the Projects.md file.
  • Include your smaller projects: Add smaller projects or items to your portfolio using the OtherProjects.md file.
  • Mobile-responsive design: The website is designed to be responsive and adaptable to different screen sizes.
  • Customizable color theme: Choose from 10 different colors provided by Chakra UI to customize your website’s color scheme.
  • Customize the design: Modify the theme.js file to customize the design of your website according to your preferences.
  • Easy installation and deployment: The website can be developed locally using the provided commands and deployed on platforms like Netlify.

Installation:

To get started with the development of the heroPortfolio, follow these steps:

  1. Clone the repository or download the source code.
  2. Open the terminal and navigate to the project directory.
  3. Run the following command to install the dependencies:
yarn install
  1. Start the development server:
yarn start
  1. The website should now be available at http://localhost:3000.

To edit the site name, go to the public/index.html file and change the <title> tag.

To edit the content on your website, refer to the markdown files located in the public/content folder. Update the Experience.md file to edit your work experience, the Projects.md file to edit your projects, and the OtherProjects.md file to edit other projects or items.

To customize the color theme, modify the color variable in the App.js file located in the src folder.

To further customize the design of your website, edit the theme.js file located in the src folder. Refer to the Chakra UI documentation for more information on how to customize the theme.

Summary:

The heroPortfolio is a React.js-based portfolio website template that makes it easy for users to create and customize their own portfolio websites. It offers features such as customizable color themes, mobile responsiveness, and easy content editing through markdown files. With its straightforward installation and deployment process, it provides an efficient solution for creating a professional portfolio presence online.