An interactive terminal-style portfolio website that simulates a real command-line interface. Built with vanilla HTML, CSS, and JavaScript.
- Interactive Terminal Interface: Realistic command-line experience
- AI-Style Responses: Animated sudo command responses with AI personality
- Command History: Navigate through previous commands with arrow keys
- Auto-completion: Tab key for command suggestions
- File System Simulation: Browse through virtual files and directories
- Responsive Design: Works on desktop and mobile devices
- Theme Support: Multiple color themes (dark, light, solarized)
- Real-time Weather: Simulated weather information
- System Information: neofetch-style system display
Visit the live demo: Terminal Portfolio
- HTML5: Structure and semantic markup
- CSS3: Styling, animations, and responsive design
- JavaScript (ES6+): Interactive functionality and command processing
- JetBrains Mono: Terminal-style font
- GitHub Pages: Hosting
about
- Display personal informationskills
- Show technical skills with progress barsprojects
- List featured projectseducation
- Display educational backgroundcontact
- Show contact information
help
- Show available commandsclear
- Clear terminal screenls
- List directory contentscat [file]
- Display file contentspwd
- Print working directorycd [dir]
- Change directorywhoami
- Display current userdate
- Show current date and timeneofetch
- Display system informationtree
- Show directory treehistory
- Show command historyecho [text]
- Echo text to terminal
sudo [command]
- Try admin commands (with AI responses!)theme [name]
- Change color themerepo
- View source codeweather
- Check current weather
The sudo
command features animated responses that simulate an AI system:
- Multiple random response messages
- Special easter eggs for different commands
- Animated security protocols
- AI personality responses
- Virtual file system with realistic structure
- Browse through projects and documents
cat
command to read file contents- Directory navigation with
cd
andls
The terminal supports multiple color themes:
- Dark (default) - Classic terminal look
- Light - Bright theme for daytime use
- Solarized - Eye-friendly color scheme
terminal-portfolio/
├── index.html # Main HTML file
├── README.md # This file
└── LICENSE # GPL-3.0 License
- A modern web browser (Chrome, Firefox, Safari, Edge)
- No additional dependencies required
- Clone the repository:
git clone https://github.com/isotjs/terminal-portfolio.git
cd terminal-portfolio
- Open
index.html
in your web browser:
# On macOS/Linux
open index.html
# On Windows
start index.html
Or simply double-click the index.html
file.
To modify the portfolio:
- Edit
index.html
to update content - Customize the CSS styles in the
<style>
section - Modify JavaScript functions in the
<script>
section - Test changes by refreshing the browser
- Add the command to the
commands
object in the JavaScript - Create the corresponding function
- Add the command to the help menu
Example:
this.commands = {
// ... existing commands
mycommand: this.myCommand.bind(this)
};
myCommand(args) {
this.addOutput(`<span class="info">My custom command!</span>`);
}
Edit the following functions in the JavaScript:
showAbout()
- Personal informationshowSkills()
- Technical skillsshowProjects()
- Project portfolioshowEducation()
- Educational backgroundshowContact()
- Contact information
Update the fileSystem
object to change the virtual file structure:
this.fileSystem = {
'~': {
type: 'directory',
contents: {
'myfile.txt': { type: 'file', content: 'File content here' },
'mydir': { type: 'directory', contents: {} }
}
}
};
Contributions are welcome! Please feel free to submit a Pull Request.
- Fork the repository
- Create your feature branch (
git checkout -b feature/AmazingFeature
) - Commit your changes (
git commit -m 'Add some AmazingFeature'
) - Push to the branch (
git push origin feature/AmazingFeature
) - Open a Pull Request
This project is licensed under the GNU General Public License v3.0 - see the LICENSE file for details.
- Inspired by terminal interfaces and command-line tools
- Font: JetBrains Mono
- Icons: Unicode emojis and symbols
- Design: Modern terminal aesthetic
- ✅ Core functionality complete
- ✅ Responsive design implemented
- ✅ AI-style interactions added
- ✅ File system simulation working
- ✅ Multiple themes available
- 🔄 Continuous improvements
⭐ If you find this project useful, please give it a star :)