More Premium Hugo Themes Premium Nextjs Themes

Seng Portfolio

A configurable portfolio template allowing you to display your skills, education and projects. Made using React and TypeScript.

Seng Portfolio

A configurable portfolio template allowing you to display your skills, education and projects. Made using React and TypeScript.

Author Avatar Theme by harveyd
Github Stars Github Stars: 15
Last Commit Last Commit: Apr 19, 2020 -
First Commit Created: Jun 19, 2023 -
Seng Portfolio screenshot

Overview:

The Software Engineer Portfolio Template is a customizable template that allows software engineers to create their own portfolio websites to showcase their experience, education, projects, and skills. It was created by Harvey Delaney as an improvement over an existing template he found on Reddit. The new template is built using React, Typescript, and Sass, and offers modern features and design elements.

Features:

  • Uses Create React App, Typescript, and Sass for a modern and efficient development experience.
  • Lightweight and fast-loading, without reliance on external CSS frameworks like Bootstrap.
  • Utilizes Flexbox for easy layout customization.
  • Offers easy customization through Sass variables and a centralized data portfolio location.
  • SEO optimized using react-snap for improved visibility in search engines.
  • Includes FontAwesome4 and DevIcon for easy integration of icons into the portfolio.

Installation:

To get started, follow these steps:

  1. Fork the project repository on GitHub.
  2. Clone the freshly forked repository to your local machine.
  3. Run npm i to install the necessary dependencies.
  4. Run npm start to start the local development server.
  5. Navigate to localhost:3000 in your browser to view the portfolio.

To customize the template to your needs, make changes to the portfolio-data.service.tsx file located in src/components/services/. Refer to the Create React App documentation or the provided Troubleshooting section if you encounter any issues.

You can also modify colors by changing the values in variables.scss, and adjust the font family and sizes in App.scss. For the Landing page, you can change the image by replacing the landing.jpg file in src/assets/images/, and update the name/title in the userDetails section of the PortfolioDataService file. Similarly, you can modify the profile picture and title in the About component, and add or edit entries in the Experience section.

Summary:

The Software Engineer Portfolio Template is a modern and customizable solution for software engineers looking to create their own portfolio websites. It offers an improved design and features compared to existing templates, and is built using React, Typescript, and Sass. With its lightweight and efficient implementation, easy customization options, and SEO optimization, the template provides a user-friendly experience for showcasing skills, experience, and projects.