báo cáo cuối kì môn nhập môn lập trình python cho phân tích đề tài ứng dụng django framework tạo webappweb đọc truyện

GVHD: Nguyễn Thành Sơn

TP.HCM THÁNG 6/2021

BÁO CÁO CUỐI KÌ

Môn: Nhập môn lập trình python cho phân tích

Đề tài: Ứng dụng Django framework tạowebapp(Web đọc truyện)

MỤC LỤC

CHƯƠNG 1: GIỚI THIỆU 4

1.1 Lý do chọn đề tài 4

1.2 Giới thiệu về đề tài 4

CHƯƠNG 2: TRÌNH BÀY BÁO CÁO 5

2.1 Tổng quan về Django 5

Những lợi thế của Django: 5

Sự phổ biến của Django 5

Cách đặt thư viện Django 6

2.2 Quản lý thư viện dùng trong Project 7

2.7 Model trong Django 44

2.7.1 Lý thuyết về Model trong Django 44

2.7.2 Áp dụng vào Project 46

2.8 Trang Admin trong Django 48

2.8.1 Tìm hiểu cơ bản về hệ thống Admin trong Django 48

2.8.2 Áp dụng Admin vào Project 51

CHƯƠNG 1: GIỚI THIỆU1.1 Lý do chọn đề tài

Nhận thấy được sự phát triển và phổ biến của các thiết bị thông minh thì nhu cầuđể sỡ hữu một chiếc máy tính ngày càng tăng cao Nắm bắt được nhu cầu ngày càng tăngcao ấy, chúng em quyết định xây dựng một website cho phép người dùng có thể dễ dàngsỡ hữu cho mình một chiếc máy tính

1.2 Giới thiệu về đề tài

Công nghệ thông tin (CNTT) ngày càng có vai trò quan trọng trong cuộc sốnghàng ngày của chúng ta.Việc ứng dụng công nghệ thông tin vào các lĩnh vực trong đờisống giúp công việc được tiến hành nhanh chóng và hiệu quả hơn.Có rất nhiều công việcmới phát triển song song cùng với CNTT, một trong số đó là lập trình wed, một hướng đidịch vụ mang lại hiệu quả kinh tế rất lớn.

Một ứng dụng của lập trình wed khá phổ biến là wedsite ecommerce và đó là đềtài của chúng em tiến hành.Ở đề tài này chúng tôi sẽ tạo ra một wedsite để người dùng cóthể mua những chiêc laptop một cách dễ dàng Tại đây người dùng sẽ tiếp cận được nhiềuloại máy tình đến từ nhiều hãng khác nhau và dễ dàng thanh toán

Với sự phát triển của công nghệ thông tin thì bây giờ chúng ta đã có rất nhiều côngnghệ để tạo ra một wedsite cho riêng mình, ví dụ như : JavaScrip,Python,PHP,C#,… Vàở đây chug em sẽ làm về ứng dụng Flask FreamWork tạo wedapp Các ưu điểm của Flasknhư giao diện quản trị đơn giản, thư viện hỗ trợ đầy đủ, khả năng mở rộng, sẽ giúp chođồ án dễ dàng và tốt hơn.Kết hợp với kiến thức về cơ sở dữ liệu SQL chúng em sẽ tạo ramột wedsite mua bán máy tính với đầy đủ chức năng cho người dùng và admin.

CHƯƠNG 2: TRÌNH BÀY BÁO CÁO2.1 Tổng quan về Flask

Flask là một micro web framework được viết bằng Python, không yêu cầu tool hay thư

viện cụ thể nào “Micro” không có nghĩa là thiếu chức năng mà “micro” theo triết lý thiết kế là cung cấp một lõi chức năng “súc tích” nhất cho ứng dụng web nhưng người dùng cóthể mở rộng bất cứ lúc nào Flask luôn hỗ trợ các thành phần tiện ích mở rộng cho ứng dụng như tích hợp cơ sở dữ liệu, xác thực biểu mẫu, xử lý upload, các công nghệ xác thực, template, email, RESTful , chỉ khác là khi nào bạn muốn thì bạn mới đưa vào thôi.Người dùng có thể tập trung xây dựng web application ngay từ đầu trong một khoảng thời gian rất ngắn và có thể phát triển quy mô của ứng dụng tùy theo yêu cầu.

Những lợi thế của Flask:

 Flask dễ cài đặt và triển khai: Sau khi cài đặt Python, để cài đặt Flask chỉ cần

bạn gõ lệnh: pip install Flask

 Giúp bạn tập trung xây dựng ý tưởng, mục tiêu của mình: Flask có kiến trúc

nhỏ, gọn nên bạn hoàn toàn không bị bó buộc bởi bộ khung cồng kềnh, không gặpbất cứ khó khăn nào khi cấu hình hay tổ chức ứng dụng Không những thế, Flaskcòn có các ưu điểm nổi bật như: cực kỳ linh hoạt, tối giản, dễ tìm hiểu và sử dụng,định tuyến dễ dàng, rất dễ mở rộng Vì vậy, công việc chính của bạn là chỉ cần xácđịnh ý tưởng, mục tiêu, tập trung vào việc xây dựng ứng dụng web mà thôi.

 Nguồn tài liệu phong phú: Flask cung cấp rất nhiều tài liệu từ cài đặt đến thực

hiện và triển khai, từ hướng dẫn nhanh đến hướng dẫn chi tiết Bạn có thể dễ dàngtìm kiếm, tham khảo, học tập về lập trình web application với Flask frameworkmiễn phí trên Internet.

 Linh hoạt: Flask không áp đặt cấu trúc dự án cụ thể nào, cho phép người phát

triển tự do tổ chức dự án theo cách họ muốn

 Extension ecosystem: Flask cung cấp một hệ sinh thái mở rộng (extension

ecosystem) phong phú cho phép người dùng mở rộng chức năng của Flask thôngqua các extension như Flask - SQLAlchemy cho việc kết nối cơ sở dữ liệu, Flask -WTF cho việc xử lý mẫu, nhiều extension khác.

 Lightweight: Flask là một framework siêu nhẹ, không yêu cầu nhiều tài nguyên

và có thể được triển khai một cách dễ dàng.

Sự phổ biến của Flask

Thực sự chưa có một bài thống kê cụ thể về sự phố biến các framework Việc đánh

gía hiện nay dựa vào số lượng các web phổ biến dùng Flask, số lượng người đóng góp

codebase, và số lượng người phát triển cả tình nguyện lẫn được trả công Thì có thể chorằng Flask là framework phổ biến.

Cách đặt thư viện Django

Ta sẽ cài đặt Flask bằng trình lệnh pip của Python Bây giờ bạn mở Terminal/CMD và

gõ lệnh sau:

pip install Flask

2.2 Quản lý thư viện dùng trong Project

Các thư viện trong dự án được lưu trong file requirements.txt để người sử dụngcũng như tham gia phát triển dự án có thể cài đặt một cách nhanh nhất có thể

file requirements.txt trong hệ thống thư mục gốc

Những thư viện được đặt trong file

Để thêm một thư viện vào file sau khi chúng ta cài đặt thì ta sẽ sử dụng lệnh pip

freeze > requirements.txt

vd: Sau khi cài đặt thư viện mysqlClient để kết nối tới mysql ta sẽ chạy lệnh pipfreeze > requirements.txt để khi người dùng hoặc người phát triển clone về có thể nhậnbiết cũng như chạy lệnh pip install -r requirements.txt để load thư viện cần dùng

Chạy lệnh pip install -r requirements.txt để load thư viện

2.2.1 Cách cấu hình dự án và cách hoạt động nhóm

Với dự án này các thành viên sử dụng Github để hoạt động Trang github chính

thức của nhóm là https://github.com/dominhduc291001/My_TruyenVậy chúng ta cần tìm hiểu Github là gì?

GitHub là một dịch vụ nổi tiếng cung cấp kho lưu trữ mã nguồn Git cho các dự ánphần mềm Github có đầy đủ những tính năng của Git, ngoài ra nó còn bổ sung nhữngtính năng về social để các developer tương tác với nhau.

Vài thông tin về GIT:

● Là công cụ giúp quản lý source code tổ chức theo dạng dữ liệu phân tán.Giúp đồng bộ source code của team lên 1 server.

Hỗ trợ các thao tác kiểm tra source code trong quá trình làm việc (diff, checkmodifications, show history, merge source, …)

GitHub có 2 phiên bản: miễn phí và trả phí Với phiên bản có phí thường được cácdoanh nghiệp sử dụng để tăng khả năng quản lý team cũng như phân quyền bảo mật dựán.

