HomeLập trìnhPythonCách xây dựng...

Cách xây dựng ứng dụng web trên điện thoại của bạn – Hướng dẫn ứng dụng Android Python & Pydroid


Này, bạn thế nào rồi? Tôi là một nhà phát triển phụ trợ 18 tuổi và là một Kỹ sư Máy học đầy tham vọng. Và trong bài viết này, tôi sẽ viết về cách xây dựng một ứng dụng web trên điện thoại của bạn bằng Python 😁. Hãy đi sâu vào nó.

TW_PdXBpgeWY4mLcHjFisp8e7Lk7Zsn1aFarXBkmvhEMP0XR5xzTDxhKcCizsrJ25rkPeMeWp7ctlG0Wy7_WFUS0bzT-JVJfpe6X_3OqnuE_df2q5B3KIrhl3EG47w3Dik3nIZE

Yêu cầu

Điều đầu tiên chúng ta cần ở đây là điện thoại Android, ít nhất là phiên bản 6.0 trở lên. Nhưng nếu tôi nói với bạn đó là tất cả những gì chúng ta cần thì sao? Có vẻ quá tốt là đúng.

Bây giờ, điều tiếp theo chúng ta cần làm là cài đặt một ứng dụng di động trên điện thoại có tên là pydroid3.

fwM9r46B-sTofVF6IybUOhCTYoM8vSAPfumfBIiiL_wWLQpgdQgeR2B_2-N28NtNLaA7HvTtsZxlXdX03anCGvbt4QAlhQ_wyb9_AIfqG9L4ZMCjQOrKLg5OFPeZgKrJdqKEeb8

Như bạn có thể thấy, pydroid3 là một ứng dụng di động cho phép bạn viết Python trên điện thoại di động của mình, vì vậy hãy tiếp tục và cài đặt nó.

Điều tiếp theo chúng ta cần làm là cài đặt Django. Nếu bạn chưa quen với Django, vui lòng xem tài liệu Django tại đây.

Để cài đặt Django, chúng ta cần mở điều hướng bên trong pydroid3 và chọn Terminal:

qO3djIyoXMZB8MzcIaFDmNddhB2t9XgLLgCzonR2CDkWJc0pXtap9gyGhqZfpv0uFCCvtYnynL6pAOfgactlDfpwoy03TfgqEoN2W_gAO7nOeoaLbySZEQkOSBuprhs67jc-Ens

Sau đó bấm vào nó và chúng ta sẽ thấy điều này:

fTwNrfhCQpxKBFbrsN3B6dt4kFWvDUEJElZ897o-d21XbiYj42gZBLhiLMt7ffvSp44OQBrubC9jK62WvzneTlF-7WxcZZygHEqo4hmQ_9V42Pw4FgvdKB75EA3fv4q5nGZiL7k

Khi đã xong, tất cả những gì bạn cần làm là gõ lệnh sau:

pip install django

Và bạn sẽ nhận được dưới đây. Tôi nhận được thông báo “đáp ứng các yêu cầu” vì tôi đã cài đặt nó.

vYhoSBXGgvq2EiX6iXQ1RBLrvUe8zQHM3Aq65ZDIDRKSOoLqOrW5QQWE5yQ-ThbhzYTb6kwKf_jHzVoQ79wTbz2KZNv32oEBX1LjaAfeMYaiQb4bebYOWii-h1W3EKQkTWvgA2_Q

Nó đã được cài đặt thành công, nhưng hãy xác nhận điều đó. Trong loại thiết bị đầu cuối django-admin và nhấn enter.

Bạn nên lấy cái này:

jU17O6AVeFcy6rYMJ0mp_DEqnR9q51F-mhLZH1K7Ny8tixSeY7Xl8Jx27hBfxWfHPimt-1xCfO6x2AOlvYKYR92slC3sBwJNRg9uDJsJ6had0Yq1UTXZ5_CQvfCwwKneKCO_Gp4

Điều này có nghĩa là nó thực sự đã được cài đặt rồi.

Cách xây dựng dự án của chúng tôi

Vì vậy, hãy bắt đầu với việc xây dựng dự án của chúng tôi. Mở terminal của bạn và gõ lệnh sau:

