2.3 KiB
2.3 KiB
Interactive Terminal Portfolio
A modern, interactive terminal-style portfolio website built with React and Tailwind CSS. This project provides a unique way to showcase your skills, projects, and information through a familiar command-line interface.
Features
- 🖥️ Fully functional command-line interface
- 📁 Virtual filesystem navigation
- 🎨 Beautiful and responsive design
- ⌨️ Command autocompletion with Tab
- 🖼️ Image viewing support
- 🎯 Custom commands and shortcuts
- 🌈 Modern UI with gradient backgrounds
- 🎮 Interactive ASCII art welcome screen
Available Commands
ls- List directory contents (alphabetically sorted)cd [directory]- Change directorycat [file]- Display file contentsview [image]- Display image filespwd- Print working directoryclear- Clear the terminal screenhelp- Display help informationdate- Show current date and time
Shortcuts
Tab- Autocomplete commands and pathsCtrl+L- Clear the terminal screen
Directory Structure
/home/guest/
├── about.txt # Personal introduction
├── welcome.txt # Welcome message
├── projects/ # Project showcase
├── skills/ # Technical skills
├── contact/ # Contact information
├── images/ # Image assets
└── blog/ # Blog posts
Technologies Used
- React.js
- Tailwind CSS
- JavaScript (ES6+)
- HTML5
- CSS3
Getting Started
- Clone the repository:
git clone https://github.com/yourusername/terminal-portfolio.git
- Install dependencies:
npm install
- Start the development server:
npm run dev
- Build for production:
npm run build
Customization
- Edit the filesystem structure in
src/data/filesystem.js - Modify the styling in
src/index.css - Update the terminal component in
src/components/Terminal.jsx - Add your own images to the
publicdirectory
Contributing
Contributions are welcome! Please feel free to submit a Pull Request.
License
This project is licensed under the MIT License - see the LICENSE file for details.
Acknowledgments
- Inspired by Unix/Linux terminal interfaces
- Built with modern web technologies
- Designed for developer portfolios
Made with ❤️ by [Your Name]