A terminal-style portfolio website that loads personal data from a GitHub Gist, providing a clean separation between the UI template and your content.
- The UI is a simple static website that mimics a terminal interface
- Your personal data (projects, skills, etc.) lives in a GitHub Gist
- The site loads your data from the Gist at runtime
- Update your Gist to change your portfolio content
-
Fork this repository:
git clone https://github.com/nirabo/nirabo.github.io.git cd nirabo.github.io
-
Create your configuration:
- Copy the content of
config.template.js
- Create a new GitHub Gist
- Paste and modify the configuration with your information
- Make sure to select "JSON" as the file type
- Save the Gist and copy its "Raw" URL
- Copy the content of
-
Update configuration:
- Edit
config.js
to point to your Gist URL
- Edit
-
Deploy:
- Rename your repository to
yourusername.github.io
- Push to GitHub
- Your site will be available at
https://yourusername.github.io
- Rename your repository to
The terminal supports these commands:
help
: List all commandsabout
: Display personal informationprojects
: List all projectsproject [name]
: Show details of a specific projectcontact
: Display contact informationskills
: List technical skillsclear
: Clear the terminalls
: List available sections
Your Gist should follow this structure:
{
"about": {
"name": "Your Name",
"role": "Your Role",
"bio": "Your Bio",
"skills": ["Skill 1", "Skill 2"]
},
"contact": {
"email": "[email protected]",
"github": "github.com/yourusername"
},
"projects": [
{
"name": "Project Name",
"description": "Project Description",
"technologies": ["Tech1", "Tech2"],
"period": "2023-2024"
}
]
}
Since the project uses ES modules, you'll need to serve it through a local server:
# Using Python 3
python -m http.server
# Or using Node.js
npx http-server
Then open http://localhost:8000
in your browser.
Modify style.css
to customize the terminal's appearance:
- Colors
- Font family
- Terminal dimensions
- Prompt style
MIT License - Feel free to use this template for your own portfolio!