Công Nghệ Thông Tin, it, phầm mềm, website, web, mobile app, trí tuệ nhân tạo, blockchain, AI, machine learning - Công Nghệ Thông Tin, it, phầm mềm, website, web, mobile app, trí tuệ nhân tạo, blockchain, AI, machine learning - Công nghệ thông tin
UBND TỈNH QUẢNG NAM TRƯỜNG ĐẠI HỌC QUẢNG NAM KHOA CÔNG NGHỆ THÔNG TIN ---------- PHẠM THIÊN LÝ THIẾT KẾ VÀ XÂY DỰNG WEBSITE QUẢN LÝ NHÀ HÀNG KHOÁ LUẬN TỐT NGHIỆP ĐẠI HỌC Quảng Nam, tháng 4 năm 2019 UBND TỈNH QUẢNG NAM TRƯỜNG ĐẠI HỌC QUẢNG NAM KHOA CÔNG NGHỆ THÔNG TIN ---------- KHÓA LUẬN TỐT NGHIỆP Tên đề tài: THIẾT KẾ VÀ XÂY DỰNG WEBSITE QUẢN LÝ NHÀ HÀNG Sinh viên thực hiện PHẠM THIÊN LÝ MSSV:2115031039 CHUYÊN NGÀNH: CÔNG NGHỆ THÔNG TIN KHÓA 2015 – 2019 Cán bộ hướng dẫn TS. VŨ ĐỨC QUẢNG MSCB: 1118 LỜI CÁM ƠN Để có được điều kiện thực hiện khóa luận tốt nghiệp cũng như hoàn thành chương trình học 4 năm tại trường Đại học Quảng Nam, em đã nhận được những sự chỉ dạy tận tình với những kinh nghiệm quý báu từ quý thầy cô trong trường Đại học Quảng Nam nói chung và trong khoa Công nghệ thông tin nói riêng. Em xin được gửi lời cảm ơn chân thành nhất đến: Ban giám hiệu cùng quý thầy cô trường Đai học Quảng Nam đã tạo cho em một môi trường học tập tích cực và vui vẻ. Quý thầy cô trong khoa công nghệ thông tin đã truyền dạy cho em những kiến thức chuyên môn quý báu sẽ là hành trang trong cuộc sống và công việc sau này. Thầy T.S Vũ Đức Quảng – Giảng viên khoa Công nghệ thông tin đã tận tình hướng dẫn, chỉ bảo, giúp đỡ em trong suốt quá trình thực hiện khóa luận. Gia đình và bạn bè đã luôn động viên và là chỗ dựa tinh thần vững chắc trong suốt thời gian qua, đã tạo cho em niềm tin, động lực để vượt qua những khó khăn trong quá trình thực hiện khóa luận. Mục Lục Phần 1. MỞ ĐẦU........................................................................................... 1 1.1. Lý do chọn đề tài.................................................................................. 1 1.2. Mục tiêu của đề tài ............................................................................... 2 1.3. Đối tượng và phạm vi nghiên cứu ........................................................ 2 1.4. Phương pháp nghiên cứu: ..................................................................... 2 1.5. Đóng góp của đề tài ............................................................................. 2 1.6. Cấu trúc đề tài: Gồm 3 chương............................................................. 2 Phần 2. NỘI DUNG NGHIÊN CỨU .............................................................. 4 Chương 1: CƠ SỞ LÝ THUYẾT ................................................................... 4 1.1. Tìm hiểu lập trình Website ................................................................... 4 1.1.1. Lập trình Front-end: ....................................................................... 4 1.1.2. Lập trình Back-end: ....................................................................... 5 1.2. Ngôn ngữ lập trình Fontend: ................................................................ 6 1.2.1. Tìm hiểu về HTML5 ...................................................................... 6 1.2.2 Tìm hiểu CSS ............................................................................... 10 1.2.2.1. Tác dụng của CSS ................................................................. 10 1.3.2.2. Sử dụng CSS: Có 3 cách để sử dụng CSS. ............................. 11 1.2.2.5. Cú pháp ................................................................................. 11 1.2.2.4. CSS Selector .......................................................................... 12 1.2.3. Ngôn ngữ kịch bản Java script ..................................................... 12 1.2.3.1. Vị trí JavaScript trong HTML................................................ 14 1.2.3.2. Các câu lệnh trong JavaScript ................................................ 15 1.2.3.3. Các chương trình JavaScript .................................................. 15 1.2.3.4. Dấu chấm phẩy ...................................................................... 15 1.2.2.2.5. Chiều dài dòng và dòng ngắt của JavaScript ....................... 16 1.2.3.6. Khối mã JavaScript................................................................ 16 1.2.3.7. Từ khoá JavaScript ................................................................ 16 1.3.4. JQuery ........................................................................................ 17 1.3. Ngôn ngữ lập trình Back-end: ............................................................ 17 1.3.1. Một số ngôn ngữ lập trình Back-end ............................................ 17 1.4.2. Lập trình web bằng Node JS ........................................................ 20 1.4.2.1. Tìm hiểu Node Js ................................................................... 20 1.3.2.2. Framework Express ............................................................... 23 1.4. Tìm hiểu cơ sở dữ liệu Postgresql ...................................................... 25 1.4.1. Giới Thiệu postgress: ................................................................... 25 1.4.2. Ưu điểm: ...................................................................................... 25 1.4.3. Nhược điểm: ................................................................................ 26 1.4.4. Các kiểu dữ liệu và cấu trúc: ........................................................ 26 1.5. Kết luận chương 1 .............................................................................. 28 Chương 2: XÂY DỰNG WEBSITE QUẢN LÝ NHÀ HÀNG ..................... 29 2.1. Bài toán thực tế .................................................................................. 29 2.1.1. Khảo sát thực tế ........................................................................... 29 2.1.1.1. Giới thiệu về hệ thống cũ ....................................................... 29 2.1.1.2. Giới thiệu về hệ thống mới .................................................... 29 2.1.1.3. Phạm vi dự án ........................................................................ 30 2.1.2. Tìm hiểu môi trường hệ thống...................................................... 30 2.2. Phân tích hệ thống .............................................................................. 31 2.2.1. Đặc tả yêu cầu .............................................................................. 31 2.2.2. Xác định actor .............................................................................. 33 Các tác nhân chính: ...................................................................... 33 2.2.3. Đặc tả use care ............................................................................. 34 2.2.4. Sơ đồ object ................................................................................. 38 2.2.5. Biểu đồ tương tác ......................................................................... 40 2.2.5.1. Biểu đồ tuần tự UCDangnhap.............................................. 40 2.2.5.2. Biểu đồ cộng tác UCDangnhap ........................................... 40 2.2.5.3. Biểu đồ tuần tự UCBansp .................................................... 41 2.2.5.4. Biểu đồ cộng tác UCBansp .................................................. 41 2.2.5.5. Biểu đồ tuần tự UCNhapnvl ................................................. 42 2.2.5.6. Biểu đồ cộng tác UCNhapnvl............................................... 42 2.2.5.7. Biểu đồ tuần tự UCThanhtoan ............................................. 43 2.2.5.8. Biểu đồ cộng tác UCThanhtoan ........................................... 43 2.2.5.9. Biểu đồ tuần tự UCThongke................................................. 44 2.2.5.10. Biểu đồ cộng tác UCThongke ............................................ 44 2.2.5.11. Biểu đồ tuần tự UCTimkiem ............................................... 45 2.2.5.12. Biểu đồ cộng tác UCTimkiem ............................................ 45 2.2.5.13. Biểu đồ tuần tự UCCapnhatsp ........................................... 46 2.2.5.14. Biểu đồ tuần tự UCCapnhatsp ........................................... 46 2.2.6. Biểu đồ trạng thái......................................................................... 47 a. Nhà cung cấp .................................................................................. 47 b. Hóa đơn .......................................................................................... 47 c. Phiếu nhập ...................................................................................... 47 d. Nhân viên ....................................................................................... 47 e. Món ................................................................................................ 48 f. Nguyên vật liệu ............................................................................... 48 g. Khách hàng .................................................................................... 48 h. Kho ................................................................................................ 49 i. Bàn.................................................................................................. 49 k. Tài khoản-User ............................................................................... 49 2.2.7. Biểu đồ lớp .................................................................................. 50 2.3. Thiết kế cơ sỡ dữ liệu: ........................................................................ 50 2.3.1. Login(Đăng Nhập).................................................................... 50 2.3.2. Nhanvien(Nhân Viên)............................................................... 50 2.3.3. khachhang(Khách Hàng) .......................................................... 51 2.3.4. ncc(Nhà Cung Cấp) .................................................................. 51 2.3.5. nl(Nguyên liệu) ........................................................................ 51 2.3.6. sanpham(Món) ......................................................................... 52 2.3.7. Ban(Bàn) .................................................................................. 52 2.3.8. hoadon(Hóa Đơn) ..................................................................... 52 2.3.9. phieunhap(Phiếu Nhập) ............................................................ 53 2.4. Kết luận chương 2 .............................................................................. 53 Chương 3: DEMO CHƯƠNG TRÌNH ......................................................... 54 3.1. Giới thiệu Website quản lý nhà hàng Trầu Cau .................................. 54 3.2. Hướng dẫn cài đặt .............................................................................. 55 3.2.1. Cài đặt trên máy Client ................................................................ 55 3.2.2. Cài đặt trên máy Server................................................................ 57 3.2.2.1 Cài đặt NodeJS ....................................................................... 57 3.2.2.2. Cài đặt Postgresql .................................................................. 59 3.3. Demo Website quản lý nhà hàng Trầu cau ......................................... 64 3.3.1. Đối với quản lý ............................................................................ 64 3.3.2. Khách Hàng. ................................................................................ 67 3.4. Kết luận chương 3 .............................................................................. 68 Phần 3. KẾT LUẬN VÀ KIẾN NGHỊ ......................................................... 69 1. Kết luận ................................................................................................ 69 2. Kiến nghị .............................................................................................. 69 Phần 4. TÀI LIỆU THAM KHẢO ............................................................... 70 Danh Mục Hình Ảnh Hình 2.1. Sơ đồ usecase QL nhà hàng............................................................................. 37 Hình 2. 2. Biểu đồ tuần tự UCDangnhap....................................................................... 40 Hình 2.3. Biểu đồ cộng tác UCDangnhap ..................................................................... 40 Hình 2.4. Biểu đồ tuần tự UCBansp .............................................................................. 41 Hình 2.5. Biểu đồ cộng tác UCBansp ............................................................................ 41 Hình 2.6. Biểu đồ tuần tự UCNhapnvl .......................................................................... 42 Hình 2.7. Biểu đồ cộng tác UCNhapnvl ........................................................................ 42 Hình 2.8. Biểu đồ tuần tự UCThanhtoan ....................................................................... 43 Hình 2.9. Biểu đồ cộng tác UCThanhtoan ..................................................................... 43 Hình 2.10. Biểu đồ tuần tự UCThongke ........................................................................ 44 Hình 2.11. Biểu đồ cộng tác UCThongke...................................................................... 44 Hình 2.12. Biểu đồ tuần tự UCTimkiem ...................................................................... 45 Hình 2.13. Biểu đồ cộng tác tìm kiếm ............................................................................. 45 Hình 2.14. Biểu đồ tuần tự UCCapnhatsp ..................................................................... 46 Hình 2.15. Biểu đồ cộng tác UCcapnhatsp .................................................................... 46 Hình 2.16. Biểu đồ trạng thái nhà cung cấp..................................................................... 47 Hình 2.17. Biểu đồ trạng thái hóa đơn ............................................................................ 47 Hình 2.18. Biểu đồ trạng thái phiếu nhập ........................................................................ 47 Hình 2.19. Biểu đồ trạng thái nhân viên .......................................................................... 47 Hình 2.20. Biểu đồ trạng thái món .................................................................................. 48 Hình 2.21. Biểu đồ trạng thái món .................................................................................. 48 Hình 2.22. Biểu đồ trạng thái khách hàng ....................................................................... 48 Hình 2.23. Biểu đồ trạng thái kho ................................................................................... 49 Hình 2.24. Biểu đồ trạng thái bàn ................................................................................... 49 Hình 2.25. Biểu đồ trạng thái user .................................................................................. 49 Hình 2.26. Nhanvien ...................................................................................................... 50 Hình 3.1. Website nhà hàng Trầu Cau ............................................................................. 54 Hình 3.2. Website nhà hàng ............................................................................................ 64 Hình 3.3. Đăng nhập với tài khoản admin ....................................................................... 64 Hình 3.4. Trang quản lý .................................................................................................. 65 Hình 3.5. Thêm dữ liệu mới ............................................................................................ 65 Hình 3.7. Xóa dữ liệu ..................................................................................................... 66 Hình 3.8. Trang thống kê báo cáo .................................................................................... 67 . Danh Mục Bảng Bảng 1.1.Các thẻ trong HTML ......................................................................................... 7 Bảng 1.2. Các từ khóa trong Javascript ........................................................................... 16 Bảng 1.3. Kích thước dữ liệu trong postgresql ................................................................ 27 Bảng 2.1. Login .............................................................................................................. 50 Bảng 2.2. Nhân Viên ...................................................................................................... 50 Bảng 2.3. Khách Hàng.................................................................................................... 51 Bảng 2.4. Nhà Cung Cấp ................................................................................................ 51 Bảng 2.5. Nguyên liệu .................................................................................................... 51 Bảng 2.6. Món ................................................................................................................ 52 Bảng 2.2. Nhanvien ........................................................................................................ 52 Bảng 2.8. Phiếu Nhập ..................................................................................................... 53 DANH MỤC CÁC KÝ HIỆU, CÁC TỪ VIẾT TẮT Từ viết tắt Ký hiệu Tiếng Việt Tiếng Anh CSDL Cơ sở dữ liệu Database CSS Tập tin định kiểu theo tầng Cascading Style Sheets CRM Quản lý quan hệ khách hàng Customer Relationship Management CNTT Công nghệ thông tin Information Technology DOM Mô hình các đối tượng trong tài liệu HTML Document Object Model HTML Ngôn ngữ đánh dấu siêu văn bản HyperText Markup Language PHP Xử lý siêu văn bản HyperText Preprocessor TCPIP Giao thức mạng Transmission Control ProtocolInternet Protocol SPA Một ứng dụng web giúp nâng cao trải nghiệm người dùng Single page Application API Giao diện lập trình ứng dụng Application Programming Interface UC Trường hợp sử dụng Use Case 1 Phần 1. MỞ ĐẦU 1.1. Lý do chọn đề tài Ngày nay, ứng dụng công nghệ thông tin và việc tin học hóa được xem là một trong những yếu tố mang tính quyết định sự thành công trong hoạt động của các chính phủ, tổ chức, cũng như của các công ty, các cá nhân, doanh nghiệp. Nó đóng vai trò hết sức quan trọng, có thể tạo ra những bước đột phá mạnh mẽ. Đặt biệt trong thời đại công nghệ hóa như hiện nay, khi mà internet đã đến từng nhà thì việc ứng dụng nó để phục vụ cho nhu cầu của chúng ta là thật sự cần thiết. Việc xây dựng các trang web để phục vụ cho các nhu cầu riêng của các tổ chức, công ty thậm chí các cá nhân, ngày nay, không lấy gì quá phức tạp. Với một vài thao tác đơn giản, một người bất kì có thể trở thành chủ của một website giới thiệu về bất cứ gì mình quan tâm, giới thiệu và quảng bá hình ảnh của công ty, giới thiệu về bản thân và gia đình, hay giúp quản lý một công việc nào đó. Đối với các chính phủ và các doanh nghiệp thì việc xây dựng các website riêng càng ngày càng trở nên cấp thiết. Thông qua những website này, thông tin về họ cũng như các công văn, thông báo, quyết định của chính phủ hay các món, dịch vụ mới của công ty sẽ đến với những người quan tâm, đến với khách hàng của họ một cách nhanh chóng kịp thời hoặc quản lý hoạt động doanh nghiệp một cách nhiệp nhàng, tránh những phiền hà mà phương thức giao tiếp truyền thống thường gặp phải. Để cạnh tranh với đối thủ của mình, các doanh nghiệp phải tận dụng mọi khía cạnh. Một yếu tố nhỏ cũng đóng vai trò vô cùng lớn, mà việc sở hữu một website riêng là một yếu tố quan trọng trong đó. Vì thế mà nhu cầu có một website cho doanh nghiệp là rất lớn. Với nhu cầu như vậy thì chúng ta lại cần phải có một trang web chuyên nghiệp để cung cấp dịch vụ, quản lý cho những khách hàng có nhu cầu. Với lý do đó em chọn đề tài: “Thiết kế và xây dựng Website quản lý nhà hàng”. 2 1.2. Mục tiêu của đề tài Hiểu được cách lập trình, thiết kế một website quản lý. Tìm hiểu được các ngôn ngữ lập trình NODE JS, HTML, CSS và javascript. Biết cách sử dụng thành thạo các ngôn ngữ lập trình để tạo một website. Từ đó tạo được một website quản lý cho nhà hàng đáp ứng được các nhu cầu quản lý của nhà hàng. 1.3. Đối tượng và phạm vi nghiên cứu - Các ngôn ngữ lập trình web: Ngôn ngữ HTML, Ngôn ngữ CSS, Ngôn ngữ Javascript, Cơ sỡ dữ liệu postgresql, Node Js và các framework liên quan. - Các hoạt động quản lý của nhà hàng Trầu Cau 1.4. Phương pháp nghiên cứu: - Phương pháp quan sát - Phương pháp phỏng vấn - Phương pháp thực nghiệm 1.5. Đóng góp của đề tài Giúp mọi người hiểu rõ ngôn ngữ lập trình web hơn, cách lập trình web. Qua đó có thể biết cách sử dụng chúng xây dựng một trang web riêng cho bản thân hoặc cho công việc của mình. Website là công cụ giúp nhà hàng Trầu Cau quản lý được các hoạt động của mình một cách dễ dàng, thuận tiện hơn. Giúp giảm chi phí hoạt động, tăng thu nhập cho nhà hàng. 1.6. Cấu trúc đề tài: Gồm 3 chương Chương 1: CƠ SỞ LÝ THUYẾT - Nghiên cứu sự hình thành và phát triển của các ngôn ngữ lập trình: Nodejs, HTML, Javascript, sql, css... Qua đó thấy được vai trò của các ngôn ngữ lập trình đó trong ngành lập trình web. Chương 2: XÂY DỰNG WEBSITE QUẢN LÝ NHÀ HÀNG - Nghiên cứu hoạt động của nhà hàng Trầu Cau, kết hợp với yêu cầu của nhà hàng xây dựng web quản lý trực tuyến cho nhà hàng. 3 Chương 3: GIỚI THIỆU, DEMO CHƯƠNG TRÌNH - Giới thiệu website quản lý nhà hàng, cách sử dụng và chạy demo website. 4 Phần 2. NỘI DUNG NGHIÊN CỨU Chương 1: CƠ SỞ LÝ THUYẾT 1.1. Tìm hiểu lập trình Website Xây dựng một website cần nhiều công đoạn khác nhau phối hợp với nhau mới có thể tạo nên một trang Website hoàn chỉnh. Chẳng hạn như sắp xếp bố cục, chỉnh sửa hình ảnh, xử lý sự kiện… Nhưng nói chung thì lập trình web gồm 2 phần chính là Front-end và Back-end. 1.1.1. Lập trình Front-end: Front-end là gì, là bộ phận phần giao diện hiển thị ra thiết bị Clients. Hay nói một cách khách Front-end chính là bộ mặt của một website. Front-end thiết kế tạo ra phần giao diện cho người dùng tương tác với trang web, là ấn tượng đầu tiên của người dùng về trang web đó. Trước khi internet băng thông rộng (khoảng trước 2007) cùng với các thiết bị được phát triển mạnh mẽ như hiện nay Front-end thực sự đóng vai trò rất hạn chế trong việc hiển thị giao diện cho người dùng, lúc đó nhu cầu thực tế là làm sao cho một ứng dụng hiển thị là đủ. Bên cạnh đó phải làm sao cho Performance (hiệu suất) đạt hiệu quả cao để người dùng không cảm thấy delay (giật) hay load (tải) chậm là đạt. Điều này cũng dễ hiểu vì khi đó tốc độ internet là cực thấp khi mà đa số người dùng chỉ tiếp cận được với Internet dial-up, với tốc độ “rùa bò" của nó thì việc tải về văn bản thôi đã vất vả rồi chứ không nói đến hình ảnh hay animation.... Sau một thời gian công nghệ dần hiện đại hơn với nhưng ADSL, DSL, VPN... đó cũng là lúc nhu cầu về một Website thẩm mỹ được đặt ra với những hình ảnh tuyệt đẹp cùng với những hiệu ứng bắt mắt bắt đầu được chú trọng. Lúc này vai trò của Front-end cũng bắt đầu được chú trọng. Nhưng điều bất cập ở đây là sự không thông hiểu nhau giữa Designer và Front-end thường xuyên xảy ra từ thảo luận tới gay gắt mà nếu chúng ta từng ở một trong hai vị trí này sẽ thấu hiểu. Vấn đề là ở chỗ một Designer thiết kế ra giao diện và anh ta muốn chỗ nút (button) đó khi hover sẽ đổi màu, hay khi open web lên sẽ có hàng chục hiệu ứng hiện ra mà không thể nào diễn đạt bằng hình ảnh được. Điều anh ta cần làm là diễn giải ý tưởng của mình cho Front-end hiểu nhưng mọi thứ đâu dễ vậy. Sự bất đồng không 5 chỉ dừng lại ở đó khi mà HTML5 và CSS3 ra đời kéo theo sự bùng nổ công nghệ Resposive (tương thích trên mobiletablet) làm cho việc thiết kế Layout nhiều hơn và Front-end đôi khi gặp bế tắc với những giao diện khó khi thực hiện Responsive. Cho đến khoảng những năm gần đây, khi công nghệ phát triển Internet trở nên nhanh hơn, những bộ vi xử lý mạnh mẽ hơn cũng với những công cụ hỗ trợ ngày càng nhiều thì Front-end dần khắc phục được những yếu điểm của mình dần trở thành một phần quan trọng không thể thiếu của một Website. Tất cả mọi thứ chúng ta đang nhìn thấy trên trang web ngày nay đều có thể được thực hiện bởi một lập trình viên Front-end. Một designer tạo ra logo và đồ họa, một photographer cung cấp hình ảnh, một copywriter viết nội dung. Nhưng một lập trình viên Front-end kết hợp tất cả những mảnh ghép đó lại và chuyển nó thành ngôn ngữ web, và tạo ra trải nghiệm mà chúng ta có khi duyệt qua mỗi trang. Để lấy một ví dụ cụ thể, khi chúng ta cuộn con chuột lên xuống ở trang chủ của website Udacity. Chúng ta có thể để ý thấy rằng chữ "U" biến mất rồi xuất hiện trở lại không? Đó là tác phẩm của một lập trình viên Front-end. Nói chung, một lập trình viên Front-end chịu trách nhiệm cho thiết kế nội thất của một ngôi nhà đã được xây dựng bởi một lập trình viên Back-end. Các hương vị và phong cách trang trí được quyết định bởi chủ nhà. Xét về ngôn ngữ lập trình Front-end thì có 3 loại chính: HTML, CSS, và ngôn ngữ lập trình JavaScript. Để lập trình Front-end tốt thì nhất thiết phải biết 3 ngôn ngữ này, kèm theo đó là một số framework thông dụng Bootstrap, Foundation, AngularJS và các thư viện như jQuery và LESS. 1.1.2. Lập trình Back-end: Front-end thật sự rất quan trọng nhưng điều gì giúp phần Front-end của một trang web có thể hoạt động được, dữ liệu để hiển thị trên trang web nằm ở đâu, xử lí như thế nào. Đó là phần việc của back end. Phần back end của một trang web bao gồm một máy chủ, một ứng dụng, và một cơ sở dữ liệu. Một lập trình viên Back- end xây dựng và duy trì công nghệ mà sức mạnh của những thành phần đó, cho phép phần giao diện người dùng của trang web có thể tồn tại được. Back-end xử lý các công việc từ phía server bao gồm lấy dữ liệu từ người dùng tương tác với trang web đưa vào cơ sở dữ liệu và ngược lại. Cụ thể là cần truy 6 xuất phần thông tin database, xử lý thông tin đó và sẽ ghi xuống database, gửi trả về cho client những thông tin sau khi xử lý xong. Back-end là một công việc thầm lặng mà không thể thiếu của một website. Những công việc Back-end xử lý điều được thực hiện ngầm, nghĩa là khi một người sử dụng họ chỉ thấy được hình ảnh, thông tin, kết quả trả về mà không thể thấy quá trình tạo ra kết quả đó. Back-end thật sự rất quan trọng đối với website, một trang web không thể tồn tại nếu thiếu nó. Ngay từ khi hình thành thì Back-end được chú trọng nhất trong trang web, hơn cả front-end. Nếu Front-end là lớp võ bên ngoài thì Back-end chính là phần ruột bên trong. Để khiến cho máy chủ, ứng dụng, và cơ sở dữ liệu có thể giao tiếp được với nhau, các lập trình viên Back-end sử dụng các ngôn ngữ server-side như PHP, Ruby, Python, Java và .Net để xây dựng một ứng dụng, và các công cụ như MySQL, Oracle, và SQL Server để tìm kiếm, lưu trữ, hoặc thay đổi dữ liệu và phục vụ trở lại tới người dùng trong phần front-end. Các công việc tuyển dụng lập trình viên Back-end cũng thường yêu cầu kinh nghiệm về các framework PHP như Zend, Symfony, và CakePHP; có kinh nghiệm với các phần mềm quản lý phiên bản như SVN, CVS, hoặc Git; và kinh nghiệm với Linux trong việc phát triển và triển khai hệ thống. 1.2. Ngôn ngữ lập trình Fontend: 1.2.1. Tìm hiểu về HTML5 HTML là chữ viết tắt của HyperText Markup Language, có nghĩa là ngôn ngữ đánh dấu siêu văn bản. Nó dùng để định dạng bố cục, các thuộc tính liên quan đến cách hiển thị của một đoạn text và được hiển thị trên một chương trình đặc biệc ta gọi là Browser. Hiện nay có khá nhiều Browser như Chrome, Firefox, Cốc Cốc, Microsoft Edge,.. Tất cả Browser đều có điểm chung là hiển thị và giúp người dùng thao tác với website và nó đều có khả năng biên dịch những đoạn mã HTML, CSS và Javascript. 7 Với HTML, chúng ta có thể: - Điều khiển hình thức và nội dung của trang - Xuất bản các tài liệu trực tuyến và truy xuất thông tin trực tuyến bằng cách sử dụng các liên kết được chèn vào tài liệu html - Tạo các biểu mẫu trực tuyến để thu thập thông tin về người dùng, quản lý các giao dịch.... - Chèn các đối tượng như audio clip, video clip, các thành phần ActiveX, Flash và các Java Applet vào tài liệu html. Xét về cấu trúc một html gồm 3 phần cơ bản: - Phần HTML: Mọi tài liệu html phải bắt đầu bằng thẻ mở html và kết thúc bằng thẻ đóng html . Thẻ html báo cho trình duyệt biết nội dung giữa hai thẻ này là một tài liệu html. - Phần tiêu đề: Phần tiêu đề bắt đầu bằng thẻ và kết thúc bởi thẻ . Phần này chứa tiêu đề mà được hiển thị trên thanh điều hướng của trang Web. Tiêu đề nằm trong thẻ title, bắt đầu bằng thẻ và kết thúc là thẻ . Tiêu đề là phần khá quan trọng. Khi người dùng tìm kiếm thông tin, tiêu đề của trang Web cung cấp từ khóa chính yếu cho việc tìm kiếm. - Phần thân: phần này nằm sau phần tiêu đề. Phầ̀n thân bao gồm văn bản, hình ảnh và các liên kết mà chúng ta muốn hiển thị trên trang web của mình. Phần thân bắt đầu bằng thẻ và kết thúc bằng thẻ . Ngoài ra nó còn nhiều cặp thẻ chức năng khác như: Bảng 1.1.Các thẻ trong HTML Thẻ Mô tả Định nghĩa một bình luận, được dùng để comment phần code html Xác định loại tài liệu Định nghĩa một siêu liên kết Định nghĩa thông tin liên lạc cho các tác giả chủ sở hữu của một tài liệu 8 Định nghĩa vùng bên trong của một ánh xạ hình ảnh Định nghĩa một bài báo Xác định nội dung nằm bên cạnh nội dung của trang Thẻ định nghĩa nội dung âm thanh Thẻ định nghĩa chữ in đậm Định nghĩa thân của tài liệu Định nghĩa một ngắt dòng đơn Định nghĩa một nút bấm Được sử dụng để vẽ đồ họa, thông qua một ngôn ngữ script (thường là JavaScript) Định nghĩa một chú thích trong bảng Định nghĩa một đoạn mã máy tính Định nghĩa một hộp thoại hoặc một cửa sổ Định nghĩa một phần trong một tài liệu Nhóm liên nhóm các phần tử liên quan trong form Định nghĩa phần footer cho một tài liệu hoặc một đoạn Định nghĩa một form HTML cho người dùng nhập vào to Định nghĩa tiêu đề HTML Xác định các thông tin về tài liệu Định nghĩa một tiêu đề cho một tài liệu hoặc phần Định nghĩa gốc của một tài liệu HTML Định nghĩa một khung nội tuyến Thẻ định nghĩa một hình ảnh 9 Định nghĩa một control nhập dữ liệu Định nghĩa khoá mã hoá đi kèm với một trường trong form Định nghĩa một nhãn cho một phần tử Định nghĩa một chú thích cho một phần tử Định nghĩa một đoạn văn Định nghĩa văn bản định dạng sẵn Định nghĩa dấu nháy kép xung quoanh phần văn bản Định nghĩa một kịch bản phía máy khách Định nghĩa một phần trong một tài liệu Định nghĩa một danh sách drop-down Định nghĩa các nguồn đa phương tiện cho các phần tử đa phương tiên như và Định nghĩa một phần trong một tài liệu Định nghĩa văn bản in đậm, ý nghĩa nhấn mạnh độ quan trọng Định nghĩa định kiểu cho một tài liệu 10 Định nghĩa văn bản giống như chỉ số dưới Định nghĩa một bảng Nhóm các thên nội dung trong một bảng Định nghĩa một ô trong một bảng Định nghĩa một ô nhập dữ liệu văn bản có nhiều dòng Nhóm các nội dung tiêu đề trong một bảng Định nghĩa một tiêu đề cho tài liệu Định nghĩa một hàng trong một bảng 1.1 Tìm hiểu lập trình Website Xây dựng một website cần nhiều công đoạn khác nhau phối hợp với nhau mới có thể tạo nên một trang Website hoàn chỉnh Chẳng hạn như sắp xếp bố cục, chỉnh sửa hình ảnh, xử lý sự kiện… Nhưng nói chung thì lập trình web gồm 2 phần chính là Front-end và Back-end Front-end là gì, là bộ phận phần giao diện hiển thị ra thiết bị Clients Hay nói một cách khách Front-end chính là bộ mặt của một website Front-end thiết kế tạo ra phần giao diện cho người dùng tương tác với trang web, là ấn tượng đầu tiên của người dùng về trang web đó Trước khi internet băng thông rộng (khoảng trước 2007) cùng với các thiết bị được phát triển mạnh mẽ như hiện nay Front-end thực sự đóng vai trò rất hạn chế trong việc hiển thị giao diện cho người dùng, lúc đó nhu cầu thực tế là làm sao cho một ứng dụng hiển thị là đủ Bên cạnh đó phải làm sao cho Performance (hiệu suất) đạt hiệu quả cao để người dùng không cảm thấy delay (giật) hay load (tải) chậm là đạt Điều này cũng dễ hiểu vì khi đó tốc độ internet là cực thấp khi mà đa số người dùng chỉ tiếp cận được với Internet dial-up, với tốc độ “rùa bò" của nó thì việc tải về văn bản thôi đã vất vả rồi chứ không nói đến hình ảnh hay animation Sau một thời gian công nghệ dần hiện đại hơn với nhưng ADSL, DSL, VPN đó cũng là lúc nhu cầu về một Website thẩm mỹ được đặt ra với những hình ảnh tuyệt đẹp cùng với những hiệu ứng bắt mắt bắt đầu được chú trọng Lúc này vai trò của Front-end cũng bắt đầu được chú trọng Nhưng điều bất cập ở đây là sự không thông hiểu nhau giữa Designer và Front-end thường xuyên xảy ra từ thảo luận tới gay gắt mà nếu chúng ta từng ở một trong hai vị trí này sẽ thấu hiểu Vấn đề là ở chỗ một Designer thiết kế ra giao diện và anh ta muốn chỗ nút (button) đó khi hover sẽ đổi màu, hay khi open web lên sẽ có hàng chục hiệu ứng hiện ra mà không thể nào diễn đạt bằng hình ảnh được Điều anh ta cần làm là diễn giải ý tưởng của mình cho Front-end hiểu nhưng mọi thứ đâu dễ vậy Sự bất đồng không Xây dựng một website cần nhiều công đoạn khác nhau phối hợp với nhau mới có thể tạo nên một trang Website hoàn chỉnh Chẳng hạn như sắp xếp bố cục, chỉnh sửa hình ảnh, xử lý sự kiện… Nhưng nói chung thì lập trình web gồm 2 phần chính là Front-end và Back-end Front-end là gì, là bộ phận phần giao diện hiển thị ra thiết bị Clients Hay nói một cách khách Front-end chính là bộ mặt của một website Front-end thiết kế tạo ra phần giao diện cho người dùng tương tác với trang web, là ấn tượng đầu tiên của người dùng về trang web đó Trước khi internet băng thông rộng (khoảng trước 2007) cùng với các thiết bị được phát triển mạnh mẽ như hiện nay Front-end thực sự đóng vai trò rất hạn chế trong việc hiển thị giao diện cho người dùng, lúc đó nhu cầu thực tế là làm sao cho một ứng dụng hiển thị là đủ Bên cạnh đó phải làm sao cho Performance (hiệu suất) đạt hiệu quả cao để người dùng không cảm thấy delay (giật) hay load (tải) chậm là đạt Điều này cũng dễ hiểu vì khi đó tốc độ internet là cực thấp khi mà đa số người dùng chỉ tiếp cận được với Internet dial-up, với tốc độ “rùa bò" của nó thì việc tải về văn bản thôi đã vất vả rồi chứ không nói đến hình ảnh hay animation Sau một thời gian công nghệ dần hiện đại hơn với nhưng ADSL, DSL, VPN đó cũng là lúc nhu cầu về một Website thẩm mỹ được đặt ra với những hình ảnh tuyệt đẹp cùng với những hiệu ứng bắt mắt bắt đầu được chú trọng Lúc này vai trò của Front-end cũng bắt đầu được chú trọng Nhưng điều bất cập ở đây là sự không thông hiểu nhau giữa Designer và Front-end thường xuyên xảy ra từ thảo luận tới gay gắt mà nếu chúng ta từng ở một trong hai vị trí này sẽ thấu hiểu Vấn đề là ở chỗ một Designer thiết kế ra giao diện và anh ta muốn chỗ nút (button) đó khi hover sẽ đổi màu, hay khi open web lên sẽ có hàng chục hiệu ứng hiện ra mà không thể nào diễn đạt bằng hình ảnh được Điều anh ta cần làm là diễn giải ý tưởng của mình cho Front-end hiểu nhưng mọi thứ đâu dễ vậy Sự bất đồng không 5 chỉ dừng lại ở đó khi mà HTML5 và CSS3 ra đời kéo theo sự bùng nổ công nghệ Resposive (tương thích trên mobile/tablet) làm cho việc thiết kế Layout nhiều hơn và Front-end đôi khi gặp bế tắc với những giao diện khó khi thực hiện Responsive Cho đến khoảng những năm gần đây, khi công nghệ phát triển Internet trở nên nhanh hơn, những bộ vi xử lý mạnh mẽ hơn cũng với những công cụ hỗ trợ ngày càng nhiều thì Front-end dần khắc phục được những yếu điểm của mình dần trở thành một phần quan trọng không thể thiếu của một Website Tất cả mọi thứ chúng ta đang nhìn thấy trên trang web ngày nay đều có thể được thực hiện bởi một lập trình viên Front-end Một designer tạo ra logo và đồ họa, một photographer cung cấp hình ảnh, một copywriter viết nội dung Nhưng một lập trình viên Front-end kết hợp tất cả những mảnh ghép đó lại và chuyển nó thành ngôn ngữ web, và tạo ra trải nghiệm mà chúng ta có khi duyệt qua mỗi trang Để lấy một ví dụ cụ thể, khi chúng ta cuộn con chuột lên xuống ở trang chủ của website Udacity Chúng ta có thể để ý thấy rằng chữ "U" biến mất rồi xuất hiện trở lại không? Đó là tác phẩm của một lập trình viên Front-end Nói chung, một lập trình viên Front-end chịu trách nhiệm cho thiết kế nội thất của một ngôi nhà đã được xây dựng bởi một lập trình viên Back-end Các hương vị và phong cách trang trí được quyết định bởi chủ nhà Xét về ngôn ngữ lập trình Front-end thì có 3 loại chính: HTML, CSS, và ngôn ngữ lập trình JavaScript Để lập trình Front-end tốt thì nhất thiết phải biết 3 ngôn ngữ này, kèm theo đó là một số framework thông dụng Bootstrap, Foundation, AngularJS và các thư viện như jQuery và LESS Front-end thật sự rất quan trọng nhưng điều gì giúp phần Front-end của một trang web có thể hoạt động được, dữ liệu để hiển thị trên trang web nằm ở đâu, xử lí như thế nào Đó là phần việc của back end Phần back end của một trang web bao gồm một máy chủ, một ứng dụng, và một cơ sở dữ liệu Một lập trình viên Back- end xây dựng và duy trì công nghệ mà sức mạnh của những thành phần đó, cho phép phần giao diện người dùng của trang web có thể tồn tại được Back-end xử lý các công việc từ phía server bao gồm lấy dữ liệu từ người dùng tương tác với trang web đưa vào cơ sở dữ liệu và ngược lại Cụ thể là cần truy 6 xuất phần thông tin database, xử lý thông tin đó và sẽ ghi xuống database, gửi trả về cho client những thông tin sau khi xử lý xong Back-end là một công việc thầm lặng mà không thể thiếu của một website Những công việc Back-end xử lý điều được thực hiện ngầm, nghĩa là khi một người sử dụng họ chỉ thấy được hình ảnh, thông tin, kết quả trả về mà không thể thấy quá trình tạo ra kết quả đó Back-end thật sự rất quan trọng đối với website, một trang web không thể tồn tại nếu thiếu nó Ngay từ khi hình thành thì Back-end được chú trọng nhất trong trang web, hơn cả front-end Nếu Front-end là lớp võ bên ngoài thì Back-end chính là phần ruột bên trong Để khiến cho máy chủ, ứng dụng, và cơ sở dữ liệu có thể giao tiếp được với nhau, các lập trình viên Back-end sử dụng các ngôn ngữ server-side như PHP, Ruby, Python, Java và Net để xây dựng một ứng dụng, và các công cụ như MySQL, Oracle, và SQL Server để tìm kiếm, lưu trữ, hoặc thay đổi dữ liệu và phục vụ trở lại tới người dùng trong phần front-end Các công việc tuyển dụng lập trình viên Back-end cũng thường yêu cầu kinh nghiệm về các framework PHP như Zend, Symfony, và CakePHP; có kinh nghiệm với các phần mềm quản lý phiên bản như SVN, CVS, hoặc Git; và kinh nghiệm với Linux trong việc phát triển và triển khai hệ thống. HTML là chữ viết tắt của HyperText Markup Language, có nghĩa là ngôn ngữ đánh dấu siêu văn bản Nó dùng để định dạng bố cục, các thuộc tính liên quan đến cách hiển thị của một đoạn text và được hiển thị trên một chương trình đặc biệc ta gọi là Browser Hiện nay có khá nhiều Browser như Chrome, Firefox, Cốc Cốc, Microsoft Edge, Tất cả Browser đều có điểm chung là hiển thị và giúp người dùng thao tác với website và nó đều có khả năng biên dịch những đoạn mã HTML, CSS và Javascript Với HTML, chúng ta có thể: - Điều khiển hình thức và nội dung của trang - Xuất bản các tài liệu trực tuyến và truy xuất thông tin trực tuyến bằng cách sử dụng các liên kết được chèn vào tài liệu html - Tạo các biểu mẫu trực tuyến để thu thập thông tin về người dùng, quản lý các giao dịch - Chèn các đối tượng như audio clip, video clip, các thành phần ActiveX, Flash và các Java Applet vào tài liệu html Xét về cấu trúc một html gồm 3 phần cơ bản: - Phần HTML: Mọi tài liệu html phải bắt đầu bằng thẻ mở html và kết thúc bằng thẻ đóng html Thẻ html báo cho trình duyệt biết nội dung giữa hai thẻ này là một tài liệu html - Phần tiêu đề: Phần tiêu đề bắt đầu bằng thẻ và kết thúc bởi thẻ Phần này chứa tiêu đề mà được hiển thị trên thanh điều hướng của trang Web Tiêu đề nằm trong thẻ title, bắt đầu bằng thẻ và kết thúc là thẻ Tiêu đề là phần khá quan trọng Khi người dùng tìm kiếm thông tin, tiêu đề của trang Web cung cấp từ khóa chính yếu cho việc tìm kiếm - Phần thân: phần này nằm sau phần tiêu đề Phầ̀n thân bao gồm văn bản, hình ảnh và các liên kết mà chúng ta muốn hiển thị trên trang web của mình Phần thân bắt đầu bằng thẻ và kết thúc bằng thẻ Ngoài ra nó còn nhiều cặp thẻ chức năng khác như: Bảng 1.1.Các thẻ trong HTML Định nghĩa một bình luận, được dùng để comment phần code html Xác định loại tài liệu Định nghĩa một siêu liên kết Định nghĩa thông tin liên lạc cho các tác giả / chủ sở hữu của một tài liệu Định nghĩa vùng bên trong của một ánh xạ hình ảnh Định nghĩa một bài báo Xác định nội dung nằm bên cạnh nội dung của trang Thẻ định nghĩa nội dung âm thanh Thẻ định nghĩa chữ in đậm Định nghĩa thân của tài liệu Định nghĩa một ngắt dòng đơn Định nghĩa một nút bấm Được sử dụng để vẽ đồ họa, thông qua một ngôn ngữ script Định nghĩa một chú thích trong bảng Định nghĩa một đoạn mã máy tính Định nghĩa một hộp thoại hoặc một cửa sổ Định nghĩa một phần trong một tài liệu Nhóm liên nhóm các phần tử liên quan trong form Định nghĩa phần footer cho một tài liệu hoặc một đoạn Định nghĩa một form HTML cho người dùng nhập vào to Định nghĩa tiêu đề HTML Xác định các thông tin về tài liệu Định nghĩa một tiêu đề cho một tài liệu hoặc phần Định nghĩa gốc của một tài liệu HTML Định nghĩa một khung nội tuyến Thẻ định nghĩa một hình ảnh Định nghĩa một control nhập dữ liệu Định nghĩa khoá mã hoá đi kèm với một trường trong form Định nghĩa một nhãn cho một phần tử Định nghĩa một chú thích cho một phần tử Định nghĩa một danh sách đặt hàng Định nghĩa một lựa chọn trong danh sách drop-down
Định nghĩa một danh sách không có thứ tự Định nghĩa một video hoặc movie Định nghĩa một dấu ngắt dòng 1.2.2 Tìm hiểu CSS CSS là chữ viết tắt của Cascading Style Sheets, nó là một ngôn ngữ được sử dụng để tìm và định dạng lại các phần tử được tạo ra bởi các ngôn ngữ đánh dấu (ví dụ như HTML). Chúng ta có thể hiểu đơn giản rằng, nếu HTML đóng vai trò định dạng các phần tử trên website như việc tạo ra các đoạn văn bản, các tiêu đề, bảng…thì CSS sẽ giúp chúng ta có thể thêm một chút “phong cách” vào các phần tử HTML đó như đổi màu sắc trang, đổi màu chữ, thay đổi cấu trúc…rất nhiều. 1.2.2.1. Tác dụng của CSS - Hạn chế tối thiểu việc làm rối mã HTML của trang Web bằng các thẻ quy định kiểu dáng (chữ đậm, chữ in nghiêng, chữ có gạch chân, chữ màu), khiến mã nguồn của trang Web được gọn gàng hơn, tách nội dung của trang Web và định dạng hiển thị, dễ dàng cho việc cập nhật nội dung. - Tạo ra các kiểu dáng có thể áp dụng cho nhiều trang Web, giúp tránh phải lặp lại việc định dạng cho các trang Web giống nhau. 11 1.3.2.2. Sử dụng CSS: Có 3 cách để sử dụng CSS. - "Inline CSS": Áp dụng trực tiếp trên một đối tượng nhất định bằng thuộc tính style. - "Internal CSS": Đặt CSS ở đầu trang Web để áp dụng kiểu dáng cho toàn bộ trang ấy, khi đó chỉ cần đặt đoạn CSS vào trong cặp thẻ rồi đặt vào trong phần header của Web (giữa và ) - "External CSS": Đặt các thuộc tính CSS vào một tệp tin riêng biệt (.css), khi đó có thể tham chiếu đến từ nhiều trang Web khác nhau: Ví dụ về nội dung tệp style.css: Tham chiếu tới tệp tin CSS trên từ trang Web bằng đoạn mã (mã có thể nằm ngoài thẻ ): 1.2.2.5. Cú pháp Cú pháp cơ bản: Ví dụ minh họa về mã CSS: 12 1.2.2.4. CSS Selector CSS Selector dùng để xác định đoạn mã CSS tương ứng được bao trong phần từ “{“ đến “}” sẽ được áp dụng cho những thành phần nào trong trang Web. Như ví dụ ở đoạn mã trên, ta có thể thấy dạng CSS Selector đơn giản nhất là CSS Selector theo tag body. 1.2.3. Ngôn ngữ kịch bản Java script JavaScript, theo phiên bản hiện hành, là một ngôn ngữ lập trình thông dịch được phát triển từ các ý niệm nguyên mẫu. Ngôn ngữ này được dùng rộng rãi cho các trang web (phía người dùng) cũng như phía máy chủ (với Nodejs). Nó vốn được phát triển bởi Brendan Eich tại Hãng truyền thông Netscape với cái tên đầu tiên Mocha, rồi sau đó đổi tên thành LiveScript, và cuối cùng thành JavaScript. Giống Java, JavaScript có cú pháp tương tự C, nhưng nó gần với Self hơn Java. js là phần mở rộng thường được dùng cho tập tin mã nguồn JavaScript. Cũng giống như C, JavaScript không có bộ xử lý xuấtnhập (inputoutput) riêng. Trong khi C sử dụng thư viện xuấtnhập chuẩn, JavaScript dựa vào phần mềm ngôn ngữ được gắn vào để thực hiện xuấtnhập. Trên trình duyệt, rất nhiều trang web sử dụng JavaScript để thiết kế trang web động và một số hiệu ứng hình ảnh thông qua DOM. JavaScript được dùng để thực hiện một số tác vụ không thể thực hiện được với chỉ HTML như kiểm tra thông tin nhập vào, tự động thay đổi hình ảnh... Tuy nhiên, mỗi trình duyệt áp dụng JavaScript khác nhau và không tuân theo chuẩn W3C DOM, do đó trong rất nhiều trường hợp lập trình viên phải viết nhiều phiên bản của cùng một đoạn mã nguồn để có thể hoạt động trên nhiều trình duyệt. Một số công nghệ nổi bật dùng JavaScript để tương tác với DOM bao gồm DHTML, Ajax và SPA. 13 Bên ngoài trình duyệt, JavaScript có thể được sử dụng trong tập tin PDF của Adobe Acrobat và Adobe Reader. Điều khiển Dashboard trên hệ điều hành MacOS X phiên bản 10.4 cũng có sử dụng JavaScript. Từ khi Nodejs ra đời vào năm 2009, Javascript được biết đến nhiều hơn là một ngôn ngữ đa nền khi có thể chạy trên cả môi trường máy chủ cũng như môi trường nhúng. Mỗi ứng dụng này đều cung cấp mô hình đối tượng riêng cho phép tương tác với môi trường chủ, với phần lõi là ngôn ngữ lập trình JavaScript gần giống nhau. JavaScript có rất nhiều ưu điểm khiến nó vượt trội hơn so với các đối thủ, đặc biệt trong các trường hợp thực tế. Sau đây chỉ là một số lợi ích của JavaScript: - Chúng ta không cần một compiler vì web browser có thể biên dịch nó bằng HTML; - Nó dễ học hơn các ngôn ngữ lập trình khác; - Lỗi dễ phát hiện hơn và vì vậy dễ sửa hơn; - Nó có thể được gắn trên một số element của trang web hoặc event của trang web như là thông qua click chuột hoặc di chuột tới; - JS hoạt động trên nhiều trình duyệt, nền tảng; - Chúng ta có thể sử dụng JavaScript để kiểm tra input và giảm thiểu việc kiểm tra thủ công khi truy xuất qua database; - Nó giúp website tương tác tốt hơn với khách truy cập; - Nó nhanh hơn và nhẹ hơn các ngôn ngữ lập trình khác. Mọi ngôn ngữ lập trình đều có các khuyết điểm. Một phần là vì ngôn ngữ đó khi phát triển đến một mức độ như JavaScript, nó cũng sẽ thu hút lượng lớn hacker, scammer, và những người có ác tâm luôn tìm kiếm những lỗ hổng và các lỗi bảo mật để lợi dụng nó. Một số khuyết điểm có thể kể đến là: - Dễ bị khai thác; - Có thể được dùng để thực thi mã độc trên máy tính của người dùng; - Nhiều khi không được hỗ trợ trên mọi trình duyệt; - JS code snippets lớn; - Có thể bị triển khai khác nhau tùy từng thiết bị dẫn đến việc không đồng nhất. 14 1.2.3.1. Vị trí JavaScript trong HTML JavaScript trong thẻ hoặc : Chúng ta có thể đặt bất kỳ số lượng script nào trong một tài liệu HTML. Các tập lệnh có thể được đặt trong phần , hoặc trong phần của một trang HTML, hoặc trong cả hai. JavaScript trong thẻ : Trong ví dụ này, một hàm JavaScript được đặt trong phần của một trang HTML. Hàm được gọi (called) khi một nút được nhấp: JavaScript bên ngoài: Các tập lệnh cũng có thể được đặt trong các tệp tin bên ngoài: External file: myScript.js Các script bên ngoài khi cùng một mã được sử dụng trong nhiều trang web khác nhau. Các tệp JavaScript có đuôi tệp .js. Để sử dụng một script bên ngoài, hãy đặt tên tệp script vào thuộc tính src (source) của thẻ : 15 Chúng ta có thể đặt tham chiếu script bên ngoài trong thẻ hoặc theo ý muốn. Script sẽ hoạt động như thể nó nằm chính xác nơi có thẻ được đặt. 1.2.3.2. Các câu lệnh trong JavaScript Câu lệnh này nói với trình duyệt viết “Hello Dolly”. Bên trong một phần tử HTML với id = “content”: 1.2.3.3. Các chương trình JavaScript Hầu hết các chương trình JavaScript chứa nhiều câu lệnh JavaScript. Các câu lệnh được thực hiện, từng lệnh một, theo thứ tự như chúng được viết. Trong ví dụ x, y, và z được cho các giá trị, và cuối cùng z được hiển thị: Các chương trình JavaScript (và các câu lệnh JavaScript) thường được gọi là mã JavaScript. 1.2.3.4. Dấu chấm phẩy Các câu lệnh trong JavaScipt được phân tách nhau bằng dấu chấm phẩy. Thêm dấu chấm phẩy vào cuối mỗi câu lệnh thực thi: 16 1.2.2.2.5. Chiều dài dòng và dòng ngắt của JavaScript Để có khả năng đọc tốt nhất, các lập trình viên thường muốn tránh các dòng mã dài hơn 80 ký tự. Nếu một lệnh JavaScript không phù hợp trên một dòng, vị trí tốt nhất để phá vỡ nó là sau một toán tử. 1.2.3.6. Khối mã JavaScript Các câu lệnh JavaScript có thể được nhóm lại với nhau trong các khối mã, bên trong ngoặc nhọn {…}. Mục đích của các khối mã là để định nghĩa các câu lệnh phải được thực hiện với nhau. Một vị trí chúng ta sẽ tìm thấy các câu lệnh được nhóm lại với nhau theo khối, nằm trong các hàm JavaScript: 1.2.3.7. Từ khoá JavaScript Các câu lệnh JavaScript thường bắt đầu với một từ khoá để xác định hành động JavaScript được thực hiện. Dưới đây là danh sách một số từ khóa thường dùng: Bảng 1.2. Các từ khóa trong Javascript Từ khóa Mô tả break Chấm dứt một chuyển đổi hoặc một vòng lặp continue Nhảy ra khỏi vòng lặp và bắt đầu ở đầu debugger Ngừng thực hiện JavaScript, và các cuộc gọi (nếu có) chức năng gỡ lỗi do… while Thực hiện một khối các câu lệnh, và lặp lại khối, trong khi điều kiện là đúng for Đánh dấu một khối lệnh để được thực hiện, miễn là một điều kiện là đúng function Khai báo một hàm hoặc chức năng 17 if … else Đánh dấu một khối lệnh để được thực hiện, tùy thuộc vào điều kiện return Thoát một hàm hoặc một chức năng switch Đánh dấu một khối lệnh để được thực hiện, tùy thuộc vào các trường hợp khác nhau try…Catch Thực hiện xử lý lỗi đối với một khối các câu lệnh var Khai báo một biến 1.3.4. JQuery JQuery thư viện JavaScript đa trình duyệt được thiết kế để đơn giản hóa lập trình phía máy người dùng của HTML, phát hành vào tháng 1 năm 2006 tại BarCamp NYC bởi John Resig. Được sử dụng bởi hơn 52 trong 10.000 truy cập nhiều nhất các trang web, jQuery là thư viện JavaScript phổ biến nhất được sử dụng ngày nay. JQuery miễn phí, mã nguồn mở phần mềm, kép cấp phép theo MIT Giấy phép GNU General Public License, phiên bản 2 jQuery của được để làm cho nó dễ dàng hơn để di chuyển một tài liệu, chọn DOM các yếu tố, tạo ra hoạt hình s, xử lý Sự kiện, và phát triển Ajax ứng dụng. jQuery cũng cung cấp khả năng cho các nhà phát triển để tạo ra plug-in s trên đầu trang của thư viện JavaScript. Điều này cho phép các nhà phát triển để tạo ra trừu tượng hóa ở mức độ thấp tương tác và hình ảnh động, hiệu ứng tiên tiến và vật dụng cao cấp, chủ đề có thể. Cách tiếp cận mô- đun để thư viện jQuery cho phép tạo ra các công cụ mạnh mẽ và năng động web và các ứng dụng web. 1.3. Ngôn ngữ lập trình Back-end: 1.3.1. Một số ngôn ngữ lập trình Back-end Python Python là một ngôn ngữ lập trình bậc cao, hoàn toàn hướng đối tượng và strongly-type. Các tính từ thường được sử dụng để mô tả về Python điển hình bao gồm: vui, dễ sử dụng, và là một công cụ để học lập trình rất tốt — nhưng cuối cùng lại có rất ít ứng dụng web trong thế giới thực viết bằng Python. Tuy nhiên, nó chắc chắn là một ngôn ngữ rất tốt cho người mới học lập trình, đặc biệt nếu chúng ta là người đang hướng đến các dự án trên Linux hoặc cộng đồng mã nguồn mở. Chỉ 18 đừng mong chờ dùng nó để tạo ra các ứng dụng web thực sự, và xuất hiện như là một đối thủ cạnh tranh của cộng đồng Ruby. PHP Đây là một ngôn ngữ lập kịch bản dùng ở phía server(back-end) và sử dụng chủ yêu trong lập trình web. PHP là một ông vua không thể bàn cãi về ngôn ngữ kịch bản máy chủ (server-side) được sử dụng trên Internet ngày nay — nó chạy trên 75 của tất cả các máy chủ Web — và là sức mạnh phía sau của các nền tảng như WordPress, Wikipedia, và thậm chí là một phần của Facebook. Ngôn ngữ lập trình PHP Là một ngôn ngữ chạy trên máy chủ, mã của nó được xử lý trước khi được trả về trình duyệt của người dùng, vì thế tất cả chúng ta nhìn thấy chỉ là mã HTML và không có chút mã PHP nguyên thủy nào. PHP thường được sử dụng kết hợp với MySQL để truy xuất thông tin từ cơ sở dữ liệu và hiển thị thông tin tới người dùng. PHP là một ngôn ngữ đa năng và được xem như là chuẩn của hầu hết các máy chủ web — nếu chúng ta đã từng nghe về các thuật ngữ như MAMPWAMPLAMP, thì chữ P trong đó là viết tắt của PHP. Bên cạnh tính phổ biến, nó cũng dễ để sử dụng và cung cấp nhiều tính năng nâng cao cho các lập trình viên có kinh nghiệm. Javascript Javascript đang ngày càng phổ biến và có thứ hạng cao trong các ngôn ngữ lập trình phổ biến, đây là một ngôn ngữ kịch bản mạnh mẽ và linh hoạt. Phần lớn cú pháp giống như ngôn ngữ lập trình C. Hơn nữa, nó có khả năng tương thích trên 19 mọi trình duyệt web và có hơn 90 các website hiện nay đang sử dụng ngôn ngữ kịch bản này. Với sự ra đời của Node.js, nó đang là một công nghệ lập trình phía server và cho phép tương tác thời gian thực. Javascript là một bậc thầy về tương tác trên các trang web. Nó là một ngôn ngữ kịch bản chạy cục bộ trên trình ...
NỘI DUNG NGHIÊN CỨU
CƠ SỞ LÝ THUYẾT
Tìm hiểu lập trình Website
Ngôn ngữ lập trình Fontend
Xác định mối quan hệ giữa một tài liệu và một nguồn lực bên ngoài (thường được sử dụng để liên kết đến style sheets)
Định nghĩa một danh sách/menu các lệnh
Định nghĩa siêu dữ liệu về một tài liệu HTML
Định nghĩa liên kết điều hướng
- Định nghĩa một danh sách đặt hàng
Định nghĩa một lựa chọn trong danh sách drop-down
Định nghĩa một đoạn văn
Định nghĩa văn bản định dạng sẵn
Định nghĩa dấu nháy kép xung quoanh phần văn bản
Định nghĩa một kịch bản phía máy khách
Định nghĩa một phần trong một tài liệu
Định nghĩa một danh sách drop-down
Định nghĩa các nguồn đa phương tiện cho các phần tử đa phương tiên như và
Định nghĩa một phần trong một tài liệu
Định nghĩa văn bản in đậm, ý nghĩa nhấn mạnh độ quan trọng
Định nghĩa định kiểu cho một tài liệu
Định nghĩa văn bản giống như chỉ số dưới
Định nghĩa một bảng
Nhóm các thên nội dung trong một bảng
Định nghĩa một ô trong một bảng
Định nghĩa một ô nhập dữ liệu văn bản có nhiều dòng
Nhóm các nội dung tiêu đề trong một bảng
Định nghĩa một tiêu đề cho tài liệu
Định nghĩa một hàng trong một bảng
- Định nghĩa một danh sách không có thứ tự
Định nghĩa một video hoặc movie
Định nghĩa một dấu ngắt dòng
CSS là chữ viết tắt của Cascading Style Sheets, nó là một ngôn ngữ được sử dụng để tìm và định dạng lại các phần tử được tạo ra bởi các ngôn ngữ đánh dấu (ví dụ như HTML) Chúng ta có thể hiểu đơn giản rằng, nếu HTML đóng vai trò định dạng các phần tử trên website như việc tạo ra các đoạn văn bản, các tiêu đề, bảng…thì CSS sẽ giúp chúng ta có thể thêm một chút “phong cách” vào các phần tử HTML đó như đổi màu sắc trang, đổi màu chữ, thay đổi cấu trúc…rất nhiều
- Hạn chế tối thiểu việc làm rối mã HTML của trang Web bằng các thẻ quy định kiểu dáng (chữ đậm, chữ in nghiêng, chữ có gạch chân, chữ màu), khiến mã nguồn của trang Web được gọn gàng hơn, tách nội dung của trang Web và định dạng hiển thị, dễ dàng cho việc cập nhật nội dung
- Tạo ra các kiểu dáng có thể áp dụng cho nhiều trang Web, giúp tránh phải lặp lại việc định dạng cho các trang Web giống nhau
1.3.2.2 Sử dụng CSS: Có 3 cách để sử dụng CSS
- "Inline CSS": Áp dụng trực tiếp trên một đối tượng nhất định bằng thuộc tính style
- "Internal CSS": Đặt CSS ở đầu trang Web để áp dụng kiểu dáng cho toàn bộ trang ấy, khi đó chỉ cần đặt đoạn CSS vào trong cặp thẻ rồi đặt vào trong phần header của Web (giữa và )
- "External CSS": Đặt các thuộc tính CSS vào một tệp tin riêng biệt (*.css), khi đó có thể tham chiếu đến từ nhiều trang Web khác nhau:
Ví dụ về nội dung tệp style.css:
Tham chiếu tới tệp tin CSS trên từ trang Web bằng đoạn mã (mã có thể nằm ngoài thẻ ):
Ví dụ minh họa về mã CSS:
CSS Selector dùng để xác định đoạn mã CSS tương ứng được bao trong phần từ “{“ đến “}” sẽ được áp dụng cho những thành phần nào trong trang Web Như ví dụ ở đoạn mã trên, ta có thể thấy dạng CSS Selector đơn giản nhất là CSS Selector theo tag body
1.2.3 Ngôn ngữ kịch bản Java script
JavaScript, theo phiên bản hiện hành, là một ngôn ngữ lập trình thông dịch được phát triển từ các ý niệm nguyên mẫu Ngôn ngữ này được dùng rộng rãi cho các trang web (phía người dùng) cũng như phía máy chủ (với Nodejs) Nó vốn được phát triển bởi Brendan Eich tại Hãng truyền thông Netscape với cái tên đầu tiên Mocha, rồi sau đó đổi tên thành LiveScript, và cuối cùng thành JavaScript Giống Java, JavaScript có cú pháp tương tự C, nhưng nó gần với Self hơn Java js là phần mở rộng thường được dùng cho tập tin mã nguồn JavaScript
Cũng giống như C, JavaScript không có bộ xử lý xuất/nhập (input/output) riêng Trong khi C sử dụng thư viện xuất/nhập chuẩn, JavaScript dựa vào phần mềm ngôn ngữ được gắn vào để thực hiện xuất/nhập
Trên trình duyệt, rất nhiều trang web sử dụng JavaScript để thiết kế trang web động và một số hiệu ứng hình ảnh thông qua DOM JavaScript được dùng để thực hiện một số tác vụ không thể thực hiện được với chỉ HTML như kiểm tra thông tin nhập vào, tự động thay đổi hình ảnh Tuy nhiên, mỗi trình duyệt áp dụng JavaScript khác nhau và không tuân theo chuẩn W3C DOM, do đó trong rất nhiều trường hợp lập trình viên phải viết nhiều phiên bản của cùng một đoạn mã nguồn để có thể hoạt động trên nhiều trình duyệt Một số công nghệ nổi bật dùng JavaScript để tương tác với DOM bao gồm DHTML, Ajax và SPA
Bên ngoài trình duyệt, JavaScript có thể được sử dụng trong tập tin PDF của Adobe Acrobat và Adobe Reader Điều khiển Dashboard trên hệ điều hành MacOS
X phiên bản 10.4 cũng có sử dụng JavaScript
Từ khi Nodejs ra đời vào năm 2009, Javascript được biết đến nhiều hơn là một ngôn ngữ đa nền khi có thể chạy trên cả môi trường máy chủ cũng như môi trường nhúng
Mỗi ứng dụng này đều cung cấp mô hình đối tượng riêng cho phép tương tác với môi trường chủ, với phần lõi là ngôn ngữ lập trình JavaScript gần giống nhau
JavaScript có rất nhiều ưu điểm khiến nó vượt trội hơn so với các đối thủ, đặc biệt trong các trường hợp thực tế Sau đây chỉ là một số lợi ích của JavaScript:
- Chúng ta không cần một compiler vì web browser có thể biên dịch nó bằng HTML;
- Nó dễ học hơn các ngôn ngữ lập trình khác;
- Lỗi dễ phát hiện hơn và vì vậy dễ sửa hơn;
- Nó có thể được gắn trên một số element của trang web hoặc event của trang web như là thông qua click chuột hoặc di chuột tới;
- JS hoạt động trên nhiều trình duyệt, nền tảng;
- Chúng ta có thể sử dụng JavaScript để kiểm tra input và giảm thiểu việc kiểm tra thủ công khi truy xuất qua database;
- Nó giúp website tương tác tốt hơn với khách truy cập;
- Nó nhanh hơn và nhẹ hơn các ngôn ngữ lập trình khác
Mọi ngôn ngữ lập trình đều có các khuyết điểm Một phần là vì ngôn ngữ đó khi phát triển đến một mức độ như JavaScript, nó cũng sẽ thu hút lượng lớn hacker, scammer, và những người có ác tâm luôn tìm kiếm những lỗ hổng và các lỗi bảo mật để lợi dụng nó Một số khuyết điểm có thể kể đến là:
- Có thể được dùng để thực thi mã độc trên máy tính của người dùng;
- Nhiều khi không được hỗ trợ trên mọi trình duyệt;
- Có thể bị triển khai khác nhau tùy từng thiết bị dẫn đến việc không đồng nhất
1.2.3.1 Vị trí JavaScript trong HTML
Ngôn ngữ lập trình Back-end
1.3.1 Một số ngôn ngữ lập trình Back-end
Python là một ngôn ngữ lập trình bậc cao, hoàn toàn hướng đối tượng và strongly-type Các tính từ thường được sử dụng để mô tả về Python điển hình bao gồm: vui, dễ sử dụng, và là một công cụ để học lập trình rất tốt — nhưng cuối cùng lại có rất ít ứng dụng web trong thế giới thực viết bằng Python Tuy nhiên, nó chắc chắn là một ngôn ngữ rất tốt cho người mới học lập trình, đặc biệt nếu chúng ta là người đang hướng đến các dự án trên Linux hoặc cộng đồng mã nguồn mở Chỉ
18 đừng mong chờ dùng nó để tạo ra các ứng dụng web thực sự, và xuất hiện như là một đối thủ cạnh tranh của cộng đồng Ruby
PHP Đây là một ngôn ngữ lập kịch bản dùng ở phía server(back-end) và sử dụng chủ yêu trong lập trình web PHP là một ông vua không thể bàn cãi về ngôn ngữ kịch bản máy chủ (server-side) được sử dụng trên Internet ngày nay — nó chạy trên 75% của tất cả các máy chủ Web — và là sức mạnh phía sau của các nền tảng như WordPress, Wikipedia, và thậm chí là một phần của Facebook
Ngôn ngữ lập trình PHP Là một ngôn ngữ chạy trên máy chủ, mã của nó được xử lý trước khi được trả về trình duyệt của người dùng, vì thế tất cả chúng ta nhìn thấy chỉ là mã HTML và không có chút mã PHP nguyên thủy nào PHP thường được sử dụng kết hợp với MySQL để truy xuất thông tin từ cơ sở dữ liệu và hiển thị thông tin tới người dùng
PHP là một ngôn ngữ đa năng và được xem như là chuẩn của hầu hết các máy chủ web — nếu chúng ta đã từng nghe về các thuật ngữ như MAMP/WAMP/LAMP, thì chữ P trong đó là viết tắt của PHP Bên cạnh tính phổ biến, nó cũng dễ để sử dụng và cung cấp nhiều tính năng nâng cao cho các lập trình viên có kinh nghiệm
Javascript đang ngày càng phổ biến và có thứ hạng cao trong các ngôn ngữ lập trình phổ biến, đây là một ngôn ngữ kịch bản mạnh mẽ và linh hoạt Phần lớn cú pháp giống như ngôn ngữ lập trình C Hơn nữa, nó có khả năng tương thích trên
19 mọi trình duyệt web và có hơn 90% các website hiện nay đang sử dụng ngôn ngữ kịch bản này Với sự ra đời của Node.js, nó đang là một công nghệ lập trình phía server và cho phép tương tác thời gian thực
Javascript là một bậc thầy về tương tác trên các trang web Nó là một ngôn ngữ kịch bản chạy cục bộ trên trình duyệt của người dùng, cho phép các trang web phản hồi lại các tương tác người dùng như là khi click chuột lên một đối tượng và các sự kiện về thời gian Để có thể học hết mọi thứ trong JavaScript là một điều hầu như không tưởng — có thể nói rằng nếu có một tương tác nào đó trên một trang web, và nó không phải là Flash — thì nhiều khả năng đó là nhờ Javascript
Ruby là một ngôn ngữ linh động, hướng đối tượng và là một ngôn ngữ kịch bản đa chức năng Được sử dụng phổ biến bởi nó là một web framework – Rais. Ruby, và framework phát triển ứng dụng web của nó là Ruby On Rails, là nguồn sức mạnh cho một số trang web lớn như là Groupon, Shopify (một nền tảng thương mại điện tử), và được dùng để xây dựng front-end cho mạng xã hội Twitter Nó là một ngôn ngữ hoàn toàn hướng đối tượng và được thông dịch bởi server trước khi gửi mã HTML tới trình duyệt của người dùng — cũng giống như PHP (nhưng cũng có nhiều điểm hoàn toàn khác biệt) Tuy nhiên, nó có một số đặc điểm nổi trội đó là phát triển ứng dụng nhanh chóng, viết ít code bị lặp lại, và tốc độ thực thi khá nhanh
Không may là hầu hết các máy chủ web đều không hỗ trợ Ruby ở dạng mặc định, vì thế trừ khi chúng ta có khả năng cấu hình cho riêng mình một con server như chúng ta mong muốn, nếu không thì chúng ta cần sử dụng một nhà cung cấp dịch vụ hosting kiểu như Heroku
Perl trước đây được xem là một lực lượng chính trong lập trình web, nhưng gần đây hầu như đã chuyển sang các ứng dụng xử lý văn bản (text) Nó thì có tốc độ xử lý văn bản nhanh đến mức kinh ngạc, nhưng không được sử dụng nhiều trong
20 thế giới Internet hiện đại Tuy nhiên hầu như tất cả các hacker đều có một số thủ thuật được viết bởi Perl, vì thế nó cũng đáng giá để chúng ta để tâm nghiên cứu vào một lúc nào đó
Go là một ngôn ngữ lập trình mới do Google thiết kế và phát triển Nó được kỳ vọng sẽ giúp ngành công nghiệp phần mềm khai thác nền tảng đa lõi của bộ vi xử lý và hoạt động đa nhiệm tốt hơn
Việc khai thác sức mạnh của các bộ xử lý đa lõi và phần cứng thế hệ mới đối với các ngôn ngữ hiện có được xem như là việc không thể được Bởi những giới hạn vốn có của các ngôn ngữ lập trình trên máy tính như C, C#, Java, Bấy lâu nay, các vấn đề xử lý đa lõi vẫn là chuyện của hệ điều hành
Google đưa ra ngôn ngữ Go như là một cách tiếp cận khác về vấn đề xử lý đa lõi Thay vì chỉ có hệ điều hành được phép cấp tài nguyên và xử lý, thì các phần mềm cũng có thể tương tác trực tiếp với nền tảng đa lõi giúp cho việc xử lý nhanh hơn.
1.4.2 Lập trình web bằng Node JS
Node.js là một mã nguồn mở, một môi trường cho các máy chủ và ứng dụng mạng Node.js sử dụng Google V8 JavaScript engine để thực thi mã, và một tỷ lệ lớn các mô-đun cơ bản được viết bằng JavaScript Các ứng dụng node.js thì được viết bằng JavaScript
Node.js chứa một thư viện built-in cho phép các ứng dụng hoạt động như một Webserver mà không cần phần mềm như Nginx, Apache HTTP hoặc IIS
Tìm hiểu cơ sở dữ liệu Postgresql
PostgreSQL là một hệ quản trị cơ sở dữ liệu quan hệ và đối tượng dựa trên POSTGRES, bản 4.2, được khoa điện toán của đại học California tại Berkeley phát triển POSTGRES mở đường cho nhiều khái niệm quan trọng mà các hệ quản trị dữ liệu thương mại rất lâu sau mới có
PostgreSQL không chỉ là cơ sở dữ liệu quan hệ, nó là quan hệ hướng đối tượng Điều này cung cấp cho nó một vài lợi thế so với các cơ sở dữ liệu SQL mã nguồn mở khác như MySQL, MariaDB và Firebird
Một đặc điểm cơ bản của cơ sở dữ liệu quan hệ hướng đối tượng là hỗ trợ các đối tượng người dùng tự định nghĩa và các hành vi của chúng bao gồm các kiểu dữ liệu, các hàm, các thao tác, các tên miền và các chỉ mục Điều này làm cho PostgreSQL cực kỳ mạnh và linh hoạt Trong những cái khác, các cấu trúc dữ liệu phức tạp có thể được tạo ra, lưu trữ, và truy xuất Trong một vài ví dụ ở bên dưới chúng ta sẽ nhìn thấy các cấu trúc hỗn hợp lồng nhau cái mà các hệ quản trị cơ sở dữ liệu chuẩn (RDBMS) không hỗ trợ
- Dễ cấu hình, thích ứng tốt, độ tin cậy cao
- Hỗ trợ tốt với PHP và Java
- Là một phần mềm mã nguồn mở
- Tuân thủ các chuẩn của SQL
- Hoạt động được trên nhiều hệ điều hành như: Windows, Linux, UNIX (AIX, BSD, HP-UX, SGI IRIX, Mac OS X, Solaris, Tru64)
- Lưu trữ (dạng nhị phân) các đối tượng có dữ liệu lớn như hình ảnh, âm thanh, hoặc video - Hỗ trợ các ngôn ngữ như C/C++, Java, Net, Perl, Python, Ruby, Tcl, ODBC
- Có sự thống nhất giữa những người phát triển (tái dụng những kỹ năng và các thư viện đã có)
- Có hầu hết các truy vấn SQL với các kiểu dữ liệu như INTEGER, NUMERIC, BOOLEAN, CHAR, VARCHAR, DATE, INTERVAL, và TIMESTAMP
- Tạo chỉ mục giúp quá trình truy vấn đạt hiệu quả cao hơn - Hỗ trợ các chức năng tìm kiếm tổng quát hóa có thể “gắn” các chỉ mục vào giúp quá trình tìm kiếm được thực hiện trên phạm vi rộng hơn như: compound, unique, partial, and functional indexes
- Có thể tạo mới kiểu dữ liệu, các hàm, các thủ tục (procedure)…
- Hỗ trợ đa người dùng: dữ liệu không gian có xu hướng là các dữ liệu tham chiếu, tức là được chia sẻ bởi nhiều người dùng Lưu trữ dữ liệu trong hệ quản trị cơ sở dữ liệu sẽ cung cấp những lợi ích như: truy cập từ xa thông qua các chuẩn giao tiếp như: JDBC, ODBC, PERL/DBI , làm tăng tính bảo mật cho dữ liệu như: một số người dùng có toàn quyền tuy nhiên một số người dùng chỉ có thể đọc hay không được nhìn thấy
- Cộng đồng người dùng tương đối ít
- Chậm hơn so với MySQL
- Không có tham số mặc định trong PL/PGSQLHệ cơ sỡ dữ liệu PostgreSQL
1.4.4 Các kiểu dữ liệu và cấu trúc:
Có một danh sách các kiểu dữ liệu PostgreSQL hỗ trợ Bên cạnh kiểu số, floating-point, chuỗi, boolean, và các kiểu dữ liệu mà chúng ta mong muốn (và nhiều tùy chọn khác), PostgreSQL tự hào với uuid, tiền tệ, liệt kê (enumerated), hình học (geometric), nhị phân (binary), địa chỉ mạng, chuỗi bit, tìm kiếm văn bản, xml, json, mảng, hỗn hợp, và các loại khoảng (range types), cũng như một vài kiểu internal cho nhận biết đối tượng và vị trí đăng nhập Để công bằng, MySQL,
MariaDB và Firebird mỗi cái có một vài loại ở mức độ khác nhau, nhưng PostgreSQL hỗ trợ tất cả
Bảng 1.3 Kích thước dữ liệu trong postgresql
Kích thước tối đa của cơ sở dữ liệu Không giới hạn
Kích thước tối đa của table 32 TB
Kích thước tối đa của hàng (row) 1.6 TB
Kích thước tối đa của trường (field) 1 GB
Số hàng tối đa trên mỗi bảng Không giới hạn
Số cột tối đa trên mỗi bảng 250 - 1600 phụ thuộc vào kiểu cột
Số lượng index tối đa trên mỗi bảng Không giới hạn
Hãy so sánh, MySQL và MariaDB được biết đến với giới hạn kích thước dòng là 65,535 byte Firebird cũng chỉ có kích thước tối đa cho một dòng là 64KB Thông thường kích thước dữ liệu được giới hạn bởi giới hạn kích thước file của hệ điều hành Bởi vì PostgreSQL có thể lưu trữ bảng dữ liệu trong nhiều file nhỏ hơn, nên nó có thể khắc phục được hạn chế này - mặc dù, điều quan trọng cần lưu ý là quá nhiều file có thể tác động tiêu cực đến hiệu năng MySQL và MariaDB cũng làm được, tuy nhiên chúng hỗ trợ nhiều cột trên một bảng (lên tới 4,096 phụ thuộc vào kiểu dữ liệu) và kích thước mỗi bảng lớn hơn PostgreSQL, nhưng rất hiếm các điều kiện mà chúng ta cần thực hiện vượt quá các giới hạn của PostgreSQL
Tóm lại, PostgreSQL có rất nhiều khả năng Được xây dựng bằng cách sử dụng mô hình quan hệ hướng đối tượng, nó hỗ trợ các cấu trúc phức tạp và rất nhiều các kiểu dữ liệu được xây dựng sẵn và do người dùng tự định nghĩa Nó cung cấp khả năng mở rộng dữ liệu và đáng tin cậy cho tính toàn vẹn dữ liệu Chúng ta có thể không cần tất cả các tính năng tiên tiến chúng ta đã đề cập cho việc lưu trữ dữ liệu, nhưng khi nhu cầu dữ liệu phát triển nhanh, chắc chắn lợi ích rõ ràng đó là tất cả đã ở trong tầm tay của chúng ta
Kết luận chương 1
Một trang web để hoạt động tốt thì được tạo từ hai phần chính: backend và fontend Mỗi phần điều đóng vai trò quan trong trong cấu trúc hình thành của một trang web Nếu fontend xây dựng giao diện người dùng thì backend đảm nhận mọi công việc xử lý phía máy chủ
Với mỗi phần ta lại có rất nhiều ngôn ngữ để lập trình khác nhau Nắm vững những kiến thức về chúng là yêu cầu để xây dựng một trang web So với một số ngôn ngữ lập trình khác, Javascript được đánh giá cao bởi khả năng đáp úng nhu cầu tốt, dễ sử dung Nó đang chứng minh là một ngôn ngữ đáng để theo đuổi
Nắm vững kiến thức là giai đoạn đầu cần để tạo nên một trang web Để tạo nên một trang web thật sự, có thể sử dụng đáp ứng nhu cầu của mình thì còn phải qua nhiều bước chẳng hạn: Tìm hiểu yêu cầu, xác định những tác nhân, xây dựng cơ sỡ dữ liệu, Đó là giai đoạn phân tích, thiết kế, một giai đoạn đón vai trò cực kì quan trọng trong việc tạo ra món mang tính ứng dụng được vào thực tế
XÂY DỰNG WEBSITE QUẢN LÝ NHÀ HÀNG
Bài toán thực tế
Nhà hàng Trầu Cau có quy mô phục vụ khá cao, số lượng nhân viên tương đối nhiều, khối lượng công việc cần quản lý nhiều Vì vậy việc quản lý được các nhân viên hay quản lý được thực trạng kinh doanh của nhà hàng gây không ít khó khăn cho quản lý và chủ nhà hàng
Hiện nay, nhà hàng đã sử dụng phần mềm để trợ giúp trong công việc quản lý được dễ dàng hơn Tuy nhiên, phần mềm công ty hiện vẫn tồn tại nhiều khuyết điểm chưa thật sự giúp đỡ nhiều cho công tác quản lý Phần mềm này chủ yếu dùng dể lưu trữ dữ liệu thu chi và quản lý nhân viên, trong khi các chức năng khác chưa được chú ý đến
Nhân viên thu ngân sẽ quản lý doanh thu và chi tiêu theo chu kì, sau đó tổng hợp báo cáo cho cấp trên Nhân viên kho giám sát các nguyên liệu trong kho, kiểm tra tình trạng và số lượng của chúng Nhân viên bán hàng hướng dãn và thực hiện đặt chõ cho khách khi có yêu cầu
2.1.1.1 Giới thiệu về hệ thống cũ Ưu điểm: Đơn giản, dễ sử dụng, giao diện thân thiện với người dùng Chức năng nhập hoá đơn bàn hàng linh hoạt giúp ích nhiều cho công tác bán hàng Hỗ trợ tốt người dùng trong việc kiểm tra và thống kê hàng hoá, tài sản Chạy tốt trên nền hệ điều hành Windows XP Không yêu cầu cao về phần cứng máy tính
Nhược điểm: Giao diện chương trình không mang tính mỹ thuật cao Chương trình chưa quan tâm nhiều lắm đến vấn đề bảo mật cho ứng dụng Chưa đáp ứng được các yêu cầu bán hàng, giao tiếp với khách hàng,…
2.1.1.2 Giới thiệu về hệ thống mới
Mục đích thiết kế phần mềm quản lý nhà hàng Phát triển từ ý tưởng về nghiệp vụ quản lý nhà hàng, niềm đam mê ứng dụng công nghệ cao vào cuộc sống, em xây dựng phần mềm quản lý nhà hàng nhằm giúp người quản lý đơn giản hơn trong công tác quản lý nhà hàng, minh bạch các hoạt động của nhà hàng từ đó kiểm soát được mọi hoạt động kinh doanh và thúc đẩy doanh thu của nhà hàng
Xây dựng được hệ thống quản lí nhà hàng ăn uống với đầy đủ các chức năng quản lí như: nhập, xuất hàng hoá trong kho, quản lí bàn ăn (thêm, ghép, rời bàn ăn), từng nhân viên bàn, quản lí công nợ khách hàng, quản lí thẻ ưu đãi cho khách hàng, các khoản chiết khấu, hoa hồng Phần mềm phải có chức năng tạo các báo cáo về hàng hoá nhập/xuất/tồn kho, các báo cáo về công nợ, báo cáo về thu chi tiền mặt, thống kê doanh thu theo từng nhân viên, từng khu vực bàn ăn (nếu cửa hàng có nhiều khu vực bàn ăn khác nhau), các báo cáo kết quả kinh doanh
Nhiều máy có kết nối mạng, hệ thống bán online
2.1.2 Tìm hiểu môi trường hệ thống
Phân tích hệ thống
R1.1 NV kho nhập và kiểm kê thông tin nguyên vật liệu đưa vào kho (ten)
R1.2 NV kho kiểm tra thông tin nếu có sai sót và nhầm lẫn
R1.3 NV kho lưu thông tin vào CSDL
R1.4 NV kho xóa món không còn nhập
R1.5 NV lưu sổ chi, đơn đặt hàng vào CSDL
R2.2 Khách chọn món, gọi món
R2.2.1 Chọn món, gọi món trực tiếp
R2.2.2 Chọn món qua menu trên trang web và đặt món
R3.1 Khách yêu cầu thanh toán trực tiếp
R3.1.2 NV kiểm tra HĐ, tính tổng tiền và yêu cầu Khách trả tiền
R3.1.3 Khách đưa tiền cho NV
R3.1.4 NV xác nhận, thối lại tiền thừa cho Khách, in HĐ đưa cho Khách
R3.1.5 NV lưu thông tin HĐ vào CSDL
R3.2 Khách thanh toán qua việc đặt món qua mạng
R3.2.1 NV tạo HĐ đối với các món Khách đặt
R3.2.3 NV giao HĐ và món Khách gọi cho NV ship
R3.2.4 NV cập nhập trạng thái trả tiền của Khách (khi NV ship hàng giao lại HĐ và tiền)
R4.1 Cuối tháng người quản lý đăng nhập vào hệ thống để thống kê
R4.2 Thống kê nguyên vật liệu nhập vào kho
R4.3 Thống kê nguyên vật liệu còn trong kho
R5.1 Thu ngân đăng nhập vào hệ thống và tìm thông tin hàng
R5.2 Tìm kiếm thông tin nhân viên
+ Tìm món và bàn cho khách
+ Ghi order khi khách đặt món
+ Đặt chỗ, món và hủy đặt
+ Thêm, sửa, xóa thông tin nhân viên
+ Cập nhật thông tin đăng nhập
+ Thêm, sửa, xóa thực đơn
+ Thống kê doanh thu theo tháng
+ Bổ sung thông tin vào HĐ
+ Kiểm tra tìm trạng nguyên liệu
Ngoài ra: còn có các Actor khác: nhà cung cấp, kho, bàn, máy in, hóa đơn, nguyên vật liệu, món, phiếu nhập
Actor: NV phục vụ, NV kho, NQL, NV bảo trì
B1 Hằng ngày hoặc khi vào ca làm việc NV phục vụ, NV Kho, NQL, NV bảo trì đăng nhập hệ thống, nhập tài khoản, mật khẩu, nếu tài khoản và mật khẩu đúng hệ thống mở, nếu sai hệ thống yêu cầu nhập lại
B2 Lúc kết thúc ca làm việc của mình hoặc kết thúc hoạt động đảm nhiệm, người thực hiện đăng xuất khỏi hệ thống
B1 Nhân viên kho (NV kho) nhập và kiểm kê thông tin nguyên vật liệu khi đưa vào kho (tên, masp, số lượng, đơn giá, đơn vị tính, )
B2 NVkho chỉnh sửa thông tin nếu có sai sót, nhầm lẫn
B3 NV kho lưu thông tin vào cơ sở dữ liệu NV kho tạo nguyên vật liệu mới và bổ sung vào cơ sở dữ liệu
B4 NV kho xóa nguyên vật liệu không còn nhập vào nhà hàng
Actor: NV phục vụ, Khách hàng
B1 Hằng ngày hoặc khi vào ca làm việc NV phục vụ đăng nhập hệ thống
B2 Khi có khách đến chọn bàn, gọi thức uống, NV phục vụ chọn bàn trong của sổ bán món, bổ sung thức uống khách gọi
B3 Lúc kết thúc ca làm việc của mình, NV bán món đăng xuất khỏi hệ thống Bán online:
B1 Khi khách đặc bàn từ xa thì NV phục vụ sắp xếp vị trí cho khách
B2 Khách có thể hủy đặt bàn trước thời điểm đặt trong thời gian cho phép
B3 Căn cứ vào thời gian hủy, nhân viên thực hiên khấu trừ tiền đặt chỗ
Actor: NV thu ngân, khách hàng
B1 Khi khách hàng yêu cầu thanh toán thì NV thu nhân đăng nhập hệ thống tính tiền và lập hóa đơn
B2 Nhận tiền từ khách hàng và lưu vào CSDL
B3 In hóa đơn với khách thanh toán trực tiếp và gửi thông báo đối với khách online
Actor: Quản lý, NV thu ngân
B1 Hằng tháng NV thu ngân đăng nhập vào hệ thống thống kê thu chi hằng tháng của nhà hàng
B2 Lưu vào CSDL và lập bản thống kê gửi lên quản lý (Quản lý gửi lên Giám Đốc)
Thống kê kho: Hằng tuần NV kho thống kê nguyên vật liệu nhập/xuất, hàng tồn… lập bảng thống kê gửi lên quản lý
Actor: Khách, NV phục vụ
B1 Khách tìm món theo mã món
B2 Nhập thông tin về mã món, hệ thống sẽ gửi kết quả về lại cho khách hàng biết (7) UC_ Capnhatnvl (UC_Cập nhật nguyên vật liệu)
B1 Hằng ngày, NV kho đăng nhập hệ thống, vào cửa sổ quản lý hàng hóa, kiểm tra và bổ sung các thông tin về nguyên vât liệu (Tên nguyên vât liệu, mã nguyên vât liệu, giá, số lượng, đơn vị tính, chất lượng )
B2 Lưu thông tin nguyên vât liệu vào CSDL, đối với nguyên liệu hư hỏng thì hủy B3 Sau khi xong NV kho đăng xuất khỏi hệ thống
(8) UC_ Capnhatsp (UC_ Cập nhật món)
Actor: Quản lý, NV chế biến
B1 Hằng ngày hoặc khi có món mới vào menu, NV pha chế thông báo cho quản lý, quản lý đăng nhập hệ thống, vào cửa sổ quản lý món, thêm món mới, bổ sung các thông tin về món (Tên món, mã món, giá, số lượng, đơn vị tính, ),
B2 Lưu thông tin món vào CSDL, tiếp tục cập nhật thông tin các món khác, nếu có món nào nhà hàng không còn bán thì quản lý xóa món đó khỏi CSDL
B3 Sau khi xong quản lý đăng xuất khỏi hệ thống
(9) UC_ Quản lý nhân viên
B1 Hằng ngày, quản lý đăng nhập vào hệ thống cập nhật, điểm danh nhân viên (MaNV, TenNV, DiaChi, SDT…)
B2 Lưu thông tin vào và nếu có nhân viên nghỉ việc thì xóa thông tin nhân viên đó Thêm thông tin nhân viên mới
B3 Trừ lương nhân viên vi phạm và thưởng lưởng theo chế độ
Hình 2.1 Sơ đồ usecase QL nhà hàng Hình 2.2.3.0.1 Sơ đồ usecase QL nhà hàng
UserException ma_user ten_user pass
QL name (from Use Case Vi ew)
NHANVIEN ma_nv ten_nv passDangnhap()(from Use Case View)
HOADON ma_hd ma_ban ma_nv ngaylap masp tongtien ghichu
TaoHDmoi() SuaHD() Tinhtong() InHD() LuuHD()
BAN ma_ban ma_loaiban ten_ban vitri tinhtrang
NHACUNGCAP ma_ncc ten_ncc diachi sdt
(from Use Case Vi ew)
PHIEUNHAP ma_pn ten_pn ma_nv ma_kho ma_ncc ngaynhap tongtien ghichu
CHITIETPHIEUNHAP ma_phieunhap ma_nvl soluong dongia 1 1 1 1
PHIEUNHAP ma_pn ten_pn ma_nv ma_kho ma_ncc ngaynhap tongtien ghichu
KHO ma_kho ten_kho mota ma_nvl
NGUYENVATLIEU ma_nvl ten_nvl loainvl hsdNhap NVL()
2.2.5.1 Biểu đồ tuần tự UC_Dangnhap
: NHANVIEN He thong He thong Cua so dang nhap
2: Mo cua so dang nhap 3: Nhap ten, pass
4: Kiem tra 5: Ture ->6/False ->3 6: Mo cua so he thong
Hình 2 1 Biểu đồ tuần tự UC_Dangnhap
2.2.5.2 Biểu đồ cộng tác UC_Dangnhap
He thong Cua so dang nhap
2: Mo cua so dang nhap
3: Nhap ten, pass 6: Mo cua so he thong
Hình 2.2 Biểu đồ cộng tác UC_Dangnhap
2.2.5.3 Biểu đồ tuần tự UC_Bansp
: KHACHHANG : NHANVIEN : NHANVIEN Form HD Form HD CSDL CSDL : PRINT : PRINT
4: Nhap du lieu vap HD (masp, so luong )
5: Kiem tra thong tin HD; Tinh tong tien
6: In HD 7: Goi cho khach
Hình 2.3 Biểu đồ tuần tự UC_Bansp
2.2.5.4 Biểu đồ cộng tác UC_Bansp
1: Lua chon san pham 5: Kiem tra thong tin HD; Tinh tong tien
2: Yeu cau tinh tien 8: Nhan tien tu khach
7: Goi cho khach 9: Thoi tien thua
3: Tao hoa don moi 4: Nhap du lieu vap HD (masp, so luong )
Hình 2.4 Biểu đồ cộng tác UC_Bansp
2.2.5.5 Biểu đồ tuần tự UC_Nhapnvl
: NV_kho form nhap nvl form nhap nvl DK nhap nvl DK nhap nvl Class xu ly nhap nvl
Class xu ly nhap nvl : PRINT : PRINT CSDL CSDL 1: Chon chuc nang nhap
3: Tao hoa don nhap nvl
2: Yeu cau nhap thong tin
8: Thong bao luu thanh cong
10: Xuat hoa don nhap hang
Hình 2.5 Biểu đồ tuần tự UC_Nhapnvl
2.2.5.6 Biểu đồ cộng tác UC_Nhapnvl
: NV_kho form nhap nvl
Class xu ly nhap nvl
2: Yeu cau nhap thong tin
3: Tao hoa don nhap nvl 4: KT thong tin nvl
6: Nhap thong tin HD 10: Xuat hoa don nhap hang
8: Thong bao luu thanh cong
Hình 2.6 Biểu đồ cộng tác UC_Nhapnvl
2.2.5.7 Biểu đồ tuần tự UC_Thanhtoan
: KHACHHANG : NHANVIEN : NHANVIEN form HD form HD CSDL CSDL
2: Mo cua thanh toan 3: Nhap thong tin liên quan den khách
4: Kiem tra tt và tính tong
1: Khach yeu cau thanh toan
Hình 2.7 Biểu đồ tuần tự UC_Thanhtoan
2.2.5.8 Biểu đồ cộng tác UC_Thanhtoan
4: Kiem tra tt và tính tong
2: Mo cua thanh toan 3: Nhap thong tin liên quan den khách
1: Khach yeu cau thanh toan
Hình 2.8 Biểu đồ cộng tác UC_Thanhtoan
2.2.5.9 Biểu đồ tuần tự UC_Thongke
: Thungan Giao dien xu ly thong ke doanh thu
Giao dien xu ly thong ke doanh thu
Class xu lý thong ke
Class xu lý thong ke
1: Nhap thong tin can thong ke
2: Xac nhan thong tin can thong ke
5: Hop le gui y/c thong ke 4: Thong tin khong hop le, y/c nhap lai
6: Ket qua thong ke 7: Tong doanh thu, so khach, san pham bán nhieu nhat
Hình 2.9 Biểu đồ tuần tự UC_Thongke
2.2.5.10 Biểu đồ cộng tác UC_Thongke
Giao dien xu ly thong ke doanh thu
Class xu lý thong ke
3: Kiem tra tt 1: Nhap thong tin can thong ke 2: Xac nhan thong tin can thong ke
4: Thong tin khong hop le, y/c nhap lai 7: Tong doanh thu, so khach, san pham bán nhieu nhat
5: Hop le gui y/c thong ke
Hình 2.10 Biểu đồ cộng tác UC_Thongke
2.2.5.11 Biểu đồ tuần tự UC_Timkiem
: NHANVIEN Form tim kiem sp
DK tim kiem sp : Sanpham : Sanpham 1: Chon thong tin tim kiem
3: Nhap thong tin tim kiem
5: Thuc hien tim kiem 2: Hien thi muc tim kiem
6: Tra ket qua tim kiem 7: Hien thi ket qua tim kiem
Hình 2.11 Biểu đồ tuần tự UC_Timkiem
2.2.5.12 Biểu đồ cộng tác UC_Timkiem
1: Chon thong tin tim kiem 3: Nhap thong tin tim kiem
2: Hien thi muc tim kiem
6: Tra ket qua tim kiem 7: Hien thi ket qua tim kiem
Hình 2.12 Biểu đồ cộng tác tìm kiếm
2.2.5.13 Biểu đồ tuần tự UC_Capnhatsp
: QL Giao dien quan ly san pham
Giao dien quan ly san pham Class xu ly cap nhat SP
Class xu ly cap nhat SP San pham San pham
1: Chon SP can cap nhat
2: Thông tin SP can cap nhat
3: Nhap thong tin can cap nhat
4: Xac nhan thong tin SP
6: Khong hop le yeu cau nhap lai thong tin SP
7: Hop le cap nhat SP 8: Thong bao cap nhat thanh cong
Hình 2.13 Biểu đồ tuần tự UC_Capnhatsp
2.2.5.14 Biểu đồ tuần tự UC_Capnhatsp
Giao dien quan ly san pham
Class xu ly cap nhat SP
San pham 5: Kiem tra tt
1: Chon SP can cap nhat
2: Thông tin SP can cap nhat
4: Xac nhan thong tin SP
6: Khong hop le yeu cau nhap lai thong tin SP
8: Thong bao cap nhat thanh cong
7: Hop le cap nhat SP
Hình 2.14 Biểu đồ cộng tác UC_capnhatsp
2.2.6 Biểu đồ trạng thái a Nhà cung cấp
Nha cung cap lay thong tin nvl
Khong du dieu cung cap
Hình 2.15 Biểu đồ trạng thái nhà cung cấp b Hóa đơn
Mot HD duoc tao lap Thanh toan
Hình 2.16 Biểu đồ trạng thái hóa đơn c Phiếu nhập
Mot phieu nhap duoc tao lap
Nhap hang In phieu nhap
Hình 2.17 Biểu đồ trạng thái phiếu nhập d Nhân viên
Nghi lam Dang lam viec
Dinh chi Vi pham nhe, di lam lai
Duoc tuyen dung Nhan luong
Hình 2.18 Biểu đồ trạng thái nhân viên
Tao sp moi Cap nhat sp moi
Hình 2.19 Biểu đồ trạng thái món f Nguyên vật liệu
Nhan nvl Xac nhân nhan nvl Huy xac nhan
Hình 2.20 Biểu đồ trạng thái món g Khách hàng
Dat sp Kiem tra sp Nhan hang
Nhan xac nhan Du dieu kien
Huy yeu cau dat hang
Hình 2.21 Biểu đồ trạng thái khách hàng
Bao tri Yêu câu nhap nvl
Da nhap nvl vao kho
Hoan thanh Xac nhan nhap day du
Hình 2.22 Biểu đồ trạng thái kho i Bàn
Dat ban Gui yeu cau
Hình 2.23 Biểu đồ trạng thái bàn k Tài khoản-User
Tai khoan dang su dung
Hình 2.24 Biểu đồ trạng thái user
Thiết kế cơ sỡ dữ liệu
STT Tên trường Diễn giải Kiểu dữ liệu Khóa
1 id_user Mã người dùng Serial Khóa chính
2 username Tên tài khoản Varchar
STT Tên trường Diễn giải Kiểu dữ liệu Khóa
1 id_nv Mã Nhân Viên Serial Khóa chính
2 name Tên Nhân Viên Varchar
3 birth_date Ngày sinh Date
5 email Địa chỉ mail Varchar
STT Tên trường Diễn giải Kiểu dữ liệu Khóa
1 id_kh Mã Khách hàng Serial Khóa chính
2 name Tên Khách hàng Varchar
3 birth_date Ngày sinh Date
5 email Địa chỉ mail Varchar
STT Tên trường Diễn giải Kiểu dữ liệu Khóa
1 id_ncc Mã Nhà Cung
4 email Địa chỉ mail Varchar
STT Tên trường Diễn giải Kiểu dữ liệu Khóa
1 id_nl Mã nguyên liệu Serial Khóa chính
3 birth_create Ngày tạo Date
STT Tên trường Diễn giải Kiểu dữ liệu Khóa
1 id_sp Mã món Serial Khóa chính
STT Tên trường Diễn giải Kiểu dữ liệu Khóa
1 id_ban Mã bàn Serial Khóa chính
STT Tên trường Diễn giải Kiểu dữ liệu Khóa
1 id_hd Mã hóa đơn Serial Khóa chính
2 Id_kh Mã Khách hàng int
3 Id_nv Mã nhân viên int
4 Id_sp Mã sản phẩm int
STT Tên trường Diễn giải Kiểu dữ liệu Khóa
1 id_pn Mã hóa đơn Serial Khóa chính
2 Id_ncc Mã nhà cung cấp int
3 Id_nv Mã nhân viên int
4 Id_nl Mã nguyên liệu int
Kết luận chương 2
Xét trên phương diện quản lý, nhà hàng đặt ra vấn đề cho trang web phải đáp ứng những yêu cầu mà trang web quản lý cần có như: quản lý khách hàng, quản lý món, nguyên liệu,… Các chức năng này phải tương ứng với từng đối tượng hoạt động của nhà hàng Ngoài ra, phần mềm cần phù hợp với hệ thống máy chủ của phần mềm hạn chế chi phí đầu tư cho doanh nghiệp
Trên cơ sở đó, trang web đã được xây dựng và hoàn thiện, đáp ứng được yêu cầu đề ra
DEMO CHƯƠNG TRÌNH
Giới thiệu Website quản lý nhà hàng Trầu Cau
Hình 3.1 Website nhà hàng Trầu Cau Website quản lý nhà hàng Trầu Cau là một website vừa đóng vai trò cầu nối giữa nhà hàng với khách hàng, vừa như một quản lý bao quát những hoạt động của nhà hàng Hơn nữa còn có thể hỗ trợ trong kinh doanh giúp tiết kiệm chi phí
Website quản lý nhà hàng Trầu Cau, một website đa chức năng mà một nhà hàng cần phải có, được chia làm hai phần chính:
- Phần Web bán hàng: là nơi nhà hàng tiếp xúc, tạo ấn tượng với khách hàng với những món ngon, chất lượng trên nền nhưng hình ảnh hấp dẫn
- Phần quản lý: đây sẽ là nơi chủ, quản lý của nhà hàng giám sát những hoạt động kinh doanh của nhà hàng mình Từ đó đưa ra chiến lược phù hợp để phát triển mạnh hơn
Website đươc xây dựng trên nền tảng Javascript (nodejs) nên độ an toàn cao, dễ sử dụng, không cần đầu tư lớn Hơn nữa, vì chạy như trên nền tảng Internet nên cực kì thuận tiện cho mọi người dùng
Hướng dẫn cài đặt
Với tiêu chí của phần mềm là thân tiện với khách hàng và người dùng, nên việc cài đặt và sử dụng trang web không hề gây khó khăn Gồm 2 công đoạn cài đặt:
- Cài đặt phía máy Client
- Cài đặt phía máy Server
3.2.1 Cài đặt trên máy Client
Phần mềm được xây dựng trên nền tảng một website nên để sử dụng nó chúng ta cần có một trình duyệt web, chẳng hạn như: Chrome, Firefox, Cốc Cốc, Microsoft Edge Việc cài đặt một trình duyệt web thì lại hoàn toàn dễ dàng Thận chí trong hệ điều hành của máy tính đã tích hợp sẵn một trình duyệt web cho chúng ta
Tuy nhiên, không phải tất cả trình duyệt nào cũng đáp ứng đầy đủ để trang web chạy một cách ổn định với đầy đủ chứ năng Để phần mềm chạy tốt nhất, chúng ta nên cài trình duyệt Chrome của Google Đầu tiên, chúng ta vào link: https://www.google.com/intl/vi_vn/chrome/#eula, chọn Tải xuống Chrome để tải về máy Sau đó, làm theo những hướng dẫn cài đặt của phần mềm
Bước 2: Bạn mở Chrome Setup mới tải về và chọn Run
Bước 3: Click chọn YES và đợi một tý để Google được cài đặt
Khi xuất hiện thông báo như bên dưới thì bạn đã cài đặt Google Chrome thành công
3.2.2 Cài đặt trên máy Server
So với việc cài đặt trên máy Client, việc cài đặt trên máy server có đôi chút khó khăn hơn nhưng không quá phức tạp Để website chạy trên server ta cần hai phần mềm chính là cơ sỡ dữ liệu postgresql và NodeJS
3.2.2.1 Cài đặt NodeJS Để download NodeJS bạn cần truy cập vào địa chỉ dưới đây: https://nodejs.org/en/download/
Sau khi download thành công bạn có một file
Cài đặt NodeJS trên Windows rất đơn giản, chấp nhận các tùy chọn mặc định và nhấn "Next Next" cho tới bước cuối cùng
Vậy là chúng ta đã download và cài đặt thành công Nodejs
Truy cập https://www.postgresql.org/download/windows/ để download bản PostgreSQL cho hệ điều hành Windows
Click đúp vào file exe vừa tải về
Nhập các thông tin cấu hình PostgreSQL khi cài đặt:
Chọn các component cài đặt (nếu bạn chỉ cần server để lưu và truy vấn dữ liệu thì chỉ cần chọn PostgreSQL Server) Ở đây mình chọn tất (pgAdmin 4 tương tự như MySQL Workbench, Stack Builder thì dùng để cài các tools, driver liên quan)
Nhập mật khẩu cho user postgres
(postgres là user mặc định, có quyền cao nhất – superuser)
Chọn cổng / port cho PostgreSQL (port mặc định cho postgreSQL là 5432, nếu chưa bị trùng với port nào thì các bạn cứ để mặc định cho dễ nhớ nhé)
62 pgAdmin 4 được chạy trên server, nên khi click vào nó sẽ tự động mở giao diện pgAdmin trên trình duyệt hoặc các bạn cũng có thể truy cập qua url http://127.0.0.1:54640/browser/
Demo Website quản lý nhà hàng Trầu cau
Để chạy phần mềm, ta truy cập đường dẫn http://localhost:7777/ trên trình duyệt web Website nhà hàng sẽ hiện ra
Hình 3.2 Website nhà hàng 3.3.1 Đối với quản lý
Click chọn đăng nhập với tài khoản admin để vào giao diện quản lý
Hình 3.3 Đăng nhập với tài khoản admin
Hình 3.4 Trang quản lý Click chọn thêm để thêm mới, view để xem thông tin, deleted để xóa thông tin, dữ liệu
Hình 3.5 Thêm dữ liệu mới
Hình 3.6 Xem và thay đổi thông tin
Hình 3.7 Xóa dữ liệu Xác nhận để thao tác được xử lý, hủy để hủy bỏ thao tác
67 Để chuyển đến trang thống kê – báo cáo, chúng ta click chọn mục thống kê báo cáo trên thanh menu bên phải màng hình Chọn thời gian và loại thống kê
Hình 3.8 Trang thống kê báo cáo 3.3.2 Khách Hàng
Sau khi vào trang web của nhà hàng, khách hàng tiến hành booking bằng cách click vào nút đặt bàn Trang web chuyển hướng sang trang booking
Tiến hành điền đầy đủ thông tin cần thiết để xác thật người dùng Với khách hàng quen thuộc có thể đăng nhập trước khi booking để nhận ưu đãi của nhà hàng
Kết luận chương 3
Dựa trên nhiều lần kiểm tra, website đã hoạt động thành công, đáp ứng đầy đủ các yêu cầu của nhà hàng:
Thứ nhất, trang web đã giúp nhà hàng quản lý được các hoạt động của nhà hàng Giúp công việc giám sát kinh doanh thuận lợi nhưng vẫn đảm bảo an toàn cho việc kinh doanh nhà hàng
Thứ hai, trang web đã giúp nhà hàng tiếp cận với khách hàng dễ dàng hơn Qua đó cho thấy đây là một Website đáng đề tin tưởng sử dụng phục vụ cho mục đích của nhà hàng
