In 2024, not having a portfolio website is like being the only person at a party without a smartphone β awkward and out of place! π But donβt worry, creating a professional portfolio website is easier than you think. Plus, hosting on Vercel is free, and Iβve got all the code ready for you. You can check out my portfolio at My portfolio website to see what youβll be building! So letβs get started!
Prerequisites π
Before diving into the fun stuff, letβs get the basics out of the way:
- Install VSCode: This will be your go-to code editor.
- Sign Up on GitHub: Your codeβs new home.
- Install Git: For version control.
- Basic HTML, and CSS Knowledge: You're good to go if you know how to create a basic webpage! π
Actual Implementation π»
Letβs get our hands dirty with some code!
- Create Profile Images πΌοΈ:
Choose your best photos (because first impressions matter!).
Visit pfp maker, upload your photos, and customize them. Download your stylish new profile pics.
- Set Up GitHub Repository π οΈ:
- create a new repository on GitHub.
- Clone Your GitHub Repository Locally π₯οΈ:
- Open your command prompt and run:
git clone https://github.com/YourUsername/YourRepoName.git
Replace YourUsername
and YourRepoName
with your GitHub username and repository name.
- Clone My Repository:
- In a different folder, clone my repository:
git clone https://github.com/Abhiz2411/abhijit-zende-portfolio.git
This is where all the magic happens! π©β¨
- Copy Files π:
- Copy all the files (except the .git folder) from my repository to your repository.
- Customize Your Website π¨:
Open the project in VSCode.
Replace my images with yours and update the content with your information. Itβs like putting your face on my body β creepy but effective!
- Track and Commit Your Changes π: Run these commands in the VSCode terminal:
git add .
git commit -m "Initial commit: Portfolio website"
- Push Your Changes to GitHub π: Push the code to your GitHub repository
git push origin main
- Deploy on Vercel π:
Sign up on Vercel using GitHub.
Create a new project and link it to your GitHub repository. Follow the simple steps, and voila! Your minimalistic portfolio website is live and free!
FAQ Help π‘
Cloning a GitHub Repo: Guide here
Publishing Your First Project on GitHub: Guide here
Deploying Your Website on Vercel: Detailed tutorial
Features of My Website π
- Minimalistic Design: Clean and simple, just like your morning coffee. β
- Consistent Styling: Because nobody likes a messy wardrobe. ππ
- Only HTML, CSS, and JS: No frameworks, no libraries β just pure code. π»
- Beginner-Friendly: Perfect for those just starting. π
- Smooth Animations: Like butter on toast. π§
- Great Profile Pics: Thanks to PFP Maker! πΈ
- Fast Loading: No one likes waiting in the digital world. β©
- SEO Friendly: Helps you get noticed by search engines. π
- Easily Customizable: Make it yours! π οΈ
Extra Feature: Dark Mode/Light Mode Switch π
Because who doesnβt love a good theme toggle?
Credits π
Theme Inspiration: Check out Tutorial
And there you have it! Your very own portfolio website. Remember, having a portfolio is like having a superpower in the tech world. It showcases your skills and projects, helping you stand out to potential employers or clients. So donβt be the party loner β join the crowd and build your online presence today!
Check out my portfolio at My portfolio website link. If you have any questions or need further assistance, feel free to contact me at abhijitzende75@gmail.com.
Happy coding! π
Top comments (0)