Skip to content

DucThuy2000/n-darwin

Repository files navigation

🌟 N-Darwin Portfolio

A modern, responsive portfolio website showcasing my journey as a passionate fullstack developer

Next.js React TypeScript Tailwind CSS Framer Motion

🚀 Live Demo

Visit the live portfolio at: ndarwin.com

📖 Introduction

Welcome to my personal portfolio website! I'm Darwin (Đức Thuỷ), a passionate Fullstack Developer with over 3+ years of hands-on experience building robust, scalable, and user-centric web applications. This portfolio showcases my journey, skills, projects, and professional experience in the world of software development.

I specialize in crafting seamless digital experiences from frontend to backend, leveraging modern technologies and best practices. Throughout my career, I have collaborated with diverse teams and clients, delivering solutions that not only meet technical requirements but also drive business value.

Whether it's designing intuitive user interfaces or architecting efficient server-side logic, I take pride in delivering clean, maintainable code and staying up-to-date with the latest industry trends.

✨ Key Features

🎨 Modern Design & Animation

  • Responsive Design: Fully responsive layout optimized for all devices (mobile, tablet, desktop)
  • Smooth Animations: Beautiful micro-interactions powered by Framer Motion
  • Dynamic Role Animation: 4 different animation styles for role transitions (flip, fade, scale, character-by-character)
  • Interactive Elements: Hover effects, scroll animations, and smooth transitions

👤 Personal Branding

  • Professional Overview: Dynamic animated introduction with rotating roles
  • About Section: Comprehensive background and career journey
  • Contact Integration: Multiple contact methods and social media links
  • Avatar Showcase: Interactive profile image with current work status

💼 Experience Showcase

  • Timeline Layout: Chronological display of professional experience
  • Company Profiles: Detailed information about each workplace
  • Project Breakdown: Individual projects within each company role
  • Technology Stacks: Visual representation of technologies used
  • Role Descriptions: Comprehensive details of responsibilities and achievements

🛠️ Projects Portfolio

  • Project Gallery: Showcase of personal and professional projects
  • Technology Tags: Visual indicators of tech stacks used
  • Project Details: Comprehensive descriptions with features and functionalities
  • External Links: Direct links to live projects (where applicable)
  • Privacy Indicators: Clear marking of private/confidential projects

🔧 Technical Stack Display

  • Interactive Icons: Hover effects on technology logos
  • Comprehensive Coverage: Frontend, backend, database, and DevOps tools
  • Visual Organization: Clean grid layout with smooth animations
  • Tooltip Information: Technology names on hover

📱 User Experience

  • Navigation Menu: Smooth scrolling navigation with mobile hamburger menu
  • Back to Top: Convenient scroll-to-top functionality
  • Loading States: Smooth transitions and loading animations
  • Accessibility: Screen reader friendly with proper ARIA labels
  • SEO Optimized: Meta tags, structured data, and sitemap

🔮 Coming Features

📝 Blog System

  • MDX Integration: Rich content creation with MDX and Markdown support
  • Dynamic Content: Server-side rendering for optimal performance
  • Code Highlighting: Syntax highlighting for technical articles
  • Dynamic OG Images: Automatically generated Open Graph images for rich social media previews
  • Category System: Organized content with tags and categories
  • Reading Time: Estimated reading time for articles
  • Search Functionality: Full-text search across blog posts

🏆 Certifications & Honors

  • Achievement Gallery: Visual showcase of certifications and awards
  • Interactive Badges: Clickable certification badges with verification links
  • Timeline View: Chronological display of achievements
  • Skill Mapping: Link certifications to relevant skills and technologies
  • PDF Viewer: Integrated certificate viewing capability

🔄 Additional Enhancements

  • Analytics Integration: Visitor tracking and engagement metrics
  • Performance Monitoring: Real-time performance insights
  • Newsletter Subscription: Blog update notifications
  • Comment System: Interactive discussions on blog posts
  • RSS Feed: Syndication for blog content
  • Multi-language Support: Internationalization for global reach

📁 Project Structure

src/
├── app/                  # Next.js App Router
│   ├── layout.tsx       # Root layout
│   ├── page.tsx         # Home page
│   └── blog/            # Blog pages (coming soon)
├── components/          # Reusable components
│   ├── ui/             # Base UI components
│   ├── layout/         # Layout components
│   ├── overview/       # Hero section components
│   ├── experience/     # Experience section
│   ├── projects/       # Projects showcase
│   └── tech-stack/     # Technology stack display
├── const/              # Constants and configuration
├── data/               # Static data (projects, experience)
├── lib/                # Utility functions
├── providers/          # Context providers
└── styles/             # Global styles

🤝 Connect With Me

📄 License

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

Copyright © 2025 Đức Thuỷ (Darwin). All rights reserved.

Feel free to fork and customize for your own use, but please provide attribution when sharing or redistributing.


Built with ❤️ by Darwin | Portfolio showcasing 3+ years of fullstack development experience

About

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors