Thiết kế giao diện website bán hàng công nghệ

TRƯỜNG ĐẠI HỌC KINH TẾ KHOA THỐNG KÊ – TIN HỌC ––––––––––––––––––––––––––––––– BÁO CÁO THỰC TẬP NGHỀ NGHIỆP NGÀNH HỆ THỐNG THÔNG TIN QUẢN LÝ CHUYÊN NGÀNH QUẢN TRỊ HỆ THỐNG THÔNG TIN Thiết kế giao diện website bán hàng công nghệ Đơn vị thực tập : Công ty tnhh công nghệ tin học viễn thông Quốc Thắng Giảng viên hướng dẫn : TS.Phan Định Vấn LỜI CẢM ƠN Lời cho em xin gửi lời cảm ơn chân thành đến Công ty TNHH công nghệ tin học viễn thông Quốc Thắng , mentor Huỳnh Ngọc Kha , Thầy TS Phan Đình Vấn tất người tạo điều kiện cho em tham gia vào chương trình thực tập hồn thành đề tài báo cáo “Thiết kế giao diện website bán hàng công nghệ” Em xin cảm ơn Ban Giám hiệu trường , phịng ban, q thầy giáo khoa Thống kê – Tin học trường Đại học Kinh Tế - Đại học Đà Nẵng tận tình giảng dạy , truyền đạt kiến thức tạo điều kiện thuận lợi cho em sinh viên khác trình thực tập Đặc biệt em xin cảm ơn Thầy TS Phan Đình Vấn trực tiếp hướng dẫn em thực đề tài tập nhận thức Thầy tận tình dẫn , nhận xét, giúp đỡ hỗ trợ em q trình thực hồn thành đề tài báo cáo Trong suốt thời gian thực tập, em có hội tiếp cận học hỏi từ đội ngũ chuyên nghiệp tận tâm Em muốn gửi lời cảm ơn đặc biệt đến mentor Huỳnh Ngọc Kha Thầy TS.Phan Đình Vấn người dành thời gian tận tâm hỗ trợ dẫn em trình thực tập Nhờ có dẫn dắt thầy mentor, em học nhiều kỹ rèn luyện khả làm việc nhóm, giúp em trở thành nhân viên tương lai có giá trị Thực tập Công ty TNHH công nghệ tin học viễn thông Quốc Thắng cung cấp cho em môi trường làm việc chuyên nghiệp thử thách, giúp em áp dụng kiến thức học vào thực tế Em biết ơn có hội làm việc anh chị đồng nghiệp tài giàu kinh nghiệm Nhờ có hỗ trợ giúp đỡ người, em trải qua trình học tập phát triển đáng giá Cuối cùng, em muốn gửi lời cảm ơn sâu sắc đến Công ty TNHH công nghệ tin học viễn thông Quốc Thắng, anh mentor Thầy TS.Phan Đình Vấn cung cấp cho em hội để khám phá thân, rèn kỹ xây dựng mạng lưới quan hệ lĩnh vực Em tin kinh nghiệm kiến thức thu từ thực tập nghề nghiệp tảng vững cho thành công em tương lai Em xin chân thành cảm ơn ! LỜI CAM ĐOAN “Em xin cam đoan đề tài: “Thiết kế giao diện website bán hàng cơng nghệ ” cơng trình nghiên cứu độc lập em hướng dẫn anh chị Mentors Công ty TNHH công nghệ tin học viễn thơng Quốc Thắng Ngồi khơng có chép người khác Đề tài, nội dung báo cáo thực tập sản phẩm mà em nỗ lực nghiên cứu trình học tập trường tham gia thực tập công ty.” MỤC LỤC LỜI CẢM ƠN LỜI CAM ĐOAN MỤC LỤC .6 DANH MỤC HÌNH ẢNH DANH MỤC BẢNG BIỂU DANH MỤC CÁC TỪ VIẾT TẮT 10 LỜI MỞ ĐẦU Chương Giới thiệu VỀ Công ty TNHH công nghệ tin học viễn thông Quốc Thắng ĐỀ TÀI Thiết kế giao diện website bán hàng công nghệ .3 1.1 Giới Thiệu công ty Công ty TNHH công nghệ tin học viễn thông Quốc Thắng .3 Tổng quan đơn vị thực tập Tầm nhìn , sứ mệnh .4 Cơ cấu tổ chức .5 Hình 1.2 Cơ Cấu Tổi chức 1.2 Giới thiệu tổng quan dựng án “Thiết kế giao diện website bán hàng công nghệ” .6 Chương Tổng quan ngành nghề Frond-End Cơ sở lý thuyết nghiên cứu phát triển đề tài 2.1 Tổng Quan Ngành Nghề Frond-End .7 2.1.1 Mô Tả Ngành Nghề Frond-end 2.1.2 Những tài liệu mà FE cần thực 2.1.3 Các kỹ FE cần có 2.2 Cớ Sở Lý Thuyết 2.2.1 Lý Thuyết Về HTML - Khái niệm phần tử thuộc tính HTML 2.2.2 Lý thuyết CSS module 11 Hình 2,2 Ngôn ngữ CSS Module 12 2.2.3 Lý thuyết javascript 13 2.1.1 Cách tạo hàm (Function) JavaScript 16 2.2.4 Lý thuyết Next js 18 CHƯƠNG 3: TRIỂN KHAI DỰ ÁN “Thiết kế giao diện website bán hàng công nghệ” 21 3.1 Khảo sát thông tin 3.1.1 Khảo sát đánh giá trạng hoạt động hệ thống có: .21 3.2 Thiết kế giao diện 22 CHƯƠNG 4: Kết dự án 24 Hình .25 4.3 Giao Diện Trang Products .28 Hình Giao diện trang Product Detail 29 KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN .29 Kết đạt tập 29 5.2 Kết luận hướng phát triển giải pháp 30 PHỤ LỤC 31 DANH MỤC HÌNH ẢNH Hình Logo Cơng ty Hình Ngôn ngữ HTML .9 Hình CSS module 11 Hình Ngơn ngữ JavaScript .14 Hình framework NextJS: 18 Hình Cơng cụ Figma 22 Hình Giao Diên Trang Home .25 Hình Giao Diện Các Product Nổi Bật 26 Hình Giao diện trang Product Detail 29 DANH MỤC BẢNG BIỂU DANH MỤC CÁC TỪ VIẾT TẮT STT Kí hiệu chữ viết Chữ viết đầy đủ tắt HTML Hypertext Markup Language CSS Cascading Style Sheets JS JavaScript LỜI MỞ ĐẦU Lý chon đề tài Trong thời đại cơng nghệ ngày nay, việc có giao diện website bán hàng công nghệ hấp dẫn quan trọng để thu hút khách hàng Một thiết kế giao diện website tốt giúp bật số đối thủ cạnh tranh tạo ấn tượng tốt với khách hàng Thiết kế giao diện website chuyên nghiệp hấp dẫn mang lại cho người dùng trải nghiệm tốt Giao diện thiết kế đẹp mắt, đại trực quan giúp tạo dựng niềm tin lòng tin cậy khách hàng vào sản phẩm thương hiệu Thiết kế giao diện website linh hoạt tương thích với tảng thiết bị khác (ví dụ: máy tính để bàn, điện thoại di động, máy tính bảng) quan trọng Với phát triển thiết bị di động, người dùng sử dụng thiết bị khác để truy cập vào website Một giao diện đáp ứng hiển thị tốt thiết bị giúp đảm bảo khách hàng có trải nghiệm tốt Mục Tiêu đề tài Giao diện website cần có thiết kế bật, thu hút người dùng Màu sắc, hình ảnh kiểu chữ chọn phải phù hợp với lĩnh vực công nghệ tạo cảm giác chuyên nghiệp Với phổ biến thiết bị di động, giao diện website cần thiết kế linh hoạt để hiển thị cách tốt thiết bị khác nhau, bao gồm điện thoại di động máy tính bảng Phương pháp nghiên cứu - Nghiên cứu kiến thức sẵn có internet - Hướng dẫn mentor - Xây dựng demo để hiểu rõ học 10