About Me
Tôi tên là: Lê Thành Nhân
MSSV là: DH52201138
Lớp: D22_TH03
Tôi là một nhà phát triển về front-end với nhiều kinh nghiệm trong việc sáng tạo nội dung hiện đại, đáp ứng giao diện người dùng. Tôi làm việc tại trường Đại Học Công Nghệ Sài Gòn.
Dưới đây là vị trí nơi tôi làm việc:
🛠️ Kỹ năng
Phát triển Front-end
HTML
CSS
JavaScript
🛠️ Kỹ năng chi tiết
HTML, CSS, JavaScript
C++, C#
Giao tiếp
Làm việc nhóm
Thiết kế Figma
Phân tích vấn đề
Thông tin chi tiết đề tài
Đề tài: Website Hồ sơ cá nhân
- Giao diện responsive cho cả PC, tablet và điện thoại.
- Hiệu ứng cuộn mượt bằng thư viện AOS.
- Hiệu ứng chữ động "Tôi là Web Developer / Game Developer".
- Ảnh đại diện có hiệu ứng zoom khi hover.
- Menu điều hướng cố định đầu trang, hoạt động cuộn mượt.
- Các phần trình bày rõ ràng: Giới thiệu, Hồ sơ, Labs, Liên hệ.
- Sử dụng Bootstrap để đảm bảo bố cục linh hoạt và đẹp mắt.
- Thêm form liên hệ có kiểm tra dữ liệu (validation).
- Tối ưu UI/UX với màu sắc dịu, biểu tượng emoji dễ nhận diện.
Thông tin chi tiết đề tài
Phần Giới thiệu (About):
Tiểu sử chi tiết hơn: Không chỉ là "I'm a front-end developer...", mà có thể mở rộng về niềm đam mê, kinh nghiệm làm việc (nếu có), các dự án cá nhân nổi bật, hoặc mục tiêu nghề nghiệp ngắn hạn và dài hạn.
Kỹ năng chuyên sâu: Thay vì chỉ liệt kê HTML, CSS, JavaScript, bạn có thể phân loại và làm rõ hơn các kỹ năng cụ thể như:
- Front-end Frameworks/Libraries: React (nếu có kinh nghiệm), Angular, Vue.js, jQuery.
- CSS Preprocessors: Sass, Less.
- State Management (nếu dùng Framework): Redux, Context API, Vuex.
- Testing: Jest, Mocha, Cypress.
- Build Tools: Webpack, Parcel.
- UI/UX Design Principles: Hiểu biết về tính dễ sử dụng, khả năng tiếp cận (accessibility).
- Công cụ và Workflow: Liệt kê các công cụ bạn sử dụng hàng ngày như VS Code, Git, Figma, các nền tảng quản lý dự án (Trello, Jira).
Phần Hồ sơ (Resume/Experience):
- Kinh nghiệm làm việc (nếu có): Liệt kê các vị trí đã từng đảm nhiệm, tên công ty, thời gian làm việc, và mô tả ngắn gọn về trách nhiệm và thành tựu ở mỗi vị trí.
- Học vấn: Trình bày thông tin về các trường đã học, chuyên ngành, bằng cấp và thời gian học.
- Chứng chỉ và Giải thưởng (nếu có): Liệt kê các chứng chỉ liên quan đến lĩnh vực của bạn và các giải thưởng đã đạt được.
- Khả năng ngôn ngữ: Nếu bạn thông thạo nhiều ngôn ngữ, hãy đề cập đến trình độ của bạn ở mỗi ngôn ngữ.
- Khả năng khác: Các kỹ năng mềm quan trọng như giao tiếp, làm việc nhóm, giải quyết vấn đề, tư duy phản biện.
- Có thể cung cấp tùy chọn tải xuống CV/Resume dạng PDF.
Phần Labs (Dự án cá nhân/Thử nghiệm):
- Trình bày chi tiết hơn về từng dự án:
- Tên dự án: Rõ ràng và hấp dẫn.
- Mô tả ngắn gọn: Mục tiêu của dự án, vấn đề đã giải quyết.
- Công nghệ sử dụng: Liệt kê chi tiết các ngôn ngữ, framework, thư viện đã dùng.
- Hình ảnh/Video demo: Hiển thị trực quan sản phẩm của bạn.
- Liên kết đến dự án trực tuyến (nếu có): Link đến website đã deploy hoặc repository trên GitHub/GitLab.
- Vai trò của bạn trong dự án (nếu là dự án nhóm).
- Những bài học kinh nghiệm từ dự án.
- Phân loại dự án: Có thể chia thành các danh mục như "Front-end Projects", "Game Development Experiments", "API Integrations",...
Phần Liên hệ (Contact):
- Thông tin liên hệ đa dạng: Email, số điện thoại (tùy chọn), các kênh mạng xã hội chuyên nghiệp (LinkedIn, Twitter, GitHub).
- Form liên hệ chi tiết hơn: Có thể thêm các trường như "Tiêu đề", "Loại yêu cầu" (ví dụ: hợp tác, tuyển dụng, góp ý).
- Thông báo phản hồi thành công: Sau khi người dùng gửi form, hiển thị thông báo xác nhận đã nhận được tin nhắn.
- Tích hợp Captcha: Để chống lại spam.
Tối ưu UI/UX:
- Thiết kế nhất quán: Đảm bảo sự đồng nhất về font chữ, màu sắc, kiểu dáng nút, và các yếu tố giao diện trên toàn bộ website.
- Điều hướng trực quan: Menu rõ ràng, dễ hiểu, giúp người dùng dễ dàng tìm kiếm thông tin.
- Tốc độ tải trang: Tối ưu hóa hình ảnh, sử dụng bộ nhớ đệm (caching) để trang web tải nhanh.
- Khả năng tiếp cận (Accessibility - A11y): Đảm bảo website có thể sử dụng được bởi người khuyết tật (ví dụ: sử dụng semantic HTML, cung cấp văn bản thay thế cho hình ảnh).
- Kiểm tra trên nhiều thiết bị và trình duyệt: Đảm bảo giao diện responsive hoạt động tốt trên các kích thước màn hình và trình duyệt khác nhau.
- Phản hồi tương tác: Cung cấp phản hồi trực quan khi người dùng tương tác với các phần tử (ví dụ: hiệu ứng hover trên nút, thay đổi trạng thái form).
Về Kỹ Thuật:
- Chi tiết về Bootstrap: Xác định rõ phiên bản Bootstrap bạn sẽ sử dụng và cách bạn tùy chỉnh nó để phù hợp với thiết kế của mình (ví dụ: sử dụng Sass để tùy biến các biến và mixin).
- Thư viện AOS (Animate On Scroll): Tìm hiểu kỹ các tùy chọn cấu hình của AOS để tạo ra các hiệu ứng cuộn mượt và hấp dẫn một cách có chủ đích.
- Hiệu ứng chữ động: Xác định thư viện hoặc kỹ thuật bạn sẽ sử dụng cho hiệu ứng "Tôi là Web Developer / Game Developer" (ví dụ: Typed.js, Textillate.js, hoặc tự viết bằng JavaScript).
- Kiểm tra dữ liệu form (Validation):
- Client-side validation: Sử dụng JavaScript để kiểm tra các trường bắt buộc, định dạng email, độ dài tối thiểu/tối đa, trước khi gửi dữ liệu lên server.
- Server-side validation (nếu có backend): Thực hiện kiểm tra dữ liệu trên server để đảm bảo tính bảo mật và toàn vẹn dữ liệu.
- Quản lý mã nguồn: Sử dụng hệ thống quản lý phiên bản như Git và lưu trữ trên các nền tảng như GitHub, GitLab, Bitbucket.
- Deployment (triển khai): Lựa chọn nền tảng để host website của bạn (ví dụ: Netlify, Vercel, GitHub Pages, AWS, Google Cloud).
Recent Projects
Modern Website
Dashboard UI