Còn lại thì phần lớn chúng ta đều sử dụng Github với tài khoản miễn phí để lưu trữsource code.

● Github cung cấp các tính năng social networking như feeds, followers, và networkgraph để các developer học hỏi kinh nghiệm của nhau thông qua lịch sử commit.Nếu một comment để mô tả và giải thích một đoạn code Thì với Github, commitmessage chính là phần mô tả hành động mà bạn thực hiện trên source code.

Github trở thành một yếu tố có sức ảnh hưởng lớn trong cộng động nguồn mở.Cùng với Linkedin, Github được coi là một sự thay thế cho CV của bạn Các nhà tuyểndụng cũng rất hay tham khảo Github profile để hiểu về năng lực coding của ứng viên.

Các bước sử dụng và phát triển

Để sử dụng cũng như phát triển dự án bước đầu tiên chúng ta cần clone về máy

Chúng ta mở cmd lên và khởi chạy lệnh như hình

Sau khi làm xong bước trên thì trên máy sẽ có thư mục dự án, chúng ta bật lên bằng trìnhsoạn thảo (ở Đây chúng ta dùng pycharm)

Cấu trúc thư mục sẽ tương tự như sau

Để khởi chạy chúng ta cần đọc theo hướng dẫn trong file README.md hoặc truy cậpvào link github chính đọc phần hướng dẫn

Hướng dẫn chi tiết cài đặt sử dụng dự án

Sau khi hoàn thiện các bước trên chúng ta cần tạo một user admin(superuser) để sử dụng

trang admin bằng câu lệnh python manage.py createsuperuser

Các thao tác sử dụng github để phát triển dự án theo nhóm

Đối với mỗi thành viên sau khi clone từ github về cần phải tạo 1 nhánh branch để pháttriển Chúng ta để ý góc trái trong trình soạn thảo có biểu tượng github, chúng ta chọnvào và chọn phần tạo branch

Hình ảnh giao diện tạo branch

Sau khi tạo xong branch chúng ta cần checkout ra branch mới vừa tạo để tiến hành code(mặc định branch sẽ là master)

Chúng ta checkout branch và tiến hành code

Sau khi hoàn thành xong từng phần chúng ta tiến hành commit và tạo push request Để ýthanh công cụ bên phải ta sẽ thấy mục chọn commit, nhấn chọn commit ta sẽ mở ra giaodiện commit và push

Giao diện phần commit

Ở giao diện này chúng ta chọn những file cần push lên sau đó chọn phần commit andpush

Một hộp thoại hiện ra chúng ta chọn push để tiến hành push lên github

Để đồng bộ hóa với những người phát triển khác chúng ta cần pull lại từ github Để ý gócphía trên màn hình ta thấy biểu tượng pull, khi click vào thì code trên github sẽ đượcđồng bộ trở lại máy người dùng.

2.2.2 Giao diện tổng quát và một số chức năng chính

Mỗi giao diện hiển thị sẽ tương ứng với 1 thư mục trong thư mục chính template (phầnhiển thị)

Giao diện trang chủ

Phần giao diện trang chủ được quản lý bởi file HomeView.py HomeView trong thư mụccontroler

Ở trong file này chúng ta sẽ tạo một số hàm để hiện thị ra giao diện và để chúng trongobject context Một số hàm cơ bản cần dùng cho giao diện trang chủ như getNewView()để lấy danh sách những truyện mới cập nhập.

getNewView trả về danh sách truyện mới cập nhập

Tương tự ta có một số hàm như getTopView(), getNewChap(), getLoveView() để cungcấp nội dung cho template hiển thị

Tiếp sau ta sẽ tới phần giao diện của trang chủ

Đây là giao diện chính thức của trang chủ

Phần giao diện được thiết kế bằng html5 + css và có sử dụng thêm bootstrap để chia bốcục cũng như reponsive website để có thể sử dụng trên mọi thiết bị.

Các trang hiển thị được dùng chung với 1 template chính nằm trong thư mục Base

File template Base được dùng để khởi tạo html cũng như include những thư viện jsvà css cần dùng.

Phần hiển thị của từng template sẽ được gọi lại thông qua thẻ block trong django.Với mỗi url tương ứng hệ thống sẽ tự động nhúng code vào giữa 2 thẻ block và andblock.

