Ưu đãi trong tuần: Nhập mã UD50 giảm 50k cho đơn từ 300k!
Trang chủ
Menu

Build Portfolio with Next.js, Framer Motion, & Tailwind CSS

Xây Dựng Portfolio với Next.js, Framer Motion & Tailwind CSS

Xây Dựng Portfolio với Next.js, Framer Motion & Tailwind CSS

Xây dựng và Triển khai Website Portfolio Cá nhân Responsive với Next.js, Framer Motion & Tailwind CSS

4.6
(37 đánh giá)
513 học viên
Giảng viên
Code And Create
Phụ đề Việt chất lượng cao Phụ đề tiếng Anh Bán chạy Đánh giá cao
50.000đ 349.000đ -86%
✓ Xem giỏ hàng và thanh toán
Bao gồm phụ đề tiếng Việt, tiếng Anh
9.5 giờ video
29 bài giảng
Truy cập vĩnh viễn
Học trên mọi thiết bị
Cập nhật: 30/05/2026

Bạn sẽ học được gì

Xây dựng một website portfolio cá nhân hoàn toàn responsive bằng NextJS, Tailwind CSS và Framer Motion.
Tạo các hiệu ứng chuyển động và chuyển tiếp mượt mà với Framer Motion để nâng cao trải nghiệm người dùng.
Triển khai thiết kế chuyên nghiệp và gọn gàng với Tailwind CSS, tối ưu hóa cho mọi kích thước màn hình.
Phát triển kỹ năng lập trình thực tế để áp dụng vào các dự án phát triển web.
Học cách triển khai một website portfolio hoàn chỉnh lên các nền tảng như Vercel, giúp mọi người đều có thể truy cập.

Yêu cầu

Trình Soạn thảo Văn bản
Trình Duyệt Web Hiện đại
Kiến thức Cơ bản về HTML, CSS, JavaScript
Kiến thức Cơ bản về React

Đối tượng phù hợp

Các Lập trình viên Front-End đang muốn xây dựng dự án thực tế và nâng cao kỹ năng với các công nghệ web hiện đại như NextJS, Tailwind CSS và Framer Motion.
Freelancer và Nhà Thiết kế Web muốn tạo một website portfolio chuyên nghiệp để trưng bày dự án và thu hút khách hàng tiềm năng.
Sinh viên hoặc Người mới tốt nghiệp ngành phát triển web muốn cải thiện hồ sơ xin việc với một portfolio tương tác, được xây dựng từ đầu.
Lập trình viên có kinh nghiệm muốn nâng cấp kỹ năng bằng cách học cách tích hợp NextJS, Tailwind CSS và hiệu ứng động với Framer Motion vào một dự án thực tế.
Bất kỳ ai quan tâm đến phát triển web và muốn học cách xây dựng, triển khai một website responsive, bắt mắt với trọng tâm là các công cụ và framework hiện đại.

Nội dung khóa học

12 phần • 29 bài giảng
1 Giới thiệu
1 Tổng quan Dự án
2 Tệp Nguồn
3 Tổng quan về Công nghệ
4 Thiết lập Dự án
1 Tạo Nội dung & Định kiểu
2 Hiển thị Biểu tượng
3 Thêm Hiệu ứng Động với Framer Motion
1 Tạo Nội dung & Định kiểu
2 Thêm Hiệu ứng Động cho Thành tựu
1 Tạo Nội dung & Định kiểu
2 Làm cho Dòng thời gian Hoạt động
1 Tạo Nội dung & Định kiểu
2 Thêm Hiệu ứng Động cho Danh sách Kỹ năng
1 Tạo Nội dung & Định kiểu
2 Làm cho Băng chuyền Đánh giá Hoạt động
1 Tạo Nội dung & Định kiểu
2 Làm cho Bộ lọc Dự án Hoạt động
1 Tạo và Định kiểu Thẻ Giá
2 Thêm Nội dung và Hiệu ứng Động cho Thẻ
3 Xây dựng Phần Liên hệ
1 Tạo Nội dung & Định kiểu
2 Thêm Hiệu ứng Động cho Hỏi & Đáp
1 Tạo Nội dung & Định kiểu
2 Làm cho Thanh Điều hướng Hoạt động
1 Thêm Chế độ Tối
2 Thêm Bộ Tải Tùy chỉnh
3 Tối ưu Responsive cho Dự án
4 Triển khai Website trên Vercel

Giới thiệu khóa học

Welcome to this comprehensive course where you will learn how to build a fully responsive, modern personal portfolio website using Next.js, Tailwind CSS, and Framer Motion. This project-based course is perfect for developers of all levels who are looking to create an impressive portfolio that not only looks visually stunning but also functions seamlessly across all devices. Whether you’re aiming to showcase your projects to potential employers, clients, or simply to level up your web development skills, this course will provide you with everything you need to create a professional-grade website.

Throughout this course, we will focus on hands-on, real-world development practices. You’ll begin by setting up your development environment and structuring your project to ensure scalability and maintainability. Then, we'll dive into utilizing Tailwind CSS to create a clean, responsive design without writing tons of custom CSS. You’ll also master Framer Motion to add smooth, dynamic animations that will bring your portfolio to life, giving it that polished, professional look.

As we move forward, you'll learn how to integrate essential sections like the Hero, About, Experience, and Projects, all while maintaining responsiveness and accessibility. Each section will be built from scratch, and you’ll have a deep understanding of how to organize and present your content in a way that makes a strong impact. We'll focus on best practices in responsive web design, ensuring that your site looks just as great on mobile devices as it does on larger screens.

In the final stages, we’ll tackle the crucial steps of deploying your site on Vercel. You’ll learn how to make your project live, ensuring it's accessible and shareable online, and understand the importance of hosting and maintaining your site. By the end of the course, not only will you have a complete, live portfolio website, but you'll also possess the skills to build similar projects and apply these concepts to future work.

This course is designed to be approachable for beginners but detailed enough to offer value to experienced developers. Whether you're a freelancer, a job seeker, or simply looking to showcase your web development abilities, this course provides you with practical, applicable knowledge to help you achieve your goals.

Khóa học liên quan

Khám phá thêm các khoá học cùng chủ đề

Hiển thị tất cả khoá học Frontend Development
Hiển thị tất cả khoá học Next Js
Hiển thị tất cả khoá học Tailwind Css
Hiển thị tất cả khoá học Web Development
Zalo
Tôi có thể tư vấn khoá học cho bạn 😊