django-admin startproject myapp

Điều này tạo ra một ứng dụng Django có tên myapp trong thư mục gốc của bạn.

Thay đổi thư mục thành nó bằng cách gõ cd myapp và gõ vào python manage.py runserver. Sau đó, bạn sẽ nhận được điều này:

fqO-uHACjoAXNQSrm5Pikjr-GQQkY3SbkE3G9Sgel1XZbePIf7hJaePd8yGxdrbYiyRdpeWCFUYBNo6iKMzTJqZg3s8j6CTGIoZYH-YJjT-tjHA0FCKtdGJEGzNy0Y8Qj5uTQrg

Bây giờ máy chủ đã bắt đầu. Tiếp theo, để kiểm tra nó trong trình duyệt, hãy truy cập 127.0.0.1:8000.

oqMFGPasUPLxuZoRqWHQ9mEhpitsg2XK8XPzLz_U-TvnFGzjkIaHVKUHXxwYkMDskLp_36F75BIAb-qv37bHccUESSZ9Jqa6XV7FGoWYk_IS8SfPYZfMTSNmo2ei-SMVa9cp_C8

Và bùm! Bạn sẽ thấy rằng Django đã được thiết lập thành công.

Điều tiếp theo chúng ta cần làm là tạo ứng dụng Django. Trong Django, thư mục dự án đóng vai trò là thư mục gốc trong khi ứng dụng đóng vai trò là chính ứng dụng đó.

Đọc thêm  Python Nhận thời gian hiện tại

Để tạo ứng dụng Django, hãy đảm bảo rằng bạn vẫn đang ở trong thư mục, sau đó nhập python manage.py startapp todo. Điều này tạo ra một ứng dụng Việc cần làm trong dự án myapp của chúng tôi như thế này:

ycIZAg7VGJO4Auwc7z_bsx5CU19Ks-rfubo_3amBKgvO-HeHb2I7mQu_loWg6leR22dvlMGh0FPgO1_-anmVpEHO4O4dlQik-MfiqF7Dx9BmxuI6YBjqPMcv8S3czgVCyftBu80

Sau đó, bên trong thư mục việc cần làm, chúng ta sẽ thấy một cái gì đó như thế này:

Fc60wk6pMuEQ8JvIwfOK2E1zezR9n_N-8o_X__F-yr1D1yD0BEuV62G9zoqG5GQnyA0shbI79JvNs3Z-YHunEoUyZw7LAt2eumkyKjj9M39sDbmDgzZ_axvjRyVeyLZC5ohVQmY

Chúng tôi sẽ xem xét kỹ hơn các tệp khi chúng tôi bắt đầu làm việc với chúng.

Cách định cấu hình ứng dụng của chúng tôi

Bây giờ, hãy làm cho ứng dụng có thể được phục vụ bởi dự án Django. Trước hết, mở của bạn settings.py tập tin trong thư mục myapp và thêm 'todo' đến các ứng dụng đã cài đặt như thế này:

mxTcaRk-ON73sPH6XL31kvZmUJjfwn1knbhMgTJALeyx6l8A1umvtXjLazS34oTjbPZeivGGTe6w6zsEQ1QzhTjaYDJ5tHsbhpeyxAfrvABzGHrNsElcv7RR9kQZi_Tttt4PjIc

Tiếp theo chúng ta cần mở ra urls.py và thêm đoạn mã sau vào mã của bạn:

from django.urls import path, include

path('', include('todo.urls'))
VEWQQt84a9DSeqmuT-LrE9EMmYnDnDfwJQQtJhI21WDTJf4EDaE212wj7BLoBX85Vjm90gFb6KsB6yGJ6PDyfgdTT9BL5hcmDZzNfIdHlceR40qJNVubaNKduXjA2viT7yqLJ14

Điều thực sự xảy ra là tôi đã thêm include đến từ django.urls đường dẫn nhập khẩu. Và bên dưới đường dẫn (admin) , chúng tôi đã tạo một đường dẫn trống trỏ đến hoặc bao gồm urls.py tập tin trong thư mục ứng dụng việc cần làm. Tôi hy vọng điều đó rõ ràng.

Tiếp theo, chúng ta cần tạo một tệp mới trong thư mục tệp todo có tên urls.py và thêm đoạn mã sau vào đó:

from django.urls import path
from . import views

urlpatterns = [
	path('', views.index, name="home")
 ]
cmxgwJ5PeIXW_yGgo9AKaVK10pDjGFl26gML6VicCQVLtsiCiorL5tBahCMOxHG-1HlrocwbaVod5SN6DFJFIZ5n1gidGOfJdaGW_p8holylN4aCUb-2ankvfIQygHz6cjT2tgc

Chúng tôi đã nhập khẩu path từ Django.urls và cả nhập khẩu views từ thư mục gốc. Sau đó, chúng tôi tạo ra của chúng tôi urlpatterns với phần đầu tiên là liên kết gốc. Như bạn có thể thấy, views.index chỉ có nghĩa là chúng ta đang trỏ các view này tới hàm index trong views.py tập tin. Bạn sẽ thấy nó hoạt động như thế nào trong nháy mắt.

Hãy tiếp tục với chúng tôi views.py tập tin và thêm một số mã.

Ở trên cùng, nhập HttpResponse như thế này:

from django.http import HttpResponse

Và thêm cái này bên dưới nó:

def index(request):
	return HttpResponse('Hello')
QUpf-9cT8Z-dKXTkO1FTm2-IkjD3_NIfYSQCy_XlALUTnIg_XrrxKurZLAJ19DQCk1W5mqBx4Mo5IL9ycL5gGS_w4LyI4zXxSo8y23mNaZ2OodFg-qLEi3Dh2FN_m7ueYjPYrb4

Như bạn có thể thấy, chúng tôi đã tạo hàm chỉ mục mà chúng tôi đã gọi trong urls.py và chúng tôi đã chuyển một tham số yêu cầu vào đó. Sau đó, chúng tôi đã trả lại một HttpResponse.

Nhưng trước khi HttpResponse có thể hoạt động, chúng tôi phải nhập nó từ django.http import HttpResponse – đơn giản như ABC. Hãy thử điều này: mở thiết bị đầu cuối của bạn và cd vào myapp và gõ python manage.py runserver để kiểm tra nó.

Tqb7c-adOuVHbyi-7XBQsv0HHJvxjUhcAZ3N4d5nkOEVNVwfSXxkENlD0l0UI3Jd4qLhO3k8ELDW6yG8yRiP0MmjkO0Q4TvGTYunQIBngSMNrXxfI7ygMHeN2FtjoJc37mVIVr0

Như bạn có thể thấy, nó đã trả về phản hồi. Vì vậy, tiếp theo chúng tôi sẽ tải các tệp HTML mẫu của mình.

Để tải các tệp HTML của chúng tôi, chúng tôi cần tạo một thư mục như thế này trong thư mục việc cần làm theo thứ tự sau:

Đọc thêm  Python .zip() – Hàm Zip trong Python

todo/templates/todo

Trong thư mục việc cần làm, tạo một thư mục có tên là mẫu. Trong thư mục đó, tạo một thư mục có tên todo, đơn giản như vậy.

Sau đó, hãy tiếp tục và tạo một tệp HTML đơn giản có tên là index.html và viết nội dung này vào đó:

<h1>Hello world</h1>

Để tải nó, hãy làm cho bạn views.py mã trông như thế này:

def index(request):
	return render(request, 'todo/index.html')
mhirciumIf_FcO764txwH5MOMl40vkZ6f41c0oXFreX1UA2IiqQG9E42TfbUBCZto4xG6-vl0t5sQj3ID1FBk_gL074Rzm4pn5a8RmMsP7DuMZKYVi1KQg-Bk35yr1gJGiE2ukg

Bây giờ, thay vì trả về phản hồi, chúng tôi đã trả về chế độ xem kết xuất cho phép chúng tôi hiển thị mẫu HTML của mình ngay bây giờ, hãy lưu phần mở cd đầu cuối này vào myapp và chạy nó. Chúng ta nên có cái này

NzW4_E80BNOtRq-E4qUg1GdvqHUUQQAxMAdUSGhxROCDkSUnzddSyX4E7Wz5_zPY29twa7D2PVmS85LYmCnzEAvgE-oU2MEk1mDeNhFW5FBuD2eAjDxpPkJfXiJAMEyk1uKZVkw

Như bạn có thể thấy nó hoạt động tốt – chuyển sang bước tiếp theo.

Cách thiết lập tệp tĩnh

Bây giờ để thiết lập các tệp tĩnh, hãy tạo một thư mục mới trong thư mục việc cần làm của bạn và đặt tên là tĩnh. Trong thư mục đó, tạo một thư mục và đặt tên cho nó là todo.

Vì vậy, nó phải như thế này: /static/todo/.

Trong thư mục todo, tạo một tệp và đặt tên cho nó main.css. Sau đó, hãy viết một chút phong cách trong đó:

body {
background-color: red;
}

Và lưu nó.

Bây giờ chúng ta hãy chỉnh sửa lại index.html tập tin bằng cách viết mã này:

{% load static %}
<!Doctype html>
<html>
<head>
<title>My page</title>
<link rel="stylesheet" href="https://www.freecodecamp.org/news/how-to-code-on-your-phone-python-pydroid-android-app-tutorial/{% static"todo/main.css' %}" >
</head>
<body>
Hello
</body>
</html>
Luboze-gNbfQkpTZVwOChtQKrQpC2eWnsTAE41f9mDdWaqaKtk2yYAV0uP3ufKE_EDrpfCoRvOFlHmLCJKucPNB_kQmZoaAZB5reCcW2wrddbsDbRPoIe2iacGLpFfLEcGYZEnA

Và bây giờ hãy chạy nó:

ARWYir-7j8-yF9yCzc3bNuW1ZyLKOG30iljprX4AJsnyIdYLtK_0Of7Uu4WJLuufoyRkVL5LnG8J-bepoBcRzm1e57AuaLmbA5iIyO_RY_KsKRVrsc0OfGmDbLOkT-FIZECwIyY

Nếu bạn đã theo dõi tôi, thì bạn nên có những điều trên.

Cách tải Mô hình và Bảng quản trị

Bây giờ để tải lên bảng quản trị của chúng tôi, chúng tôi cần tạo một siêu người dùng. Việc này rất đơn giản – chỉ cần mở thiết bị đầu cuối của bạn và cd vào thư mục myapp rồi nhập python manage.py createsuperuser và nhấn enter. Bạn nên xem thứ này:

PBTNq4SLyU4xMFsxh8wXuP0fUCnNKqL0zPiAqclNSPc4J7j4izPVgikXXQpaPqcPeSfFhrlQgf2xwyuhWz-s4RJWn1ftc5icsi9bt2QwmjKxjp3reecfmCxQ3GdVvE04HUAc8po

Chúng tôi gặp lỗi vì chúng tôi chưa chạy python manage.py migrate chưa. Vì vậy, hãy nhập nó và nhấn enter, và bạn sẽ có một cái gì đó như thế này:

_oEnoQWnv1VRtZf8W60ZyfFVGQV-nFzYKX4oj45SLCLUlPNNyZOefRkIj8ROdoNdkgECWr4OKmxRVUsRZy2c27XwsM7wQ4_7xeJWnlzPrBFZ79t7J8zZXFJLtfDqJf1vrvtShjc

Bây giờ gõ vào python manage.py createsuperuser và nhấn nhập:

t8Z8qo8Z3xNi9C86RjkiujHiS6en5b16eYPA5uMTfXAQYNpFjjuWaY_WEL0TrxLUlpaJJHzF143Vk0UuTQIzuD4GICQF4X1K2CF0vyb1ws33JN2W_FeyVu3xMOsn1posUZW0eFs

Chỉ cần điền thông tin đăng nhập. Điều tiếp theo chúng ta cần làm là chạy máy chủ của mình và trỏ đến 127.0.0.1:8000/admin.

Uoen79EV8PaEDuhnt2eBaCnnJAEzHhLydikTi8BOxUSZ9DrGp9GbtUk-Um7TmMDW64Zd0RbAkXja8RjyqiX58hlWdFyrzHTUVN0NCx93e9BOx36Va4ysCX7JyJRlEmdUBnbltuA

Đăng nhập và bạn sẽ được chuyển đến bảng điều khiển:

C8A8OermBdrvdB_6NEHg2mFgkkuVBsePdfdmlNhulSw2m7Jkdhea_jdDFNQnbvVgqxJcXj-ftbcNmdR6nYImJC2AV9edqcPB5pkhUm0zvImzzzzAokHZ4bDwYe4BPPvnXsK18Ng0

Bây giờ chúng ta đã hoàn thành bảng quản trị, hãy làm việc với mô hình (cơ sở dữ liệu). Chúng tôi sẽ tạo một mô hình thu thập nội dung. Vì vậy, mở của bạn models.py tệp và nhập mã này:

class Post(models.Model):
	content = models.CharField(max_length=255, null=False)
    
    def __str__(self):
    	return self.content
pyZXf_3jSGzz-sciBxAvb-ry4_TbZMnuHWWWAOl17LQ5hCi55DoKxzq0iYu6wuv8UsQhn3-w27GOzlt2N_9mpdKoHcZza9mWoBgselVQXC6bPD-ev-uTjlW1RbN1c2OussUgEpg

Chúng tôi tạo một lớp có tham số models.Model và đưa ra một biến content giữ một CharField(), giống như một trường văn bản. Cuối cùng chúng tôi tạo ra một phép thuật str trả về tên của mô hình thay vì một đối tượng.

Đọc thêm  Danh sách Python Tuple VS – Sự khác biệt là gì?

Vì vậy, tiếp theo chúng ta cần chạy quá trình di chuyển. Mở thiết bị đầu cuối của bạn, cd vào myapp và gõ python manage.py makemigrations. Bạn nên xem thứ này:

UBbVNNg1d8jhPTusB-HRRoUsqFfxaZdJLzSIzNIt3P4kby8Tor4G8Bme1e-yq8mOLFgfrUh3nb6MC3BSaOUQDr68_tEmIRtQBS7N7Y66wTbXdMMg-0EJ0svM3tw3j9GLgquC_IU

Điều đó có nghĩa là nó đã tạo bảng Post trong cơ sở dữ liệu của chúng ta. Rồi cũng chạy python manage.py migrate điều này sẽ dẫn đến kết quả như sau:

VyQYel1QFdxc2D5oSODDD6QPth2jVC5_CTj8SVyDo8pAusvl6qjH7XQUhmhbfXNLjdUiAc566pYTj0O2c-AsRHwVLeDo2xeOv1HWsldCwH1oxu3sM5WJTNOj9-fpZEOfVHMYZ6k

Điều này có nghĩa là tất cả đều rõ ràng. Bây giờ để thêm nó vào trang quản trị, hãy mở lên admin.py và gõ mã này:

from .models import *

admin.site.register(Post)
jzqRK8kVE6raStmHC8jJoqr8oYOXhygDpe8hoN_JdSRiF3Mpes3_Evw83U0nMczqgAobIY8zp_Z6ve-xb3jv6x7uChFzvdTyDqDZysD2j0pKxiGu2-V9pkvH02HKazBA2HZr6WQ

Chúng tôi đã nhập tất cả các lớp mô hình từ mô hình và đăng ký mô hình bài đăng trong bảng quản trị. Bây giờ nếu chúng ta mở bảng quản trị, chúng ta sẽ thấy bài đăng và lưu một số dữ liệu.

E9gkvNmpFiCJg24zYj7GpLzsM8AsoGUkoZHcS1Z3bxMva_Z3Jov5Yy7UzbgU251laLwGGRWqaFK1iIrILblSyktYK42Q-fzgS6ihGf0LYxR0Zl9qvkmG7sneHM2KFroSPDy2k3o

Lưu ý rằng nó hiện có trong danh sách ứng dụng việc cần làm:

BSyVagLKFGvtINW-jnuhrXRoFdB87S5lGksH37z5uewqVCn_WBHP-eI8gF6BUoG56Dz-SnKUtRonFhNX--c23V07WfXhOxHmCmJ460cXAr__NjTAkvXB4JnxIXlbsQcRtDO0uNU