Trong file template home chúng ta sẽ kế thừa lại template Base để tái sử dụng giaodiện chính bằng thẻ extends Thẻ load static được dùng để load hệ thống tài nguyên nhưfile css, image, được chúng ta sử dụng.

Ngoài code html chúng ta còn cần sử dụng một số thẻ trong django template nhưif, for, để hiển thị được dữ liệu từ server gửi về.

Ở đây ta sử dụng for để lặp tất cả các item trong mảng listTruyen

Để hiển thị các thuộc tính dữ liệu ta cần phải bỏ trong cặp dấu {{}} để hệ thốngnhận diện và in ra dữ liệu lên màn hình

Ta sử dụng {{item.tentruyen}} để hiển thị thuộc tính tentruyen trong object item

Để hiển thị 1 hình ảnh từ hệ thống ta cần phải sử dụng thẻ {% static tênbiến %}

Để làm đẹp cho trang web chúng ta cần phải sử dụng một số thao tác với css Filehome.css đảm nhận việc xử lý màu sắc cho trang web.

2.3 Mô Hình MVC:

- MVC là viết tắt của 3 từ Model-View-Controller:

- Model: Là kiến trúc dữ liệu database, là nơi cung cấp các chức năng xử lý đến

- View: Là nơi hiển thị giao diện cho người dùng.

- Controller: Nhiệm vụ nhận các request của người dùng, sau đó sẽ lấy dữ liệu từ

model và đưa sang cho view.Cách hoạt động mô hình MVC

Khi người dùng gửi request lên server, nó sẽ vào controller, controller kiểm tra yêu

cầu người dùng muốn gì, nếu có yêu cầu dữ liệu thì controller sẽ thông qua data để lấy dữliệu về.

Khi có dữ liệu, controller sẽ gửi data sang view, view sẽ dựa vào data để xây dựngcác hiển thị trang web và response về cho máy người dùng (Như sơ đồ trên)

2.3.1 Django là gì ?

Django là một trong những Web Framework phổ biến, được viết bằng Python, cungcấp nhiều tính năng cho phát triển website như bảo mật, database access, session, routing,localization

Django mặc định đã áp dụng mô hình MVC ngay từ đâu, diễn đạt như sau:

- Models: Chính là Model trong MVC, đây chính là nơi ta thiết kế ra những table chodatabase, từ đó Django ORM đã cung cấp những phương thức xử lý, nghiệp vụ lêndatabase.

- Template: Chính là View trong MVC, là những template ta thiết kế ra cho trangweb.

- View: Đây là Controller trong MVC, trong view có các function xử lý khi córequest từ người dùng.

Ở đoạn Code sau thể hiện cách hoạt động MVC Django:

Hàm post nằm ở controller để xử lý các request người dùngDòng code 11: Chính là nơi tương tác controller với models

Dòng code 15: Thể hiện việc controller gửi data cho views views từ đây lo xử lý cáchhiển thị cho người dùng

Một số công ty hàng đầu sử dụng Django như Instagram, Spotify, Youtube, Dropbox,trình duyệt Mozilla, Disqus

2.3.2 Lập trình web với Django:

Django được xây dựng giúp phát triển website nhanh chóng với đầy đủ thư viện,module cần thiết Đặc biệt, thiết kế sạch sẽ, thiết thực và gọn gàng.

Khả năng dễ đọc của Python, cùng với tính đơn giản, đầy đủ, cho phép lập trình viêntập trung vào các vấn đề phức tạp, logic nghiệp vụ cao mà không tốn thời gian cho nhữngrắc rối đã được người khác giải quyết.

Django có mô hình xác thực người truy cập tuyệt vời, nhờ khả năng cấu hình user.

Điều này khiến nó trở thành sự lựa chọn hàng đầu khi trang web, ứng dụng cần ưu tiên vềbảo mật.

Ngoài ra, Django sở hữu khả năng mở rộng tốt, đáp ứng lượng traffic lớn và không cần lolắng về khả năng scale sản phẩm của mình.

Hơn nữa, khi xây dựng CMS, Ecommerce Website, Social Network đều có thể kếtnối linh hoạt với Django và không phụ thuộc lẫn nhau.

2.3.3 Tại sao phải sử dụng Django?

Django có một số ưu điểm như sau:

- Nhanh: Django được thiết kế để giúp các nhà phát triển đưa các ứng dụng từ ý

tưởng đến hoàn thành càng nhanh càng tốt….

- Có đầy đủ các thư viện/module cần thiết: Django chăm sóc xác thực người

dùng, quản lí, nội dung, bản đồ trang web,…

- Đảm bảo về tính bảo mật: không còn các nỗi lo về các lỗi bảo mật thông thường.

Django cũng cung cấp cả phương pháp để lưu mật khẩu an toàn.

- Khả năng mở rộng tốt: Django có thể đáp ứng nhu cầu traffic lớn.

- Tính linh hoạt: Các công ty, tổ chức và chính phủ đã sử dụng Django để xây

dựng tất cả mọi thứ - từ hệ thống quản lý nội dung đến mạng xã hội đến nền tảngtoán khoa học.

-Dễ sử dụng: Django được tạo ra bởi ngôn ngữ lập trình Python và mô hình MVC nên

rất dễ ứng dụng trong các dự án Đa ngôn ngữ và được hỗ trợ Multi-Site

-Dễ học: Có nhiều tài liệu hỗ trợ việc học Django, bao gồm cả tài liệu miễn phí trên

mạng và sách in Cộng đồng sử dụng Django hiện nay đang phát triển mạnh mẽ, newbiecó thể tìm kiếm sự giúp đỡ trên các trang facebook, diễn đàn, blog,

2.3.4 Một số yêu cầu về cấu hình máy

Đây là một số yêu cầu thiết yếu của máy tính để có thể chuẩn bị tốt cho việc lập trìnhnói chung và việc làm web với Django nói riêng:

-Ổ cứng SSD tối thiểu 256GB- Bộ xử lý Intel Core i5 hoặc i7

- Độ phân giải Full HD, lý tưởng nhất là 1920x1080- Ram 8Gb

Theo mặc định thì Django sẽ tạo cho mình một trang Admin có sẵn để quản lí,tại địa chỉhttp://127.0.0.1:8000/admin có giao diện như sau:

Trong thư mục Data, vào file formRegister.py tạo class PostForm form này đượckế thừa từ ModelForm - form mặc định của Django, dùng để pass vào template của trangforum

Trong Controler tạo file ForumView.py chứa các Views để xử lý các request từ

người dùng và trả về các Respone tương ứng – đây chính là phần Controller trong mô

hình MVC

Và bây giờ, ta chỉnh sửa đường dẫn để trang có thể truy cập Ta vào thư mụcMyTruyen/urls.py Trước tiên ta cần import ForumView, ArticleDetailView,AddPostView vào urls.py Vì bản thân template forum.html, add_post.html,article_details.html được kết thừa từ lớp ForumView khi đó cần thêm phương thứcas_view() để có truy xuất

Trong file urls.py tạo 3 path add_post, article/<int:pk> và forum Khi ta thực hiệntruy cập vào các url này, nó sẽ import và gọi các View tương ứng để xử lý.

Trong thư mục templates, tạo thư mục con Forum chứa 3 template là forum.html,article_details.html và add_post.html dùng để render thông tin cần hiển thị cho người

dùng với dữ liệu từ các View tương ứng - đây chính là phần View trong mô hình MVC

article_details.html

add_post.html

Vào câu lệnh terminal để run server với câu lênh python manage.py runserver Sau

đó truy cập địa chỉ 127.0.0.1:8000/forum để xem thành quả

Hình bên dưới là giao diện Forum, những review của các user sẽ được hiện tại trangnày(forum.html)

góc trên bên trái có nút Add Review để user có thể thêm reviewkhi nhấn vào website sẽ mở đến trang add_post.html

Khi nhấn vào title của một review sẽ hiện ra trang article_detail.html và có nut Back phíadưới bên trái để quay lại Forum

2.4 User Registation and Login Authentication – Đăng ký người dùng và xác thực đăng nhập:

Trong file setting.py, tìm INSTALLED_APPS, thêm ‘django.contrib.auth’ để tạocác permissions mặc định như add, change, delete, view,

Trong thư mục Data, tạo file formRegister.py, form này được kế thừa từUserCreationForm – form tạo user mặc định của Django, dùng để pass vào template củatrang register.

Trong file urls.py tạo 3 path login, logout và register Khi ta thực hiện truy cập vàocác url này, nó sẽ import và gọi các View tương ứng để xử lý.