Đồ án Tìm hiểu ngôn ngữ lập trình scala, xây dựng website chia sẻ ảnh trực tuyến

TỔNG LIÊN ĐOÀN LAO ĐỘNG VIỆT NAM TRƯỜNG ĐẠI HỌC TÔN ĐỨC THẮNG KHOA CÔNG NGHỆ THÔNG TIN ĐỒ ÁN 1 TÌM HIỂU NGÔN NGỮ LẬP TRÌNH SCALA, XÂY DỰNG WEBSITE CHIA SẺ ẢNH TRỰC TUYẾN Người hướng dẫn: Th.S PHẠM VĂN SIM ANH Người thực hiện: ĐÀO THÀNH ĐẠT LÊ NGỌC NAM Lớp : 11050302 Khoá : 15 THÀNH PHỐ HỒ CHÍ MINH, NĂM 2014 TỔNG LIÊN ĐOÀN LAO ĐỘNG VIỆT NAM TRƯỜNG ĐẠI HỌC TÔN ĐỨC THẮNG KHOA CÔNG NGHỆ THÔNG TIN ĐỒ ÁN 1 TÌM HIỂU NGÔN NGỮ LẬP TRÌNH SCALA, XÂY DỰNG WEBSITE CHIA SẺ ẢNH TRỰC TUYẾN Người hướng dẫn: Th.S PHẠM VĂN SIM ANH Người thực hiện: ĐÀO THÀNH ĐẠT LÊ NGỌC NAM Lớp : 11050302 Khoá : 15 THÀNH PHỐ HỒ CHÍ MINH, NĂM 2014 LỜI CẢM ƠN Sau một thời gian thực hiện Đồ án 1 đến nay, mọi công việc đã hoàn thành. Trong quá trình thực hiện đồ án chúng em đã nhận được nhiều sự giúp đỡ từ mọi người. Em xin chân thành gửi lời cám ơn đến những người chúng em vô cùng biết ơn: Đầu tiên, chúng em rất cám ơn đến thầy Sim Anh đã tận tình hướng dẫn, chỉ bảo và để xuất hướng giải quyết khi chúng em gặp khó khăn trong suốt quá trình hoàn thành đồ án. Để đạt được kết quả này, chúng em cũng rất chân thành gửi lời cám ơn đến toàn thể thầy cô khoa Công Nghệ Thông Tin đã tận tình giảng dạy, trang bị cho chúng em kiến thức trong thời gian học tại trường. Chúng em cũng đồng gửi lời cảm ơn đến các anh chị, bạn bè đã cùng trao đổi, hỗ trợ, chia sẻ giúp chúng em hoàn thành để tài. Mặc dù đã cố gắng hoàn thành đề tài trong phạm vi cho phép, nhưng đây là ngôn ngữ mới, khá xa lạ với chúng em nên không thể tránh khỏi sai sót, chúng em rất mong nhận được sự đóng góp phê bình của các thầy cô để để được những kinh nghiệm khi ra trường và công việc sau này. ĐỒ ÁN ĐƯỢC HOÀN THÀNH TẠI TRƯỜNG ĐẠI HỌC TÔN ĐỨC THẮNG Tôi xin cam đoan đây là sản phẩm đồ án của chúng tôi và được sự hướng dẫn của Th.S Phạm Văn Sim Anh. Các nội dung nghiên cứu, kết quả trong đề tài này là trung thực và chưa công bố dưới bất kỳ hình thức nào trước đây. Những số liệu trong các bảng biểu phục vụ cho việc phân tích, nhận xét, đánh giá được chính tác giả thu thập từ các nguồn khác nhau có ghi rõ trong phần tài liệu tham khảo. Ngoài ra, trong đồ án còn sử dụng một số nhận xét, đánh giá cũng như số liệu của các tác giả khác, cơ quan tổ chức khác đều có trích dẫn và chú thích nguồn gốc. Nếu phát hiện có bất kỳ sự gian lận nào tôi xin hoàn toàn chịu trách nhiệm về nội dung đồ án của mình. Trường đại học Tôn Đức Thắng không liên quan đến những vi phạm tác quyền, bản quyền do tôi gây ra trong quá trình thực hiện (nếu có). TP. Hồ Chí Minh, ngày tháng năm Tác giả (ký tên và ghi rõ họ tên) Đào Thành Đạt Lê Ngọc Nam PHẦN XÁC NHẬN VÀ ĐÁNH GIÁ CỦA GIẢNG VIÊN Phần xác nhận của GV hướng dẫn _______________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________ Tp. Hồ Chí Minh, ngày tháng năm (kí và ghi họ tên) Phần đánh giá của GV chấm bài _______________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________ Tp. Hồ Chí Minh, ngày tháng năm (kí và ghi họ tên) TÓM TẮT Ngôn ngữ scala là một ngôn ngữ lập trình còn khá mới lạ đối với Việt Nam, nhất là đối tượng sinh viên đang còn trên ghế giảng đường. Trên cơ sở đang mê lập trình và thích tìm kiếm những điều mới lạ chúng tôi đã quyết định chọn đề tài “TÌM HIỂU NGÔN NGỮ LẬP TRÌNH SCALA, XÂY DỰNG WEBSITE CHIA SẺ ẢNH TRƯC TUYẾN” làm đề tài nghiên cứu cho nhóm chúng tôi. Bởi vì đây là một ngôn ngữ khá mới mẽ nên hiện nay những tài liệu hoàn chỉnh về ngôn ngữ còn rất hạn chế, đặc biệt là tài liệu Tiếng Việt. Cho nên chúng tôi đã quyết định sử dụng tài liệu Tiếng Anh và các bài thảo luận trên các diễn đàn nước ngoài làm nguồn hỗ trợ chính. Ban đầu cách tiếp cận này có thể gặp nhiều khó khăn, nhất là đối với những thuật ngữ riêng trong ngành, ngôn ngữ lập trình. Tuy nhiên, sau khi đã nắm được những đặc điểm cơ bản thì việc tìm hiểu sẽ trở nên dễ dàng hơn nhiều. Sau đề tài chúng tôi nhận ra rằng nghiên cứu những tài liệu tiếng nước ngoài và thông qua các diễn đàn sẽ mang lại một lượng kiến thức lớn và nhanh chóng hơn cách cổ điển với những cuốn sách rất nhiều. Tự nghiên cứu sẽ giúp chúng ta nhớ kiến thức tìm kiếm được lâu hơn và tạo một thói quen tốt sau này. Sau khi nghiên cứu đề tài chúng tôi đã quyết định chia thời gian nghiên cứu làm hai giai đoạn: Giai đoạn một, tập trung nghiên cứu về những vấn đề cơ bản của ngôn ngữ, những khái niệm cơ bản của một ngôn ngữ lập trình phải có, công cụ để hỗ trợ biên dịch làm sao có thể chạy được một chương trình đơn giản ví dụ như “Hello World” . Tiếp đến giai đoạn hai, sẽ tập trung nghiên cứu về framework hỗ trợ cho việc viết web trên ngôn ngữ được giao, từ đó xây dựng trang web theo yêu cầu của đề tài Đồ án. Trên cơ sở nỗ lực của nhóm và sự định hướng, giúp đỡ nhiệt tình của người hướng dẫn Th.S Phạm Văn Sim Anh , chúng tôi đã đạt được những thành quả bước đầu trong việc tìm hiểu và sử dụng một ngôn ngữ lập trình mới để giải quyết yêu cầu được đặt ra. Không những thế còn nâng cao khả năng tìm hiểu và kỹ năng lập trình cho mỗi thành viên của nhóm. Mang lại những kinh nghiệm quý báu cho sau này. MỤC LỤC DANH MỤC KÍ HIỆU VÀ CHỮ VIẾT TẮT CÁC CHỮ VIẾT TẮT STT Chữ viết tắt Chữ viết đầy đủ 1 CMD Command line 2 JDK Java Development Kit 3 DSLs Domain Specific Languages 4 JVM Java Virtual Machine 5 E-RD Entity–relationship Diagrams 6 NIO Non-Blocking I/O 7 Java EE Java Platform, Enterprise Edition Bảng 0.1: Bảng các chữ viết tắt DANH MỤC CÁC BẢNG BIỂU, HÌNH VẼ, ĐỒ THỊ DANH MỤC HÌNH Hình 1.1: Tạo Project mới bằng Bundle of the Scala IDE for Eclipse 8 Hình 1.2: Biên dịch và thực thi bằng Command Line 10 Hình 1.3: Khai báo hàm – [1, pp. 69] 11 Hình 1.4: Kiểu dữ liệu và phạm vi [1, pp.108] 12 Hình 1.5: Lược đồ kiến trúc Play Framework 1 15 Hình 1.6: Kiến trúc Play Framework 2 16 Hình 2.7: Kiểm tra cài đặt JDK 18 Hình 2.8: Thêm đường dẫn vào biến môi trường 19 Hình 2.9: Kiểm tra tồn tại của Play Framework 2 20 Hình 2.10: Tạo project mới trong Play Framework 20 Hình 2.11: Chọn ngôn ngữ cho project sẽ tạo 21 Hình 2.12: Chạy project web mới được tạo trên trình duyệt 21 Hình 3.13: Usecase tổng quát 23 Hình 3.14: Usecase đăng nhập 24 Hình 3.15: Usecase theo tác người dùng 24 Hình 3.16: Usecase quản lý dữ liệu cá nhân 24 Hình 3.17: Usecase đăng ký 25 Hình 3.18: Usecase quản lý website 25 Hình 3.19: Lược đồ tuần tự 27 Hình 3.20 Mô hình ER-D 30 Hình 3.21: Giao diện chính 31 Hình 3.22: Giao diện phần trên 31 Hình 3.23: Giao diện phần giữa 32 Hình 24: Guao diện phần cuối 33 Hình 3.25: Giao diện hình ảnh theo danh mục 34 Hình 3.26: Giao diện tìm kiếm 35 Hình 3.27: Giao diện chi tiết hình ảnh 35 Hình 3.28: Hình ảnh phóng lớn khi rê chuột vào 36 Hình 3.29: Hình cùng người đăng 36 Hình 3.30: Giao diện đăng ký thành viên 37 Hình 3.31: Thanh menu khi chưa đăng nhập 37 Hình 3.32: Giao diện đăng nhập 38 Hình 3.33: Thanh menu sau khi đã đăng nhập 38 Hình 3.34: Thông tin tài khoản 39 DANH MỤC BẢNG Bảng 0.1: Bảng các chữ viết tắt 3 Bảng 3.2: Mô tả hoạt động usecase 26 CHƯƠNG 1 – TÌM HIỂU VỀ NGÔN NGỮ SCALA Tổng quan về ngôn ngữ Scala Giới thiệu Scala là tên viết tắt của Scalable Language (Ngôn ngữ có khả năng mở rộng). Được phát triển dựa trên những nhu cầu sử dụng các tính năng mở rộng của nó. Scala được thiết kế để tích hợp các tính năng của lập trình hướng đối tượng và lập trình hàm.[2] Nền tảng Scala chạy trên nền máy ảo java và tương thích với chương trình java. Cũng có thể chạy trên android. Nó cũng có thể chạy trên nền tảng .NET nhưng mà chưa ổn định. Scala có kiểu biên dịch giống như Java và C#, nên Scala code có thể đọc được thư viện Java (hoặc thư viện.NET).[2] Khả năng mở rộng Trong thực tế, các ứng dụng luôn phải thay đổi để đáp ứng các yêu cầu cụ thể, Scala được thiết kế để phục vụ mục đích đó. Scala cung cấp một dạng ngôn ngữ máy độc đáo giúp hỗ trợ lập trình dựa tên các thư viện hàm có sẵn: Mọi phương thức (hàm) đều có thể dùng như là một toán tử Đánh dấu kết thúc cú pháp tự động.[2] Lập trình hàm Scala hỗ trợ lập trình hàm. Nó hỗ trợ cú pháp ngắn gọn cho việc định nghĩa các hàm, cho phép hàm lồng vào nhau. Dùng từ khóa lazy để trì hoãn sử dụng một biến cho đến khi cần sử dụng nó.[2] Lập trình hướng đối tượng Giống Java, Scala là ngôn ngữ hướng đối tượng. Scala là ngôn ngữ thuần lập trình hướng đối tượng trong cú pháp theo quy tắc tất cả giá trị biến đều là một đối tượng. Kiểu dữ liệu và hành vi của một đối tượng được mô tả bằng các lớp. Các lớp trừu tượng được mở rộng bằng các lớp con và hạn chế các khó khăn trong đa kế thừa.[2] Những đặc điểu nổi bật khác Nhờ suy luận kiểu của nó và các tính năng khác, Scala là một ngôn ngữ súc tích, điển hình là cho phép các nhà phát triển để giảm kích thước của mã nguồn ít nhất ai hoặc ba lần, so với Java. Scala đi kèm với một tập hợp phong phú các công cụ phát triển, vì vậy hiệu suất tương đương với các ngôn ngữ như Ruby hay Python, trong khi giữ lại những ưu điểm hiệu suất của Java Scala được trang bị hệ thống phát hiện và tránh nhiều lỗi ứng dụng tại thời gian biên dịch. Scala cung cấp một sự kết hợp độc đáo của các cơ chế ngôn ngữ khiến nó dễ dàng để thêm các cấu trúc ngôn ngữ mới theo hình thức thư viện, hoặc để tạo ra ngôn ngữ miền đặc trưng (DSLs).[2] Giới thiệu công cụ hỗ trợ và biên dịch một chương trình đơn giản Công cụ hỗ trợ Để có thể viết và biên dịch được chương trình được viết bằng ngôn ngữ Scala cần có những công cụ sau Java Developer Kit (JDK) phiên bản 5 trở lên. Có thể tải ở đường dẫn sau: Scala SDK và Bundle of the Scala IDE for Eclipse. Có thể tải ở đường dẫn sau: Tạo Project và viết ứng dụng “Hello World” Sau khi khởi đông Bundle of the Scala IDE for Eclipse, hoàn toàn tương tự như Java, tạo project ta chọn: File ->New ->Scala Project. Hình 1.1: Tạo Project mới bằng Bundle of the Scala IDE for Eclipse Ứng dụng “Hello World: object HelloWorld{ def main(args:Array[String]){ println("Hello, World! ") } } Cấu trúc chương trình cũng giống như ở Java. Nó bao gồm một phương thức gọi hàm main, với các đối số dòng lệnh, một mảng các chuỗi như một tham số. Thân phương thức bao gồm một lời gọi duy nhất lệnh println với đối số Hello, Word!. Phương thức main không trả về giá trị, vì thế không cần thiết phải khai báo kiểu trả về . Điều khác biệt nhất với người lập trình Java là từ khóa Object bao gồm phương thức main chứa trong nó. Từ khóa Object ngầm định là tạo một thể hiện đơn của một lớp trong Scala. Ta có thể thấy rằng, phương thức main không được khai báo static. Trong Scala, các thành viên tĩnh (phương thức, trường) không tồn tại. Biên dịch Để biên dịch chương trình chúng ta sử dụng scalac(scala compiler), Trình biên dịch Java. Scalac hoạt động giống như hầu hết các trình biên dịch khác. Nó có một file nguồn giống như đối số, có thể có vài tùy chọn và tạo ra một hoặc vài file đối tượng. Chúng ta có thể lưu chương trình trên thành file với tên HelloWord.scala và có thể thực hiện biên dịch nó bằng sử dụng lệnh (command line) bên dưới: > scalac HelloWorld.scala Sau khi gọi lệnh trên nó sẽ tạo ra vài file class trong cùng thư mục với file HelloWord.scala. Một trong số đó sẽ có HelloWorld.class, và chứa một class có thể được thực thi trực tiếp bằng cách sử dụng lệnh scala, như các chương trình phần tiếp theo. Biên dịch và thực thi Scala source bằng Command Line Chương trình trên ta lưu thành file HelloWord.scala tại D:\test Đầu tiên ta gọi lệnh: >D: Tiếp theo trỏ đến thư mục test bằng lệnh: >cd test Để biên dịch ta xài lệnh: > scalac HelloWorld.scala Nếu không có lỗi sẽ không có thông báo gì, tiếp theo để thực thi chương trình ta dùng lệnh: >scala HelloWord Chượng trình sẽ in ra kết quả là: Hello, Word! Chi tiết được hiển thị như hình dưới: Hình 1.2: Biên dịch và thực thi bằng Command Line Những khái niệm cơ bản trong ngôn ngữ Scala Khai báo biến Có 2 loại biến trong Scala: biến val và biến var. Biến val tương tự như biến final trong java, sau khi được khai báo thì không thể thay đổi giá trị. Còn biến var thì ngược lại, sau khi khi báo vẫn có thể thay đổi giá trị. Ví dụ về khai báo một biến: Val count : Int Cách khai báo phương thức/ hàm Hình 1.3: Khai báo hàm – [1, pp. 69] Khai báo một hàm/phương thức bắt đầu bằng từ khóa def sau đó tới tên hàm/phương thức, các giá trị đầu vào nằm trong dấu ngoặc đơn. Tiếp sau đó là dấu : và kiểu dữ liệu trả về. Nội dung hàm/phương thức nằm trong cặp dấu ngoặc nhọn {} Cấu trúc lặp, rẽ nhánh và điều kiện While: var i = 0 while (i < args.length) { println(args(i)) i += 1 } foreach: args.foreach((arg: String) => println(arg)) for: for (arg <- args) println(arg) ví dụ: for (i <- 0 to 2) print(greetStrings(i)) if: if (i != 0) print(" ") Kiểu dữ liệu Hình 1.4: Kiểu dữ liệu và phạm vi [1, pp.108] Trong ngôn ngữ Scala cũng kiểu dữ liệu cơ bản như mọi ngôn ngữ lập trình khác. Class Định nghĩa 1 class: class Checksum { var sum = 0 } Sử dụng class: val acc = new Checksum Phương thức trong class class ChecksumAccumulator { private var sum = 0 def add(b: Byte): Unit = { sum += b } def checksum(): Int = { return ~(sum & 0xFF) + 1 } } Một số gói thư viện cơ bản trong ngôn ngữ scala Scala đây là gói chứa các thành phần cốt lõi của ngôn ngữ scala ngoài ra còn có các gói con sau: scala.collection và các gói con của nó có chứa bộ sưu tập framework với các chức năng bậc cao cho các thao tác. scala.io : Quản lý nhập xuất. scala.math : các hàm toán học cơ bản và các kiểu số học bổ sung. scala.sys : Tương tác với các tiến trình khác và hệ điều hành. scala.util.matching - mẫu kiểm tra tính phù hợp bằng chữ sử dụng biểu thức thông thường. scala.util.parsing.combinator : sử dụng để phân tích cú pháp scala.xml : phân tích cú pháp XML, thao tác, và tuần tự hóa. CHƯƠNG 2 – TÌM HIỂU VỀ PLAY FRAMEWORK 2 Tổng quan về Play Framework 2 Khái niệm Play là một chương trình khung dùng để tạo các ứng dụng web, được viết bằng Scala and Java theo kiến trúc model–view–controller (MVC). Play được tạo ra với mục đích tăng hiệu suất lập tình bằng các sử dụng quy ước bằng cấu hình, tải lại mã nóng và hiển thị lỗi trên trình duyệt – Nguồn [2] Những điểm nổi bật Play Framework 2 là một framework để viết web bằng ngôn ngữ java và scala với tiêu chí nhẹ, không trạng thái, thân thiện với nền tảng web các đặc điểm sau: Dựa trên nền tảng java JVM(Java Virtual Machine): Có thể sử dụng đa nền. Thân thiện với người phát triển: Bạn chỉ cần chỉnh sửa trong text-editor và sau đó nhấn refresh trên trình duyệt web, mọi chỉnh sửa sẽ có hiệu lực. Quy mô đơn giản: Bên dưới nền tảng Play sử dụng một mô hình hoàn toàn bất đồng bộ được xây dựng trên Akka. Kết hợp với đặc điểm không trạng thái của web, quy mô của Play trở nên đơn giản. Thích hợp cho cả Web và moblie: Play có thể hoạt động tốt trên cả nền tảng web và mobile. – Nguồn [4] Lịch sử phát triển kiến trúc Play Framework Play Framework 1 Hình 1.5: Lược đồ kiến trúc Play Framework 1 Nguồn [3] Play framework 1 được tích hợp rất nhiều gói thư viện hỗ trợ, mỗi gói thư việc hỗ trợ một số chức năng nhất định, sau đây là những gói thư viện chính: Netty: Netty là một framework hỗ trợ giao tiếp theo dạng NIO (Non-Blocking I/O) giữa máy chủ và máy trạm. Điều này giúp cho việc giao tiếp giữa máy chủ và máy trám trở nên nhanh chóng và dễ dàng hơn rất nhiều. Nó đơn giản và phù hợp với việc lập trình socket các phương thức như TCP và UDP ở máy chủ. Mặc dù Play được thiết kế để chạy trên máy chủ web JBoss Netty, nhưng nó hoàn có thể đóng gói theo kiểu WAR và sử dụng trong những máy chủ khác bằng Java EE. JPA and Hibernate: Đây là 2 gói thư viện hỗ trợ quản lý thực thể và truy vấn cơ sở dữ liệu Groovy: Được sử dụng như một công cụ để tạo ra giao diện web. Mã nguồn giao diện web sử dụng Groovy ở dạng text như html nhưng có thể chèn thêm những dòng lệnh để sinh ra nội dung đọng. Cú pháp của ngôn ngữ Groovy cũng tương tự như Java. Play Framewrok 2 Hình 1.6: Kiến trúc Play Framework 2 Nguồn [3] Play 2 là đánh dấu một bước chuyển lớn của Play đối với ngôn ngữ Scala. Trong Play 2 thư viện cho ngôn ngữ đã được sử dụng. Những phiên bản trước đó của Play Framework chủ yếu viết cho ngôn ngữ Java (Scala chỉ được sử dụng như một plug-in), nhưng trong Play 2.0 Scala đã trở thành một trong hai ngôn ngữ chính(ngang tầm với Java). Trong phiên bản mới của Play Framework đã có nhiều thành đổi nhằm đơn giản và tối ưu hóa cho Play. Sau đây là những thay đổi chính: Scala-library: Gói thư viện cho ngôn ngữ Scala đã được chính thức thêm vào. Groovy đã bị lược đi: Play 2 không còn sử dụng groovy nữa, thay vào đó là Scala templates. JPA and Hibernate cũng được lược bỏ: Trong phiên bản 2.0 trở đi Play không còn sử dụng hai gói thư viện này để hỗ trợ quản lý thực thể nữa, thay vào đó là một lớp truy xuất dữ liệu mới tên là Anorm. Arnorm được sử dụng để truy xuất dữ liệu từ cơ sở dữ liệu sau đó chuyển vào các thực thể một cách rất đơn giản. Akka được sử dụng làm tác nhân chính để đáp ứng xu hướng mới là phát triển một ứng dụng hiệu năng cao và đáng tin cậy (Nguồn tham khảo [3]) Hướng dẫn cài đặt Play Framework 2 Những công cụ cần thiết Để có thể sử dụng được Play Framework 2 cần có những công cụ sau JDK 6 hoặc mới hơn. Có thể tải về ở đường dẫn sau: Mã nguồn Play Framework 2. Có thể dùng 1 trong 2 bản sau: Typesafe Activator bao gồm: Activator, Akka, Play, Scala. Play standalone distribution chỉ bao bồm Play (Lưu ý: Bài hướng dẫn sử dụng gói Play standalone distribution) Cài đặt và kiểm tra Bước 1: Cần đảm bảo đã cài đặt JDK. Có thể kiểm tra bằng Command Line(CMD) bằng cú pháp java –version và javac –version Hình 2.7: Kiểm tra cài đặt JDK Bước 2: Giải nén gói Play standalone distribution ở trên và copy vào một nơi bất kỳ (trong ví dụ tên thư mục sẽ là play-2.2.2 đặt ở đường dẫn C:\) Bước 3: Thêm đường dẫn thư mục chứ Play vào biến môi trường (Environment variables). Trong ví dụ là: C:\play-2.2.2\ Hình 2.8: Thêm đường dẫn vào biến môi trường Bước 4: Kiểm tra sự tồn tại của Play Framework 2 Trong CMD sử dụng cú pháp play help nếu có thông tin của Play Framework 2 xem như công việc cài đặt đã thành công. Hình 2.9: Kiểm tra tồn tại của Play Framework 2 Tạo mới một chương trình sử dụng Play Framework Để tạo mới một project bằng Play ta chọn đến vị trí cần tạo và dùng lệnh: $ play new myFirstApp Tiếp theo ta nhập vào tên project. Hình 2.10: Tạo project mới trong Play Framework Sau đó ta chọn Java hoặc Scala tương ứng, chọn số 1 để chọn Scala application Nhấn enter và tạo thành công project scala trên Play Hình 2.11: Chọn ngôn ngữ cho project sẽ tạo Để tạo cho eclipse có thể import được ta dùng lệnh: $ play eclipse Sau đó chạy project bằng lệnh: $ play run Mở trình duyệt web với port 9000 ta đã sẽ thấy giao diện của Play Framework. Hình 2.12: Chạy project web mới được tạo trên trình duyệt Import project vừa tạo vào eclipse và bắt đầu tạo web bằng ngôn ngữ Scala. CHƯƠNG 3 – DEMO WEB CHIA SẺ ẢNH Khảo sát và phân tích hệ thống Phân tích yêu cầu Tên đề tài Thiết kế trang web chia sẻ ảnh sử dụng ngôn ngữ scala Phân tích yêu cầu Đây là một website chia sẻ và lưu trữ hinnhf ảnh của người dùng, tiện lợi và bảo mật, bao gồm các yêu cầu sau: Người dùng Ở trang chủ hiển thị một số những hình ảnh tiêu biểu , hình ảnh mới, thông tin về hình ảnh bao gồm tên ảnh, ngày đăng, người đăng, ghi chú… Do có nhiều thể loại nên cần chia thành các danh mục khác nhau, menu ngang hiển thị danh sách các danh mục để dễ dàng cho người dùng tìm kiếm và xem hình ảnh theo loại. Cần có trang hiển thị đầy đủ thông tin của mỗi hình ảnh khi nhấp chuột vào hình đó, kèm thêm đó là các gợi ý danh sách hình của cùng người đăng hiện thị ngay bên dưới chi tiết hình đang xem. Người dùng có thể thích hoặc chia sẻ hình ảnh đó lên trang facebook cá nhân của mình để giới thiệu với mọi người và tạo các album khác nhau Người dùng cũng có thể đăng hình để chia sẻ đến mọi người hoặc lưu trữ ở chế độ riêng tư. Người dùng cũng có thể quản lý hình ảnh mà mình đăng lên. Quản trị viên. Người quản trị viên có thể quản lý thông tin người dùng Quản lý thông tin hình ảnh Quản lý các danh mục hình ảnh Xóa các hình ảnh hoặc danh mục do đã được tạo.. Từ những yêu cầu trên ta xây dựng được những chức năng trên: - Cho phép đăng hình vào cơ sở dữ liệu. - Cho phép người dùng đăng kí thành viên mới. - Hiển thị danh sách các sản phẩm theo từng loại. Hiển thị hình ảnh theo thời gian đăng, theo số lượt thích, theo số lượt xem, theo … Hiển thị thông tin người dùng Tìm kiếm hình ảnh theo tên Cập nhật thông tin ảnh hình ảnh Lược đồ usecase Usecase tổng quát Hình 3.13: Usecase tổng quát Người dùng có thể đăng nhập, đăng xuất, đăng ký, upload hình, quản lý dữ liệu của tài khoản mình. Ngoài chức năng đăng ký ra, người quản trị website có hết các chức năng của người dùng, và còn có thêm chức năng quản lý thông tin, dữ liệu của toàn website. Usecase chi tiết Usecase Đăng Nhập: Hình 3.14: Usecase đăng nhập Usecase Thao tác trên website Hình 3.15: Usecase theo tác người dùng Usecase Quản lý dữ liệu cá nhân: Hình 3.16: Usecase quản lý dữ liệu cá nhân Usecase Đăng ký Hình 3.17: Usecase đăng ký Usecase quản lý website: Hình 3.18: Usecase quản lý website STT Use Case Actor Mô Tả 1 Đăng Nhập Quản Trị và Người dùng Thực hiện việc đăng nhập vào hệ thống để thực hiện các chức năng yêu cầu 2 Đăng Xuất Quản Trị và Người dùng Thực hiện xóa phiên làm việc hiện thời và thoát hoẳn tài khoản ra khỏi hệ thống. 3 Thao tác trên website Quản Trị và Người dùng Có thể thực upload hình mới, tìm kiếm hình, xem hình. 4 Quản lý dữ liệu cá nhân Quản Trị và Người dùng Có thể trực tiếp xem danh sách những hình mình đã upload, chỉnh sửa các thông tin hoặc xóa hình. Xem được thông tin của mình khi đăng kí, reset pass… 5 Đăng ký Người dùng Tạo một tài khoản mới để có thể sử dụng hết các chức năng của hệ thống 6 Quản lý website Quản Trị Xem danh sách tất cả các hình, duyệt những hình được đăng, sửa xóa nó. Xem danh sách tất cả các tài khoản được tạo, có thể chỉnh sửa thông tin, khóa nick hoặc khóa nick. Bảng 3.2: Mô tả hoạt động usecase Hình 3.19: Lược đồ tuần tự Phân tích và thiết kế hệ thống Sau khi khảo sát em đã nắm bắt được các thông tin : Quản lý người dùng : Mỗi người dùng được quản lý các thông tin sau: họ tên, địa chỉ, số điện thoại, email. Quản lý hình ảnh: mã, tên ảnh, thể loại, địa chỉ ảnh, lượt xem, người đăng, ghi chú, album, ngày đăng, lượt thích, chế độ, trạng thái Phân tích hệ thống Sau khi khảo sát hiện trạng của hệ thống và xây dựng hệ thống thì em dã đưa ra các tệp CSDL của “Web chia sẻ ảnh”: Các bảng cơ sở dữ liệu: Gồm có 9 bảng csdl: album, category,comment,images,level, likes, members,shares, warning. Tất cả cơ sở dữ liệu được đính kèm cùng file chiaseanh.sql. Album(id,albumName,categoryID,owmerID, views,notes, createDate,cover) Category(id,name,description,numerical_order) Comment(id,sentBy,imgID,content,postDate) Images(ID, imgName ,categoryID, link, views ,ownerID ,note, albumID ,postDate ,likeTimes ,viewsMode , status) Level(id, name) Likes(imgID,memberID,time) Members(id, username, password, sex, birthday, realName, emao;. Introduce, avartar, posttime, level, banned) Dữ liệu gồm các table: Category lưu trữ những chủ đề hình ảnh do admin tạo ra, sẽ có mục orther cho những hình ảnh không thuộc nội dung được liệt kê sẵn. Gồm các thông tin sau: Id: Đinh danh của chủ đề Name: tên chủ đề Description: mô tả về chủ đề Numerical_order: thứ tự hiển thị trên trang chủ Images lưu trữ thông tin hình ảnh gồm có Id: Định danh của hình ảnh ImgName: tên hình ảnh categoryID: id của chủ đề hình ảnh link: địa chỉ hình views: số lượt xem ownerID: ID người đăng note: ghi chú, mô tả albumID: id album hình ảnh đó, có thể rỗng nếu ảnh không có album postDate: ngày đăng likeTimes: số lượt like viewMode: những người có thể xem hình ảnh này gồm 3 giá trị 0: public, 1: chỉ bạn bè, 2: chỉ người đăng member thông tin thành viên gồm: id: Định danh của thành viên username: tên đăng nhập password: mật khẩu realName: tên thật email: email introduce: giới thiệu avatar: hình đại diện postTimes: số hình đăng level: lưu quyền hạn của thành viên. Liên kết với table level gồm 2 giá trị 0: thành viên, 5: admin. banned: thành viên bị cấm hay không. Likes, shares lưu trữ share và like của hình gồm: imgID: id hình ảnh memberID: id của người like/share time: thời gian share/like content: (đối với share) là nội dung chia sẻ cũng hình ảnh comment lưu trữ thông tin bình luận id: định danh của bình luận sendBy: id của người bình luận imgID: id hình ảnh được bình luận content: nội dung bình luận postDate: ngày bình luận album những album hình do người dùng tạo để nhóm các hình ảnh id: định danh của album albumName: tên album categoryID: chủ đề cua album ownerID: id người tạo album views: số lượt xem note: ghi chú, mô tả createDate: ngày tạo cover: bìa warning cảnh báo thành viên hình vi phạm id: đinh danh của cảnh báo memberID : đinh danh của thành viên bị cảnh báo imgID: hình bị cảnh báo reason: lý do bị cảnh báo expireDay ngày hết hạn. Đến ngày này thành viên đó sẽ bị cấm. Hình 3.20: Mô hình ER-D GIAO DIỆN VÀ CHỨC NĂNG Tổng quan về giao diện Màn hình giao diện chính Hình 3.21: Giao diện chính Phần trọng tâm của trang chủ là danh sách các hình ảnh mới cập nhật cùng thông tin cơ bản của hinh ảnh đó. Các phần cắt trên, giữa, dưới của trang web Phần trên của trang web: Hình 3.22: Giao diện phần trên Liên kết đến các danh mục quản lý tài khoản, album, thông tin cá nhân, đăng nhập, đăng ký Liên kết đến các danh mục Về trang chủ, hình ảnh, giới thiệu, hướng dẫn, liên hệ, thanh tìm kiếm. Hình ảnh giới thiệu. Các danh mục: hiển thị hình theo ngày đăng, theo số lần thích, số lần xem Danh mục ác chức năng: đăng ảnh mới, hình ảnh của tôi, thông tin. Phần giữa: Hình 3.23: Giao diện phần giữa Danh mục hướng dẫn người dùng Liệt kê danh sách hình thành viên và thông thin Phần cuối Hình 24: Guao diện phần cuối Liệt kê danh sách hình mới đăng và thông tin Tiêu đề chân trang bao gồm các liên kết đến Trang chủ, hình ảnh, thắc mắc, liên hệ, tên người thực hiện Tổng quan về giao diện Giao diện chi tiết và chức năng Giao diện người dùng Menu ngang Tại menu ngang bao gồm các liên kết đến với trang chủ, danh mục hình ảnh, giới thiệu, hướng dẫn và liên hệ. Ngoài ra phía bên trái còn có thanh tìm kiếm. Với danh mục hình ảnh, người dùng có thể lựa chọn để xem theo mỗi thể loại hình ảnh khác nhau. Hình 3.25: Giao diện hình ảnh theo danh mục Thanh tìm kiếm: Người dùng có thể tìm kiếm theo tên các hình ảnh mà mình muốn, kết quả sẽ trả về danh sách các hình có tên gần giống với từ khóa tìm kiếm. Bên dưới là kết quả tìm kiếm với từ “ mèo” Hình 3.26: Giao diện tìm kiếm Chi tiết hình ảnh Khi người dùng nhấn vào hình ảnh nào đó, nó sẽ chuyển đến trang hiển thị chi tiết sản phầm đó với tên ảnh, ngày đăng, số lần xem, số lần thích, người đăng, nút like và share facebook. Hình 3.27: Giao diện chi tiết hình ảnh Khi đặt chuột lên hình, nó sẽ phóng to hình bên cạnh để người dùng thấy nó ở kích thước lớn hơn. Hình 3.28: Hình ảnh phóng lớn khi rê chuột vào Ngoài ra trang chi tiết sản phẩm còn có hiển thị những hình ảnh cùng người đăng để người dùng dễ dàng xem Hình 3.29: Hình cùng người đăng Đăng ký thành viên Người dùng có thể đăng ký làm thành viên của trang web để có thể đăng hình và thực hiên nhiều chức năng hơn. Để đăng ký người dùng nhấn vào chức năng đăng ký ở menu phần đầu trang web. Sau đó cung cấp những thông tin cần thiết như tài khoản, mật khẩu, email… để hoàn tất đăng ký. Hình 3.30: Giao diện đăng ký thành viên Giao diện Quản trị Đăng Nhập – Quản trị hệ thống Giao diện trang khi chưa đăng nhập: Khi chưa đăng nhập giao diện trang sẽ hiện ra 2 link Đăng ký và Đăng nhập để người dùng có thể sử dụng. Hình 3.31: Thanh menu khi chưa đăng nhập Đăng Nhập Hệ Thống Khi người dùng nhấn vào link đăng nhập, hệ thống sẽ chuyển đến trang giao diện đăng nhập với 2 trường nhập trên người dùng và mật khẩu, nếu thông tin người dùng nhập vào không đúng với những gì đã lưu trong cơ sở dữ liệu, sẽ có thông báo để người dùng nhập lại. Nếu thông tin nhập được chấp nhận(đúng tài khoản mật khẩu), hệ thống sẽ chuyển về trang chủ. Kèm với lời chào hiện tên nick đó và nút thoát thay đổi trên thanh tiêu đề phía trên. Hình 3.32: Giao diện đăng nhập Hình 3.33: Thanh menu sau khi đã đăng nhập Đăng Xuất Tài Khoản Sau khi nhấn vào nút thoát hệ thống sẽ tự động xóa phiên làm việc (session) của nick đó vào trở lại trang chủ như chưa đăng nhập Giao diện quản lý tài khoản và hình ảnh. Nhấn vào thông tin cá nhân nó sẽ hiện ra trang thông tin cá nhân bao gồm các tùy chọn bên phải. Hình 3.34: Thông tin tài khoản Upload hình: Khi người dùng chọn mục đăng hình, hệ thống sẽ chuyển tới trang giao diện như Hình 3.35, cho phép người dùng chọn tên ảnh, thể loại, album, đường dẫn đến ảnh, mô tả và chế độ đăng. Sau khi upload hình thành công hình sẽ được lưu tại thư mục /public/images/store, và được đổi tên thành số thứ tự lớn nhất trong những hình đã được lưu trước đó. Tạo mới Album: Khi chọn mục Tạo album, hệ thống sẽ chuyển tới giao diện tạo album như bên dưới, người dùng điền đầy đủ thông tin và nhấn nút tạo, khi thành công một album sẽ được tạo ra trong cơ sở dữ liệu với tham chiếu đến tài khoản đó. Quản lý hình ảnh đã đăng Mỗi người dùng có thể quản lý hình ảnh đã đăng của mình khi nhấn vào liên kết Quản lý Hình ảnh, cho phép người dùng xem thông tin ảnh hiển thị, ngoài ra có thể xóa nó. Quản lý Album đã tạo: Nhấn vào Quản lý Album sẽ cho phép người dùng xem những album mình đã tạo để chỉnh sửa hoặc xóa nó. Quản lý hệ thống của Quản trị viên: Với những tài khoản có quyền quản trị viên (administrator) thì mục bảng điều khiển sẽ có mục AdminCP dẫn tới trang quản lý hệ thống toàn website, bao gồm quản lý hình ảnh và quản lý người dùng, giao diện như hình dưới: Quản lý hình ảnh của Quản trị viên Khi chuyển tới trang quản trị hình ảnh của Quản trị viên, danh sách tất cả các hình đã được đăng của các người dùng đều hiển thị cùng với thông tin của hình, bao gồm các tùy chọn xóa, sửa và duyệt ảnh (chấp nhận ảnh khi ảnh đã đăng). Quản lý người dùng của Quản trị viên: Trang quản lý người dùng sẽ hiển thị thông tin của người dùng đó với các tùy chọn chỉnh sửa, xóa tài khoản và khóa người dùng (ban). Ngoài những giao diện trên bọn em đã xử lý khá tốt việc kiểm tra quyền khi người dùng bình thường cố gắng truy cập trang quản lý giúp bảo mật hơn cho hệ thống. CHƯƠNG 4 – TỔNG KẾT Kết quả đạt được Về công nghệ Về cơ bản đã hiểu và vận dụng được ngôn ngữ mới – ngôn ngữ Scala – vào mục đích công việc của mình. Hiểu hơn về web framework 2 nói riêng và cấu trúc của một framework nói chung tạo tiền để cho việc nghiên cứu những công nghệ mới sau này một cách dễ dàng hơn. Về kỹ năng Nâng cao kỹ năng lập trình của mỗi thành viên trong nhóm, cải thiện kỹ năng làm việc nhóm và có thêm nhiều kinh nghiệm trong việc tự học, tự nghiên cứu. Trau dồi kỹ năng đọc hiểu tài liệu tiếng nước ngoài. Đánh giá chung Ưu điểm Biết vận dụng một ngôn ngữ mới, framework mới vào mục đích nhất định. Ưu tiên tìm hiểu và sử dụng những công nghê mới vào sản phẩm Vận dụng tốt kiến thức từ tài liệu và những bài thảo luận trên diễn đàn. Có đầu tư cho sản phầm về nhiều mặt: công nghệ, ngôn ngữ, chức năng, giao diện… Sản phẩm phát triển có được những chức năng cơ bản tương đối hoàn chỉnh và có một số chức năng nâng cao. Nhược điểm Chưa khác thác hết những ưu điểm của ngôn ngữ. Chưa hiểu hoàn toàn về ngôn ngữ Viết code chưa thực sự trong sáng, dễ hiểu. Hướng phát triển “Tìm hiểu ngôn ngữ lập trình scala, xây dựng website chia sẻ ảnh trưc tuyến” là môt đề tài hay và rộng để nghiên cứu. Trong khuôn khổ thời gian có hạn chúng tôi chưa thể nghiên cứu hết hết những yêu cầu đề tài đặt ra. Trong tương lai nếu có thời gian chúng tôi sẽ dự định phát triển đề tài được giao theo hướng sau: Tìm hiểu thêm về ngôn ngữ để có thể sử dụng một cách hiệu quả hơn ngôn ngữ Scala. Nghiên cứu những thư viện hỗ trợ khác của Play framework 2 để có thể xử lý yêu cầu nhanh và hiệu quả. Tối ưu những đoạn code còn nhập nhằng. Phát triển thêm những chức năng còn thiếu và cần thiết cho sản phẩm của mình. TÀI LIỆU THAM KHẢO Tiếng Anh Martin Odersky, Lex Spoon, Bill Venners, Programming in Scala First Edition, Version 6 Giao diện Web có tham khảo giao diện của: