A unique, interactive terminal-based portfolio website built with Next.js and xterm.js. Experience my portfolio through a fully functional Linux-like terminal interface.

Visit: ankan.in

• Authentic Terminal Feel: Full xterm.js integration with smooth scrolling, cursor blinking, and proper key handling
• Tab Autocomplete: Press Tab to autocomplete commands or see available options
• Command History: Use ↑ and ↓ arrow keys to navigate through command history
• Keyboard Shortcuts: Ctrl+L to clear screen, Ctrl+C to cancel

Try running: sudo, rm -rf, vim, nano, curl, and more!

• Framework: Next.js 15.3.4 with App Router
• Terminal: xterm.js 6.0 with FitAddon and WebLinksAddon
• Language: TypeScript 5.0
• Styling: Tailwind CSS 4.0
• Deployment: Cloudflare Workers via OpenNext
• Analytics: Vercel Analytics

Portfolio/
├── frontend/
│   ├── app/
│   │   ├── components/
│   │   │   └── Terminal/
│   │   │       └── TerminalPortfolio.tsx  # Main terminal component
│   │   ├── globals.css                     # Global styles
│   │   ├── layout.tsx                      # Root layout
│   │   ├── page.tsx                        # Home page
│   │   ├── not-found.tsx                   # 404 page
│   │   ├── robots.ts                       # SEO robots
│   │   └── sitemap.ts                      # SEO sitemap
│   ├── public/
│   │   ├── patterns/                       # Background patterns
│   │   └── social/                         # Social icons
│   ├── package.json
│   ├── next.config.ts
│   ├── tsconfig.json
│   └── wrangler.toml                       # Cloudflare config
├── config/
│   └── ankan.conf                          # Nginx configuration
├── LICENSE
└── README.md

• Node.js 18.x or higher
• npm, yarn, or pnpm

1. Clone the repository

   git clone https://github.com/AnkanSaha/Portfolio.git
   cd Portfolio/frontend

2. Install dependencies

   npm install

3. Run development server

   npm run dev

4. Open in browser Navigate to http://localhost:3000

# Login to Cloudflare
npm run login:cf

# Build for Cloudflare
npm run build:cf

# Deploy
npm run deploy:cf

npm run build
npm run start

Edit the portfolioData object in frontend/app/components/Terminal/TerminalPortfolio.tsx:

const portfolioData = {
  name: "Your Name",
  title: "Your Title",
  email: "your@email.com",
  // ... add your information
};

Modify the theme in the Terminal initialization:

theme: {
  background: '#0a0e27',      // Terminal background
  foreground: '#e0e0e0',      // Text color
  cursor: '#00ff00',          // Cursor color
  // ... customize colors
}

Add new commands to the commands object:

const commands = {
  mycommand: () => {
    writeLine('\r\n\x1b[1;36mMy custom output\x1b[0m');
  },
  // ... more commands
};

This project is licensed under the MIT License - see the LICENSE file for details.

Ankan Saha

• Full Stack Developer at Hoichoi Technologies
• GitHub: @AnkanSaha
• LinkedIn: theankansaha
• Email: ankansahaofficial@gmail.com

• xterm.js - The terminal emulator that powers this project
• Next.js - The React framework
• Tailwind CSS - For styling
• OpenNext - For Cloudflare Workers deployment

Made with 💚 and lots of ☕ by Ankan Saha