Welcome to the most gloriously minimal portfolio website known to mankind (or at least to your GitHub followers). Built with Eleventy, this portfolio is so minimalist it makes Marie Kondo look like a hoarder.
"Because nothing says 'hire me' like a clean codebase and a deployment that doesn't crash." — Some Developer, Probably
- Setup - Yes, you actually have to set things up
- Usage - How to use this, in case clicking buttons is confusing
- Project Structure - For those who enjoy file trees more than actual trees
- Customization - Make it yours (but probably don't make it worse)
- Deployment - How to share your brilliance with the world
- Netlify Functions - Magic serverless stuff for the modern developer who's too cool for servers
-
Clone the repository (Because copying someone else's work is the foundation of all great software):
git clone https://github.com/udaysinh-git/minimal-portfolio.git cd minimal-portfolio # Enter the void
-
Install dependencies (Prepare for your computer to download half the internet):
npm install # Go make coffee, this might take a while
-
Configure environment variables (The secrets that make your app work, but you'll forget in 3 days):
Create a
.env
file in the root directory:GITHUB_TOKEN=your_github_personal_access_token # Don't share this, or do, I'm a README not a cop
-
Development Mode (For when you want to break things locally first):
npx eleventy --serve # Magic happens at http://localhost:8080
-
Build for Production (For when you're finally ready to show the world):
npx eleventy # Crosses fingers automatically
-
Content Management for the Technically Challenged:
- Add new pages by creating markdown files in
src
(it's basically like using Word, if Word were actually good) - Write blog posts in
src/posts
(perfect for those 3 AM thoughts that absolutely need to be published) - Update your GitHub flexes by... well, actually doing things on GitHub
- Add new pages by creating markdown files in
minimal-portfolio/
├── _site/ # Where the magic happens (auto-generated)
├── src/ # Source files (where you actually do work)
│ ├── _includes/ # Templates (for those who hate repeating themselves)
│ ├── posts/ # Blog posts (where your hot takes live)
│ ├── styles/ # CSS (make it pretty or don't, we won't judge)
│ ├── achievements.md # Humble brags
│ ├── blog.md # More humble brags but longer
│ ├── github.md # Proof you actually code sometimes
│ ├── index.md # The homepage nobody reads
│ └── resume.md # The formal version of your achievements.md
├── netlify/ # Netlify magic
│ └── functions/ # Serverless functions (for when you're too hipster for servers)
├── .eleventy.js # Configuration (don't touch unless you know what you're doing, which you don't)
└── package.json # The list of stuff you're borrowing from other developers
- Content: Edit the markdown files in
src
. It's like a diary, but public and judged by potential employers. - Styles: Modify CSS files in
src/styles/
if you think you have better taste (narrator: they didn't) - Layouts: Adjust templates in
src/_includes/
if you're feeling particularly brave or destructive
- Connect your repo to Netlify (it's like Instagram for code)
- Set these magic words:
- Build command:
npx eleventy
- Publish directory:
_site
- Environment variable:
GITHUB_TOKEN
(your personal GitHub token)
- Build command:
- Click deploy and pray to the CI/CD gods
-
Build the site:
npx eleventy # Transforms your markdown ramblings into HTML
-
Push to gh-pages:
git subtree push --prefix _site origin gh-pages # Voodoo command that somehow works
This portfolio uses Netlify functions to fetch your GitHub data, because hardcoding your repository information would be so 2010.
Available functions:
github-profile.js
- Shows off your follower countgithub-pinned-repos.js
- Displays the projects you're least embarrassed aboutgithub-latest-repos.js
- Reveals how recently you've actually codedgithub-contributions.js
- Proves you occasionally commit (to code, at least)github-language-stats.js
- Exposes how much JavaScript you actually write vs. pretend not to
For local development:
-
Create a
.env
file (yes, we mentioned this earlier, but if you're reading documentation sequentially, you're doing it wrong):GITHUB_TOKEN=your_github_personal_access_token
-
Start the local dev server:
npm run start # Opens localhost and your pathway to fame
Q: Will this portfolio get me hired?
A: Depends on if you have actual skills to back it up. No amount of fancy CSS can hide an empty commit history.
Q: Is this actually minimal?
A: By the standards of developers who think adding a seventh JavaScript framework is "optimization," yes.
Q: Can I remove the sarcastic comments?
A: You could, but then how would people know you're a developer?
Built with ☕ and existential dread by Udaysinh Sapate
Remember: The best portfolio is one that's actually deployed. The second best is one that's actually updated.