Building your Portfolio in 2025
Step by Step Instructions to Build your Portfolio
Introduction
Whether you are a school going student or a freelancer, having a personal portfolio is extremely important and starting to being a standard in the developer community.
For those who don’t have enough time to create a portfolio from scratch, I have a SOLUTION for all of you!
Over the past few weeks, I have been working on creating an easy to use Portfolio Template for all developers out there. In this blog, I would give you step by step instructions on how to customize it.
https://github.com/Zemerik/Portfolio-Template
Key Features
Customizable Sections
Responsive Design
Social Media Integration
SEO Optimization
Easy Setup
Personal Branding
How to Install?
- Make a copy of the Repository on your machine through git:
git clone https://github.com/Zemerik/Portfolio-Template && cd Portfolio-Template
Customize the Portfolio to your choice. If you are stuck, refer to table and instructions below:
- Sections
| Section | File | Lines |
| Navbar | src/routes/Head.svelte | 30 - 47 |
| Home | src/routes/+page.svelte | 27-52 |
| About Me | src/routes/+page.svelte | 54 - 99 |
| Projects | src/routes/Work.svelte | 3 - 28 |
| Contact Me | src/routes/+page.svelte | 107 - 114 |
| Experiences | src/routes/Experience.svelte | 27-52 |
| Footer | src/routes/Footer.svelte | 52 - 75 |
| SEO | src/routes/+page.svelte & src/routes/hire/+page.svelte | 25 & 6 |
- Spotify Status
Join the Lanyard Discord Server,
Head over to
src/routes/spotify.tsand locate line 62.Remove 1018816958587748383 and paste YOUR DISCORD ACCOUNT ID after
/users/.
Thanks to Lanyard for making this possible!
- Now that you customized the Portfolio with your details, let’s run this locally on our internet to see the output:
npm i pnpm --force
pnpm i
pnpm run dev
Screenshots
