A terminal-themed developer portfolio built with Next.js 16, featuring a unique CLI aesthetic with smooth animations and a functional contact form.
- Framework: Next.js 16 (App Router, Turbopack)
- Language: TypeScript
- Styling: Tailwind CSS
- Animations: Framer Motion
- Email: Resend API
- Deployment: Vercel
- Terminal/CLI inspired design with boot sequence animation
- Responsive across all devices
- Interactive project showcase with filtering
- Timeline-based experience section
- Skills visualization with proficiency indicators
- Functional contact form with email delivery
- Resume download functionality
- Dark mode optimized
- Node.js 18+
- npm or yarn
# Clone the repository
git clone https://github.com/StrangeNoob/portfolio.git
cd portfolio
# Install dependencies
npm install
# Set up environment variables
cp .env.example .env.localCreate a .env.local file with:
RESEND_API_KEY=your_resend_api_keyGet your API key from Resend.
npm run devOpen http://localhost:3000 to view the portfolio.
npm run build
npm startsrc/
├── app/
│ ├── api/
│ │ └── contact/ # Contact form API route
│ ├── globals.css # Global styles & terminal theme
│ ├── layout.tsx # Root layout
│ └── page.tsx # Main page
├── components/
│ └── sections/ # Page sections
│ ├── Hero.tsx # Boot sequence & intro
│ ├── About.tsx # Bio section
│ ├── Experience.tsx # Work timeline
│ ├── Projects.tsx # Project showcase
│ ├── Skills.tsx # Tech stack
│ └── Contact.tsx # Contact form
├── data/
│ └── resume.ts # Portfolio content data
└── lib/
└── utils.ts # Utility functions
- Push to GitHub
- Import project in Vercel
- Add
RESEND_API_KEYto environment variables - Deploy
Build the production version and deploy the .next folder:
npm run buildEdit src/data/resume.ts to update:
- Personal info
- Work experience
- Projects
- Skills
- Social links
The terminal theme colors are defined in tailwind.config.ts and src/app/globals.css.
MIT
- Email: itsprateekmohanty@gmail.com
- GitHub: @StrangeNoob
- LinkedIn: prateek-mohanty