Friday, June 13, 2014

Sử dụng Mock Data tạo "View All Post"

Mock Data như  một thư viện cho phép tạo các kiểu fake data, nói dễ hiểu thì nó sẽ giúp bạn thay thế Database học trước đó để hiển thị dữ liệu. Cách thức hoạt động lại rất dễ dàng và dễ quản lí.

Mock Data được biết tới với khả năng nhanh, chỉnh sửa hay dễ dàng tạo và quản lí dữ liệu về người dùng.

Để hướng dẫn cụ thể hơn, mình xin tạo một ví dụ cho các bạn quan sát.

1. Tạo Mock Data:

    Khởi động NetBeans IDE cài đặt sẵn trong máy:
      
     * Tạo mới project. (File - New Project)
     * Chọn Java Web
     * Chọn Web Application
     * Đặt tên và chọn đường dẫn lưu project.




Trước tiên hãy tạo đường dẫn trang chủ với đoạn code ngắn dưới đây:





Tiếp theo bạn tạo file CSS, đây là file sẽ giúp bạn thiết kế giao diện cho Web. Click chuột phải vào folder bạn muốn để file CSS rồi chọn Cascading Style Sheet (nếu không thấy thì chọn Other - Web rồi chọn Cascading Style Sheet )

(Style Css chi tiết mình sẽ gửi trong demo ở cuối bài)


Tiếp tục hãy tạo một file class mới ở bất kì folder nào trong Source Packages ((nếu không thấy thì chọn Other - Java rồi chọn Java Class ):





Tiếp tục khai báo biến trong file class mới tạo này



Bước tiếp theo lại tiếp tục tạo một file class mới ở bất kì folder nào trong Source Packages rồi gõ dòng lệnh trên





Bước cuối tiếp tục tạo thêm một file Class bất kì như trên nữa rồi thêm dòng code này.




Xong rồi, giờ chúng ta sẽ chạy thử cả Project MockData này lên, nó sẽ ra kết quả như này trên Web





Ngon rồi, tuy nhiên hãy làm đẹp giao diện hơn với CSS tôi đã nói ở trên, và đây là sau khi bạn đã thêm StyleSheet CSS này vào

(Sau khi có CSS rất dễ nhìn và đẹp hơn hẳn)



* Note: CSS của tôi được tham khảo từ CSSTableGenerator.


2. Đánh giá về MockData:
    "Như bạn thấy, với MockData bạn có thể dễ dàng tạo và quản lí các dữ liệu giống như trước từng sử dụng Database. Cá nhân mình thấy nó rất tiện để làm ngay tại bài thay vì kết nối SQL như trước. Tuy nhiên vì đây là Java Web nên mọi thứ code bằng tay, bất tiện cho những bạn mới bắt đầu làm quen với sử dụng NetBeans.
    Tuy nhiên tính khả dụng có nó sau này vào công việc là rất cao. Bạn có thể tải demo của tôi dưới đây để thấy được điều đó."


Tải Demo ở bài trên:  "View All Post" MockData

1 comment: