TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN & TRUYỀN THÔNG KHOA CÔNG NGHỆ THÔNG TIN BÁO CÁO THỰC TẬP CƠ SỞ Đề tài XÂY DỰNG WEBSITE BÁN MỸ PHẨM TRỰC TUYẾN CHO CỬA HÀNG MỸ PHẨM LINH COSMETIC Sinh viên thực hiện[.]
TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN & TRUYỀN THÔNG KHOA CÔNG NGHỆ THÔNG TIN BÁO CÁO THỰC TẬP CƠ SỞ Đề tài: XÂY DỰNG WEBSITE BÁN MỸ PHẨM TRỰC TUYẾN CHO CỬA HÀNG MỸ PHẨM LINH COSMETIC Sinh viên thực : Nguyễn Văn Linh Mã sinh viên : DTC1816100514 Ngành : Công nghệ thông tin Giảng viên hướng dẫn : Th.S Nguyễn Thuý Lan Hà Nội ngày 25 tháng năm 2022 LỜI CẢM ƠN Trong thời gian học tập KHOA CÔNG NGHỆ THÔNG TIN – Trường Đại học Công Nghiệp Hà Nội, giúp đỡ thầy giáo, giáo em hồn thành báo cáo thực tập chuyên ngành Hoàn thành báo cáo này, cho phép em bày tỏ lời cảm ơn sâu sắc tới thầy, cô giáo Khoa Công nghệ thông tin – Trường Đại học Công Nghiệp Hà Nội Đồng thời em xin gửi lời cảm ơn đặc biệt hướng dẫn tận tình cô giáo – ThS Nguyễn Thuý Lan giúp đỡ em suốt trình thực báo cáo Tuy nhiên, thời gian có hạn kiến thức kinh nghiệm thực tiễn em cịn nhiều hạn chế nên em khơng thể tránh khỏi thiếu xót chưa phát huy hết ý tưởng , khả hỗ trợ ngôn ngữ kỹ thuật lập trình đề tài Trong q trình xây dựng website, khơng thể tránh khỏi sai xót Vì em mong nhận góp ý thầy ,cơ bạn để đề tài em hoàn chỉnh Em xin chân thành cảm ơn! Hà Nội, ngày 25 tháng năm 2022 Sinh viên thực Nguyễn Văn Linh MỤC LỤ LỜI CẢM ƠN MỤC LỤC MỞ ĐẦU TỔNG QUAN VỀ ĐỀ TÀI CHƯƠNG CƠ SỞ LÝ THUYẾT .7 1.1 Tìm hiểu Website 1.1.1 Khái niệm Website 1.1.2 Phân loại Website 1.2 Tìm hiểu HTML 1.2.1 Tổng quan HTML 1.2.2 Các khái niệm Trong HTML 1.3 Tìm hiểu CSS 16 1.3.1 Tổng quan CSS 16 1.3.2 Các cách áp dụng CSS 16 1.3.3 Cú pháp CSS 18 1.3.4 Một số quy tắc CSS 19 1.3.5 Đơn vị đo lường CSS .20 1.3.6 Selector CSS 21 1.3.7 Các thuộc tính CSS định dạng văn 22 1.3.8 Ưu điểm CSS 23 1.4 Tìm hiểu javascript 23 1.4.1 Giới thiệu ngôn ngữ JavaScript 23 1.4.2 Đưa mã Javascript vào trang HTML .24 CHƯƠNG : KHẢO SÁT, PHÂN TÍCH THIẾT KẾ HỆ THỐNG .26 2.1 Khảo sát hệ thống 26 2.1.1 Tổng quan cửa hàng mỹ phẩm Linh Cosmetic 26 2.1.2 Quy trình bán hàng hệ thống cũ .27 2.1.3 Đánh giá trạng cách khắc phục 28 2.1.4 Bài toán đặt .29 2.1.5 Mục tiêu xây dựng hệ thống 29 2.2 Phân tích hệ thống 30 2.2.1 Xác định tác nhân vai trò tác nhân .30 2.2.2 Biểu đồ 31 2.2.3 Đặc tả kịch .33 2.2.4 Biểu đồ lớp chi tiết 38 2.2.5 Biểu đồ hoạt động 39 2.2.6 Biểu đồ trình tự .46 2.2.7 Biểu đồ hoạt động 50 CHƯƠNG 3: XÂY DỰNG WEBSITE 59 3.1 Giao diện trang chủ .59 3.2 Form nhập thông tin địa 59 3.3 Giao diện đăng nhập 60 3.4 Giao diện đăng ký tài khoản 60 3.5 Giao diện sản phẩm deal hot 61 3.6 Giao diện sản phẩm 61 3.7 Giao diện sản phẩm trang điểm môi 62 3.8 Giao diện sản phẩm trang điểm mắt 62 3.9 Giao diện sản phẩm trang điểm mặt 63 3.10 Trang giỏ hàng .63 3.11 Thông tin cuối trang .64 KẾT LUẬN 65 TÀI LIỆU THAM KHẢO 66 NHẬN XÉT CỦA GIÁO VIÊN HƯỚNG DẪN 67 MỞ ĐẦU Internet sản phẩm có giá trị lớn lao ngày trở thành cơng cụ khơng thẻ thiếu, nên tảng cho truyền tải , trao đổi thông tinn tồn cầu Giờ đây, việc liên quan đến thơng tin trở nên thật dễ dàng cho người sử dụng : cần có máy tính điện thoại thơng minh có kết nối internet dịng liệu truy tìm gần giới vẻ vấn đẻ mà bạn quan tâm có đầy đủ thơng tin, hình ảnh… Cùng với cơng nghệ ngày phát triển , người có tay cơng cụ hữu hiệu làm tăng suất lao động hiệu cơng việc.Chính mà thương mại điện tử cơng cụ làm nên điều BiII Gate nói: “Năm 2015,bạn có lựa chọn: kinh doanh internet, bạn không kinh doanh nữa”.Thương mại điện tử trở thành phương tiện giao dịch quen thuộc công ty thương mại lớn giới Nó có tốc độ phát triển mạnh.Và hầu hết công ty bán hàng công ty thương mại điện tử mua sắm qua mạng trở thành thói quen hàng ngày nhiều người Giờ đây, thương mại điện tử khẳng định vai trò xúc tiến thúc đẩy phát triển doanh nghiệp Đối với cửa hàng hay công ty , việc quảng bá giới thiệu đến khách hàng sản phẩm đáp ứng nhu cầu khách hàng cẩn thiết Vậy phải quảng bá nảo xây dựng Website cho cửa hàng quảng bá tất sản phẩm bán Để hiểu kỹ website thương mại điện tử nên em chọn đề tài :“Xây dựng website bán mỹ phẩm cửa hàng mỹ phẩm LinhCosmetic” Sử dụng ngôn ngữ HTML,CSS,JAVASCRIPT công cụ hỗ trợ lập trình Visual stadio code TỔNG QUAN VỀ ĐỀ TÀI Lý chọn đề tài Như thấy thị trường việc cạnh tranh kinh doanh ngày trở nên liệt hầu hết nhà kinh doanh, công ty lớn tâm đến việc làm thoả mãn khách hàng cách tốt So với kinh doanh truyền thống TMDT chi phí thấp hơn, hiệu đạt cao Hơn nữa, với lợi công nghệ Internet nên việc truyền tải thông tin sản phẩm nhanh chóng, thuận tiện Kết hợp với phận giao hàng tận nơi, thông qua bưu điện ngân hàng để toán tiền, tăng thêm thuận lợi để loại hình phát triển Biết nhu cầu chương trình “Xây dựng website bán mỹ phẩm cửa hàng mỹ phẩm LinhCosmetic” demo xây dựng nề tảng HTML,CSS JAVASCRIPT nhằm để đáp ứng cho người tiêu dùng toàn quốc thơng qua hệ thống Website họ đặt mua mặt hàng hay sản phẩm cần thiết Do đó, với đời website bán hàng , người mua thứ hàng hóa lúc nơi mà khơng cần phải tới tận nơi để mua Trên giới có nhiều trang website bán hàng trực tuyến chưa phổ biến rộng rãi Và khái niệm thương mại điện tử cịn xa lạ Trước thực tế em chọn đề tài: “Xây dựng website bán mỹ phẩm cửa hàng mỹ phẩm LinhCosmetic” cho thực tập sở Mục đích, ý nghĩa chọn đề tài Khảo sát hệ thống theo yêu cầu cá nhân, quan, cơng ty… Việc bán hàng địi hỏi cần phải có tư duy, đầu óc kinh doanh khả nhạy bén nắm bắt thị trường Một cửa hàng bán mặt hàng không cần nhiều nhân viên, khách hàng không cần trực tiếp đến mua hàng mà nhà dùng vài click chuột có sản phẩm cần HTML VÀ CSS hệ thống quản trị nội dung giúp bạn thực website động cách nhanh chóng dễ dàng Là hệ thống quản trị nội dung mã nguồn mở số giới Linh hoạt, đơn giản, nhã, tính tuỳ biến cao mạnh mẽ, nói Joomla! Được sử dụng tồn giới từ trang web đơn giản ứng dụng phức tạp Việc cài đặt Joomla! dễ dàng, đơn giản việc quản lý đáng tin cậy Phương pháp nghiên cứu 3.1 Về mặt lý thuyết: - Tìm hiểu kỹ thuật lập trình , cách thức hoạt động đối tượng visual Stadio code - Hiểu cách thức hoạt động HTML CSS , JAVASCRIPT 3.2 Về mặt lập trình: - Sử dụng ngơn ngữ HTML CSS để xây dựng trang wed tĩnh Phạm vi , đối tượng đề tài Demo xây dựng wed bán mỹ phẩm , số hàng phụ kiện khác Trong thời đại phát triển , việc ứng dụng hoạt động “website bán hàng” mang lại nhiều ý nghĩa như: - Đỡ tốn thời gian cho người tiêu dung nhà quản lý việc tham giá hoạt động mua bán hàng - Giúp người tiêu dùng biết giá hình ảnh mặt hàng cách xác - Giúp nhà quản lý dễ dàng quản lý sản phẩm - Nhà quản lý thống kê sản phẩm bán chạy cách nhanh giúp cho hoạt động sản xuất kinh doanh trở nên tốt Ý nghĩa thực tiễn đề tài 5.1 Đối với người sử dụng hệ thống wedsite Có thể tra cứu ,thông tin sản phẩm , nhà sản xuất , thông tin khách hàng Mua sản phẩm dễ dàng , tốn , hàng hóa chất lượng , phục vụ tận tình từ nhân viên website Đối với cá nhân sinh viên Tạo demo Wedsite thân thiện , nhanh hiệu việc quản lý ,hay bán sản phẩm thủ công Hồn thành thực tập sở nâng cao trình độ thân Nội dung bao gồm có chương : Chương : Cơ sở lý thuyết Chương : Khảo sát,phân tích thiết kế hệ thống Chương : Xây dựng website CHƯƠNG CƠ SỞ LÝ THUYẾT 1.1 Tìm hiểu Website 1.1.1 Khái niệm Website Website tập hợp trang web (web pages) bao gồm văn bản, hình ảnh, video, flash ,…mà thường nằm tên miền (domain name) tên miền phụ (subdomain) Một trang wb bao gồm nhiều tệp tin HTLM XHTML thể truy nhập giao thức HTTP , HTTPS Website xây dựng từ tệp tin HTML(trang mạng tĩnh ) vận hành CMS chạy máy chủ ( trang mạng động) Website xây dựng nhiều ngôn ngữ khác : PHP, NET , JAVASCRIPT ,RUBY AND RAILS,… Hiện , để website vận hành mơi trường www, cần bắt buộc phải có phần : - Tên miền (Domain) - Hosting - Mã nguồn(Source code) 1.1.2 Phân loại Website Có loại wbsite : Website tĩnh Website động 1.1.2.1 Website tĩnh - Website tĩnh web bao gồm trang web tĩnh khơng có sở liệu kèm Tức người dùng khơng có khả tương tác , chỉnh sửa thay đổi liệu Ưu điểm : Thiết kế đồ hoạ đẹp Tốc độ truy cập nhanh Thân thiện với máy tìm kiếm (search engine) Chi phí đầu tư thấp Nhược điểm : Khó khăn việc thay đổi cập nhật thơng tin Thơng tin khơng có tính linh hoạt, khơng thân thiện với người dùng Khó tích hợp, nâng cấp, mở rộng 1.1.2.2 Website động - Website động web có sở liệu hỗ trợ phần mềm phát triển web , hệ thống quản lý nội dung nên người dùng chỉnh sửa thay đổi nội dung Thông tin hiển thị web động gọi sở liệu người dùng truy vấn tới tráng web - Web động phát triển ngơn ngữ lập trình PHP,ASP,ASP.net,Java,CGI ,Perl,… sử dụng sở liệu Access, My SQL , MS SQL , Oracle , DB2 Ưu điểm : Dễ dàng quản lý nội dung Dễ dàng nâng cấp bảo trì Tương tác với người sử dụng cao Có thể xây dựng web lớn Nhược điểm : Chi phí xây dựng tốn Cần có thêm nhân chuyên ngành 1.2 Tìm hiểu HTML 1.2.1 Tổng quan HTML HTML( HyperText Markup Language ) ngôn ngữ đánh dấu siêu văn thiết kế để tạo nên trang web với mẫu thơng tin trình bày World Wide Web HTML định nghĩa ứng dụng đơn giản SGML sử dụng tổ chức cần đến yêu cầu xuất phức tạp Tên gọi ngôn ngữ đáng dấu siêu văn có ý nghĩa sau: Đánh dấu(Markup): HTML ngôn ngữ thẻ đánh dấu(tag) Các thẻ xác định cách thức trình bày đoạn văn tương ứng hình Ngơn ngữ(Language): HTML ngơn ngữ tương tự ngơn ngữ lập trình, nhiên đơn giản Nó có cú pháp chặt chẽ để viết lệnh thực việc trình diễn văn Các từ khóa có ý nghĩa xác định cộng đồng Internet thừa nhận sử dụng lại Ví dụ b= bold, ul= unordered list,… Văn bản(Text): HTML trƣớc hết để trình bày văn dựa tảng văn Các thành phần khác nhƣ hình ảnh, âm thanh, hoạt hình gắn vào đoạn văn Siêu văn bản(HyperText): HTML cho phép liên kết nhiều trang văn Rải rác khắp nơi Internet Nó có tác dụng che dấu phức tạp Internet ngƣời sử dụng Người dùng Internet đọc văn mà không cần biết đến văn nằm đâu, hệ thống xây dựng phức tạp nào, HTML thực vượt ngồi khn khổ khái niệm văn cổ điền 1.2.2 Các khái niệm Trong HTML Định nghĩa Các thẻ HTML Thẻ : Tạo đầu mục trang Thẻ : Tạo tiêu đề trang tiêu đề, thẻ bắt buộc Thẻ title cho phép bạn trình bày chuỗi tựa đề trang Web trang Web duyệt trình duyệt Web Thẻ : Tất thơng tin khai báo thẻ xuất trang Web Những thơng tin nhìn thấy trang Web Các thẻ định dạng khác Thẻ…
:Tạo đoạn Thẻ : Thay đổi phơng chữ, kích cỡ màu kí tự… Ví dụ: 2.2.7.3 Biểu đồ hoạt động cho chức “Xoá sản phẩm giỏ hàng” 53 2.2.7.4 Biểu đồ hoạt động cho chức “Thêm sản phẩm” 54 2.2.7.5 Biểu đồ hoạt động cho chức “Xoá nhà cung cấp” 55 2.2.7.6 Biểu đồ hoạt động chức “Sửa thơng tin khách hàng” 56 2.2.7.7 Biểu đồ trình tự sửa thơng tin nhân viên 2.2.7.8 Biểu đồ trình tự thêm khách hàng 57 58 CHƯƠNG 3: XÂY DỰNG WEBSITE 3.1 Giao diện trang chủ 3.2 Form nhập thông tin địa 59 3.3 Giao diện đăng nhập 3.4 Giao diện đăng ký tài khoản 60 3.5 Giao diện sản phẩm deal hot 3.6 Giao diện sản phẩm 61 3.7 Giao diện sản phẩm trang điểm môi 3.8 Giao diện sản phẩm trang điểm mắt 62 3.9 Giao diện sản phẩm trang điểm mặt 3.10 Trang giỏ hàng 63 3.11 Thông tin cuối trang 64 KẾT LUẬN Kết đạt được: Hệ thống đáp ứng phần nhu cầu tin học hóa khâu quảng bá giới thiệu sản phẩm cho cửa hàng tiện lợi hơn, tiết kiệm thời gian hai bên mà hiệu khơng giảm Hệ thống có giao diện đơn giản theo xu hướng, gần gũi, thân thiện dễ sử dụng cho người quản trị khách hàng Hạn chế: Hệ thống cịn nhiều thiếu sót chức giao diện Khắc phục phát triển: Hồn thiện chức cịn thiếu chưa hồn chỉnh, chức cịn Tối ưu hóa code dễ cải thiện hiệu website Phát triển giỏ hàng để toán trực tuyến Tăng khả bảo mật chịu lỗi website Mở rộng thêm module/plugin ứng dụng, thực triển khai host, gán tên miền Để hoàn thành thực tập này, lần em xin chân thành cảm ơn thầy giáo, cô giáo, cảm ơn giúp đỡ bạn bè giúp em hoàn thành thực tập Em xin chân thành cảm ơn ! 65 TÀI LIỆU THAM KHẢO [1] Trang web http://w3schools.com [2] Các website bán hàng như: lazada.vn, sendo.vn, tiki.vn, thegioididong.com 66 NHẬN XÉT CỦA GIÁO VIÊN HƯỚNG DẪN Thái Nguyên, ngày… tháng… năm 2022 CHỮ KÝ GVHD 67