Sau khi nhấp vào nó, bạn sẽ thấy điều này:

4zxSgdVcDnDrpr6aIquG854x59GQb0ZMJ3D-YnAs-9EDR0EYwHl_HBAbrpPGGr7YLfWn0PjJA19aukrUcBbUMURpn4ofEGCwWF4541ee_-OKZQj_cWuv_yxWvUGYGOZfdzu6C90

Sau đó, bạn có thể tạo một bài đăng nếu bạn thích.

Cách kết xuất dữ liệu từ DB sang chế độ xem

Cuối cùng, chúng tôi sẽ lấy dữ liệu của mình từ DB. Để làm như vậy, chúng tôi cần phải cập nhật của chúng tôi views.py như sau:

from .models import *

def index(request):
	content = Post.objects.all()
    context = {'content': content}
    return render(request, 'todo/index.html', context)
NHpq8LEatu06ntzUodCuBZT86FS_u_TPphhlfZ-CiP5rFglQcjtRB0zUdK0jkz_udZeXRh8JNqdZOhRSfV9A69I63b8P5DtBGtQo44zmwufnGTaybAaWAL0yOn9T544_mdXalN4

Nó đơn giản như vậy: chúng tôi đã nhập tất cả từ models.pyđã tạo một biến có tên contentvà lấy tất cả dữ liệu từ bảng Post. Sau đó, chúng tôi đã chuyển nó dưới dạng từ điển cho chế độ xem của chúng tôi. Vì vậy, trong index.html của chúng tôi để làm cho nó hoạt động, chỉ cần thêm phần này:

{% for contents in content %}
{{content.content}}
{% endfor %}
4zgGmOcVBVa906mn0AVk0Vh9MbaFeYS0VUVoOC00Jw6wtR54S55BMPjz5t0_z2LTgbs9Ldpt3VOKcEjgxMhSE63xGu8XKSx2tWbKFYp2ndxHc31pcAMFdSturJqEy07ca_IYC1c

Ở đây, chúng tôi đã viết một vòng lặp bằng cách sử dụng thẻ mẫu và tìm nạp tất cả nội dung dữ liệu. Bây giờ hãy mở thiết bị đầu cuối của bạn, cd vào myapp và chạy máy chủ để xem điều kỳ diệu xảy ra:

gKJf7AGR-0ZxOCeD_QKGffg4d-wpK0Lk8Z0Fkdj39Rj1V6dpWGf_KA1iBDJ2xE-Lq_zsJQHq6eIywPujAVmEk_R7e-Ug7ox94Rk5x212Bk7cBm0fHaMnGtqQM9zscDELygE1LvI

Nó hoạt động, nhưng hãy xác nhận rằng nó hoạt động:

IVjbVn-_3Exnnoq2s0pvHTeL2paWcqogzg1mp_Aj15GtXKqUPerrFDGZ-SjYKqpUX8Es1KGo0fSWoAOACLgri_LcT5oV7tkG6dtL2OestlnQC25OzFdYEhcyb0KPH3b12BBdJTU

Và kết quả phải như sau:

jlYy4UCV3MJd-JytvGUBLgC20k3-cduvDQ2O3FIb9kAF7VgRyGxyqb_G1Mjiqis261HQS68uIJUk5I9ccFJBFL6Ht3LiePvprBcsqkSS9lZZzJ_cc2noxJm32GPp9ytsiYl7t2o

Violà – nó hoạt động tốt. Cuối cùng, bạn có thể thêm dấu ngắt dòng để có thể đọc rõ hơn. Và chúng tôi đã hoàn tất!

Cảm ơn bạn đã đọc. Nếu bạn muốn xem hướng dẫn chuyên sâu về Django, vui lòng truy cập kênh YouTube Devstack của tôi và đăng ký.



Zik.vn – Biên dịch & Biên soạn Lại

spot_img

Create a website from scratch

Just drag and drop elements in a page to get started with Newspaper Theme.

Buy Now ⟶

Bài viết liên quang

DMCA.com Protection Status