A modern, dynamic portfolio website built with Next.js, TypeScript, Tailwind CSS, and Framer Motion.
✨ Dynamic & Interactive
- Smooth animations with Framer Motion
- Responsive design for all devices
- Beautiful gradient backgrounds and effects
📱 Full-Stack Showcase
- Hero section with introduction
- Technical skills with animated tags
- Featured projects showcase
- Latest blog articles
- Contact section with social links
🚀 Modern Tech Stack
- Next.js 14 with App Router
- TypeScript for type safety
- Tailwind CSS for styling
- Framer Motion for animations
- GitHub Actions for CI/CD deployment
- Node.js 18+
- npm or yarn
# Clone the repository
git clone https://github.com/jinglinsen/jinglinsen.git
cd jinglinsen
# Install dependencies
npm install
# Start development server
npm run devOpen http://localhost:3000 in your browser to see the result.
npm run build
npm startEdit the content in the component files:
components/Hero.tsx- Update your name and headlinecomponents/Skills.tsx- Add your technical skillscomponents/Projects.tsx- Showcase your projectscomponents/Blog.tsx- Add your articlescomponents/Contact.tsx- Update contact information
- Colors can be customized in
tailwind.config.ts - Global styles in
app/globals.css
The site automatically deploys to GitHub Pages when you push to the main branch via GitHub Actions.
git push origin mainAfter deployment, your portfolio will be available at https://jinglinsen.github.io
MIT License - feel free to use this template for your own portfolio!
Jinglinsen - Full Stack Engineer