Làm sao chúng ta có thể trả lời câu hỏi: **Website này có hiệu năng cao hay thấp, nhanh hay chậm?** hay **Website này có tồn tại những vấn đề gì cần được khắc phục?**.

Để trả lời cho câu hỏi này, chúng ta cần phải đo các chỉ số về hiệu năng, SEO,... của ứng dụng đó.

Có nhiều cách để đo các chỉ số trên và trong bài viết này mình sẽ sử dụng [Google Lighthouse](https://developers.google.com/web/tools/lighthouse/) và [React Developer Tools
](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi) để đo lường chất lượng cũng như phát hiện những vấn đề mà website của chúng ta có thể đang gặp phải.

## 1. Lighthouse

Google Lighthouse là công cụ được tích hợp sẵn trong Google Chrome. Để mở nó, bạn nhấn tổ hợp phím **Ctrl + Shift + I** (hoặc **Optional + Command + J** trên MacOS) để truy cập DevTools, sau đó chọn tab **Lighthouse**

<Image
  src="/images/lighthouse-1.png"
  title="Màn hình Lighthouse trên Google Chrome"
/>

Có 2 phần chính bạn cần chú ý trên Lighthouse là **Categorise** và **Device**. **Categories** là những loại chỉ số mà bạn cần đo, ở đây mình chọn các chỉ số liên quan đến hiệu năng - Performance. Tiếp theo, chọn loại thiết bị mà bạn muốn đo, ở đây mình chọn Desktop.

Tiếp tục nhấn **Generate report** và chờ kết quả trả ra :smile:

Trong bài viết này, mình tập trung vào phần **Performance** vì đó là phần quan trọng nhất để đánh giá một website tốt hay dở tệ.

### Điểm tổng quan

<Image
  src="/images/lighthouse-2.png"
  title="Điểm hiệu năng trung bình và điểm của từng chỉ số"
/>

Bạn có thể thấy trong hình, điểm trung bình về hiệu năng là 40. Điểm số này được tính dựa trên điểm các chỉ số khác về hiệu năng, mỗi chỉ số khác nhau sẽ có các trọng số khác nhau. Các chỉ số có màu đỏ là những thứ chúng ta cần khắc phục, nên quan tâm đến những chỉ số màu vàng và những chỉ số màu xanh là những chỉ số tốt chúng ta cần duy trì.

Ở đây có thể thấy website này đang khá tệ do:

- thời gian block cao - [Total Block Time](https://web.dev/tbt/): 0.5s
- thời gian cần để lượng lớn các phần tử hiển thị trên viewport lớn - [Largest Contentful Paint](https://web.dev/lcp/): 2.5s
- thời gian nội dung được hiển thị trực quan khi trang đang được tải lớn - [Speed Index](https://web.dev/speed-index/): 3.3s
- mức độ ổn định của trang, được đo bằng sự sai khác nhau về vị trí các phần tử trong những lần render - [Cumulative Layout Shift](https://web.dev/cls/)

Bạn có thể tìm hiểu thêm về các metric ở đây: [https://web.dev/metrics/](https://web.dev/metrics/)

Lưu ý: điểm của các chỉ số này chỉ là tương đối ngay tại thời điểm đo. Có thể lần đo ngay sau khi network khoẻ hay máy tính của bạn khoẻ hơn, kết quả đo được sẽ tốt lên.

### Những chỉ số có thể cải thiện

<Image src="/images/lighthouse-3.png" title="Những chỉ số có thể cải thiện" />

Lighthouse đưa ra một viễn cảnh nơi website của bạn có thể đạt được như sau:

- Thời gian server phản hồi có thể cải thiện 0.88s
- Bạn có thể cắt bỏ những đoạn JS thừa để giảm thời gian load 0.6s

Thời gian server phản hồi có thể đo chính xác hơn bằng cách đo thời gian từ thời điểm request đến lúc nhận được byte đầu tiên từ server (Time To First Byte). Bạn có thể sử dụng [wrk](https://github.com/magiskboy/wrk) để đo trên nhiều request cho kết quả khách quan nhất.

Nói chung đây chỉ là những dự đoán của Lighthouse và nó còn tuỳ thuộc vào ứng dụng của bạn nữa nhé :smile:

### Chẩn đoán những vấn đề hiện tại

<Image
  src="/images/lighthouse-4.png"
  title="Nguyên nhân (có thể) cần khắc phục"
/>

Ở đây mình thấy có 2 vấn đề quan trọng là thời gian main thread bị block quá dài và lượng JS thừa làm thời gian xử li kéo dài 2.3s.

Ngoài ra, bạn cũng nên kết hợp sử dụng những công cụ khác của DevTools để có thêm nhiều thông tin hơn trong quá trình đo lường.

Vậy là mình đã giới thiệu sơ qua về Lighthouse để đo lượng hiệu năng của website. Với công cụ này, bạn có thể đánh giá dễ dàng với bất kì website nào bạn muốn.

## 2. React Developer Tools

React Developer Tools là công cụ cho phép bạn debug ứng dụng ReactJS một cách dễ dàng. Nó là một extension trên nhiều trình duyệt. Trong bài viết này, mình sử dụng nó trên Google Chrome.

Để có thể sử dụng, ứng dụng của bạn phải chạy trong component **Profiler** của ReactJS: [https://reactjs.org/docs/profiler.html](https://reactjs.org/docs/profiler.html).

Sau khi load trang, bạn mở Chrome DevTools như phần trên rồi chọn tab **Profiler** như hình

<Image
  src="/images/react-developer-tools-1.png"
  title="React Developer Tools"
/>

Để bắt đầu recording, bạn click vào biểu tượng reload góc trên bên trái. Cơ bản, website sẽ reload và được record lại, sau khi thấy website được load hết, bạn click vào biểu tượng stop màu đỏ góc trên bên trái để dừng việc record và hiển thị kết quả đo lường như hình dưới

Ở đây mình chọn **Flamegraph** cho bài viết này, các bạn có thể tham khảo thêm **Ranked** trên google nhé :smile:

<Image
  src="/images/react-developer-tools-2.png"
  title="Thời gian render của từng component dưới dạng Flamegraph"
/>

Để hiểu rõ hơn về biểu đồ này, mình sẽ giải thích sơ qua về quá trình render của React.

Trong 1 lần render, React sẽ render component thành DOM Node (phase **render**) và đem đi so sánh với DOM Node hiện tại. Nếu có sự khác biệt, DOM Node đó sẽ được thay thế bằng giá trị mới (phase **commit**) ngược lại sẽ bỏ qua. Từ đó suy ra, số lần render lớn hơn hoặc bằng số lần commit.

Chúng ta có thể thấy phần bên trái là biểu đồ về phân bố thời gian cho 1 lần app được commit.
Phần bên phải là thông tin chi tiết về lần commit đó của cả app bao gồm thời điểm commit và thời gian render.

Ngoài ra, góc trên bên phải có 1 barchart. Mỗi cột trong barchart đại diện cho thời gian render của commit đó. Trong hình có thể thấy có 5 lần commit có thời gian render khá dài.

<Image
  src="/images/react-developer-tools-4.png"
  title="Tổng quan các lần commit của app"
  height={80}
/>

Nhìn hình trên, chúng ta thấy số lần commit là 60 và biểu đồ hiện tại là commit đầu tiên.

Khi click vào từng component sẽ hiển thị số lần render của component đó.

<Image
  src="/images/react-developer-tools-3.png"
  title="Chi tiết về render Layout component"
/>

Như trong hình bạn có thể thấy, component cha ở trên, các component con đứng ngang hàng với nhau và ở dưới component cha.

Thời gian render component cha là tổng thời gian render các component con và thời gian render chính nó.

Khi tối ưu render, bạn sẽ nhìn lên barchart và click vào những thanh cao nhất hoặc màu vàng vì đó là những lần commit có thời gian render cao, cần tối ưu.

## 3. Kết bài

Sau bài viết này, các bạn đã có thêm những công cụ hữu ích để có thể đưa ra đánh giá về 1 website có hiệu năng cao hay thấp, đặc biệt là có cái nhìn chi tiết hơn về ứng dụng web nói chung và ứng dụng React nói riêng để từ đó đưa ra những quyết định nên tối ưu ở đâu và như thế nào.


Để hiểu rõ hơn về context trong Flask, chúng ta cũng tìm hiểu xem một web khi viết bằng Python sẽ hoạt động ra sao.

### 1. [WSGI](https://wsgi.readthedocs.io/en/latest/what.html)

Theo [PEP 333](https://www.python.org/dev/peps/pep-0333/), một ứng dụng web khi cài đặt về cơ bản sẽ một hàm với 2 tham số

- `environment`: một `dict` chứa toàn bộ dữ liệu client gửi đến server, nói các khác, đây chính là gói tin HTTP request đã được parse
- `start_response`: một hàm nhận vào status code và danh sách các header, những cái này sẽ được ghi vào phần đầu của gói tin HTTP response

Hàm sau khi xử lí sẽ trả về một iterable của các byte dữ liệu, cái này sẽ được dùng để ghi vào phần body trong gói tin HTTP response.

Khi chạy bất kì một WSGI server nào như gunicorn, uwsgi hay mod_wsgi của Apache, các webserver đó sẽ fork một thread và dùng hàm này để xử lí một request.

Chẳng hạn như này:

```python
# code application
def app(environment, start_response):
	start_response('200 OK', [('Content-Type', 'plain/text')])
	return b'Hello world'

# code webserver
def request_handle(wsgi_app, http_request):
	http_response = BytesIO()

	def start_response(status_code, headers):
		nonlocal http_response
		...

	environment = parse_http_request(http_request)
	body_message = wsgi_app(environment, start_response)
	http_response.write(body_message)
	# send http_response to the client

thread = Thread(target=handle, args(app, http_request,), daemon=True)
thread.start()
```

Vậy ta có thể thấy rằng, environment chính là một context. Handler của chúng ta nhận đầu vào là environment(http request) nên mọi xử lí sẽ phải phụ thuộc vào context này.

Cụ thể, trong flask, `environment` được parse tiếp thành `flask.request` object.

### 2. Vấn đề của Django và các web framework khác

Khi bạn làm việc với Django hay các python web framework khác, bạn có thể thấy rằng nếu chúng ta muốn sử dụng dữ liệu từ request, bắt buộc chúng ta phải truyền top-down biến request xuống từng hàm mà mình muốn sử dụng

Chẳng hạn thế này

```python
def nest_nest_function(request):
	...

def nest_function(request):
	# chả dùng request những vẫn cần phải truyền vào để cho con nó dùng
	nest_nest_function(request)

def index(request):
	# chả dùng request những vẫn cần phải truyền vào để cho con nó dùng
	nest_function(request)
```

Vì đây là backend nên trường hợp này khá hiếm xảy ra và số lượng các hàm lồng nhau cũng không nhiều. Nhưng đó là trường hợp thường xuyên xảy ra trong frontend, đặc biệt là React. Và React cũng giải quyết vấn đề này giống cách mà Flask đã làm.

### 3. Flask proxy

Như bạn thấy ở trên, các request sẽ được isolate trong các thread riêng biệt với context của nó là environment và nó hoàn toàn có thể trở thành một giá trị global trong thread đó.

Ngược lại, trong process scope bao gồm nhiều thread, các environment này không được phép dùng lẫn của nhau và chúng ta nên thắc mắc

**Tại sao khi dùng `flask.request`, tôi có thể gọi nó ở mọi nơi (process scope) mà không bị nhầm lẫn các environment?.**

Vâng, tất nhiên, `flask.request` hay một vài thứ khác tương tự không phải là một object bình thường, chúng là các proxy có behavior để phân biệt nó đang được gọi ở thread nào để có thể lựa chọn context sao cho phù hợp.

OK, nghe có vẻ rất kì diệu nhưng thật ra rất đơn giản!

Mọi chuyện thật đơn giản nếu thread của chúng ta có một cái tên! Vâng chính xác, mỗi một thread khi được fork sẽ có một định danh (id) và nó có thể được lấy ra bằng hàm `threading.get_ident()` chẳng hạn.

Và nếu chúng ta có một `dict` với key là id của thread và value là giá trị của context thì sao nhỉ, chẳng hạn như thế này

```python
global_container = {}

def set_context(value):
	global global_container

	tid = threading.get_ident()
	global_container[tid] = value

def get_context():
	global global_container

	tid = threading.get_ident()
	if tid not in global_container:
		raise RuntimeError("Working outside of application context.")
	return global_container.get(tid)

def nest_function():
	ctx = get_context()
	print(f'In nest function, thread {threading.get_ident()}: {initial_context}')

def handle():
	initial_context = random.random()
	print(f'In handle function, thread {threading.get_ident()}: {initial_context}')
	set_context(initial_context)
	nest_function()

t1 = threading.Thread(target=handle)
t2 = threading.Thread(target=handle)

t1.start()
t2.start()
```

Bằng cách này, khi chúng ta gọi các proxy trong các thread xác định, nó sẽ lấy id của thread đó và lookup trong một global mapping (`global_container` chẳng hạn) để tìm giá trị phù hợp.

Vậy các bạn thử đoán xem trong ví dụ ở phần 1, chúng ta nên set environment ở đâu để nó trở thành context của một thread?

Để biết thêm về cài đặt chi tiết trong Flask, các bạn có thể tìm hiểu về một vài class cũng như những package sau

- [`werkzeug.local.LocalStack`](https://github.com/pallets/werkzeug/blob/master/src/werkzeug/local.py#L170)
- [`werkzeug.local.LocalProxy`](https://github.com/pallets/werkzeug/blob/master/src/werkzeug/local.py#L467)
- [`flask.globals`](https://github.com/pallets/flask/blob/master/src/flask/globals.py)
- [`flask.ctx`](https://github.com/pallets/flask/blob/master/src/flask/ctx.py)

Ngoài request, flask còn có application context chứa application hiện tại khi chúng ta gọi `flask.g` hay `flask.current_app`.

### 4. Ứng dụng của Flask proxy

Flask cũng cho phép chúng ta có thể hoàn toàn tự tạo một context cho riêng mình:

Xử lí ở thread khác

```python
@app.route('/')
def index():
    @copy_current_request_context
    def do_some_work():
        # do some work here, it can access flask.request or
        # flask.session like you would otherwise in the view function.
        ...
    gevent.spawn(do_some_work)
    return 'Regular response'
```

Hay xử lí ở process (thread) khác

```python
app = Flask(__name__)

with app.request_context(envỉonment):
	do_something()
```

Thiết kế này cũng được các extension của flask tuân thủ như Flask-Login, Flask-Admin hay Flask-Celery...

Đến đây, bạn đã có thể nắm được một trong những khái niệm quan trọng trong Flask và có thể sử dụng nó một các đúng cách, tránh các lỗi ngớ ngẩn trong quá trình phát triển.

Hẹn gặp lại các bạn ở bài viết sau, bye bye.


Cú pháp của Python rất sáng sủa và dễ học, chính vì thế có rất nhiều thư viện ở nhiều lĩnh vực được cài đặt bằng Python, hoặc ít nhất cũng có interface là Python như:

- Tensorflow, PyTorch, Theano cho machine learning
- Numpy, SciPy cho tính toán khoa học
- Spark, Pandas cho việc xử lí dữ liệu
- Docker cho containerize
- Django, Flask, FastAPI, Tornado cho phát triển web

Trong bài viết này, mình muốn tập trung vào những thứ hay ho của một web framework - Flask, một framework được cài đặt thuần bằng Python và có được sự hưởng ứng của nhiều người.

### 1. Đơn giản và khả năng mở rộng

Thật sự, Flask là một framework web cực kì nhỏ gọn (như tác giả nói rằng Flask là một micro web framework) so với những đàn anh của nó như Django hay Tornado. Vậy Flask có những gì

- URL routing
- Template engine
- Các high level class
- Testing module
- Commandline tool

Flask không bắt bạn phải làm theo những gì được coi là tiêu chuẩn của nó (tất nhiên vẫn cần có những pattern riêng cho việc này nhưng nó không quá phức tạp) như các framework khác, đặc biệt là Django trong Python.

Nếu bạn cần deploy một model machine learning, nhiêu đó là quá đủ.

Ứng dụng của bạn phức tạp hơn? Flask có 1 giải pháp - extension

Flask có thể được cộng đồng mở rộng bằng cách phát triển các module tách biệt cho nó, cực kì linh hoạt.

Bạn cần tương tác với database, Flask-SQLAlchemy giúp bạn điều này.

Bạn muốn có một hệ thống quản lí dữ liệu như Django, Flask-Admin có thể là lựa chọn hay đấy.

Bạn cần các chức năng authenticate và authorization cho các request, Flask-Login giúp bạn điều đó.

Bạn cần phát triển các RestfulAPI nhanh chóng và thuận tiện, Flask-Connexion sẽ giúp bạn.

Bạn có thể build bất kì một hệ thống web backend nào dựa trên Flask, tất nhiên sự đơn giản của framework cũng đồng nghĩa với việc bạn phải động não nhiều hơn.

### 2. Cấu trúc đơn giả và hiệu quả

Bạn muốn có một backend, đây là những thứ bạn cần với Flask

```python
# main.py

from flask import Flask

app = Flask(__name__)

@app.route('/')
def homepage():
	return 'Hello world'
```

và bạn có thể chạy nó

```sh
$ FLASK_APP=main:app flask run
* Serving Flask app "main:app"
* Environment: production
   WARNING: This is a development server. Do not use it in a production deployment.
   Use a production WSGI server instead.
* Debug mode: off
* Running on http://127.0.0.1:5000/ (Press CTRL+C to quit)
```

Sự đơn giản mà Flask có được cũng nhờ cú pháp đơn giản của Python. Để định nghĩa một router, bạn đơn giản viết một hàm và wrap nó bằng decorator trong Python.

Decorator là một design pattern hiệu quả, bạn có thể xem thêm nó [ở đây](https://en.wikipedia.org/wiki/Decorator_pattern)

Bằng cách này, các lập trình viên có thể thoả sức viết thêm các modifier cho các router như Flask-Login, Flask-Cache.

Đơn giản là các library đó sẽ viết thêm các decorator để người dùng có thể sử dụng cho bất kì router nào họ muốn, thật quá đơn giản.

### 3. Flask tương thích với đa số các Python web server

Flask được implement dựa trên [WSGI](https://wsgi.readthedocs.io/en/latest/what.html) nên nó có thể chạy dễ dàng trên các web server như gunicorn, uvicorn hay hypercorn. Thậm chí, từ xa xưa, Apache cũng có một module cho wsgi là `mod_wsgi`.

### 4. Context

Một điều thú vị nữa mà Flask đem lại có lẽ là khái niệm về `context`.

Nếu bạn nào từng làm Django hẳn sẽ gặp những trường hợp như bạn phải pass cái biến `request` qua 3, 4 hàm lồng nhau, trên thực tế nó không chỉ đem lại một cấu trúc code rối rắm mà còn làm mất tính đồng nhất khó kiểm soát.

Flask đi sau và tất nhiên nó có giải pháp khắc phục chuyện này - `context`.

Như bạn biết, khi có 2 request (2 `context` khác nhau) gửi đến app của bạn, app của bạn cơ bản là fork ra 2 thread khác nhau để xử lí 2 request đó.

Flask có một proxy có thể phân biệt request của từng thread là `flask.request`.

Khi bạn gọi `flask.request`, Flask app sẽ tìm đúng request mà bạn sở hữu và trả về một `Request` object, object này mang toàn bộ thông tin request của client gửi đến server.

```python
@app.route('/books')
def create_book():
	print(id(flask.request))
	...
```

Khi có 2 request đến đồng thời, `flask.request` sẽ có trỏ đến 2 `Request` object khác nhau tuỳ vào việc nó được gọi trong thread nào. Vâng, nó thật là kì diệu.

Chi tiết cụ thể tại sao Flask có thể làm được việc này mình sẽ nói trong bài viết sau, khi nói về thread local.

Bạn cũng có thể thấy khái niệm `context` này được sử dụng trong [ReactJS](https://reactjs.org/docs/context.html) để giải quyết vấn đề tương tự.

Ngoài [request context](https://flask.palletsprojects.com/en/1.1.x/reqcontext/), flask còn có [application context](https://flask.palletsprojects.com/en/1.1.x/appcontext/), các bạn có thể tham khảo tài liệu của Flask để biết thêm cách dùng của nó.

### 5. Testing

Testing luôn là một vấn đề khó khăn đối với đa số các bạn, trong đó có cả mình 😆. Điều đó càng trở nên kinh dị nếu như framework mà bạn chọn không hỗ trợ tốt unit testing. Thật may mắn, Flask làm việc này cực kì tốt (so với đa số các web framework trong Python 😀).

Khi bạn viết một app trong Flask, về cơ bản là bạn tạo ra một `Flask` object với hàng tá các router trong đó.

Vậy việc test app chính là việc test các hàm router trong cái app này. Vậy làm sao để test các hàm đó khi nó đang nằm trong app, thậm chí, có thế hàm đó đang được decorate bởi một đống các hàm khác?

Flask giúp chúng ta điều này bằng cách cung cấp cho bạn một `TestClient` object, cái đó đóng vai trò như là một client thực sự.

Để tạo được object này, bạn chỉ cần gọi phương thức `test_client` trong `Flask` object

Giả sử, backend của bạn có một api truyền lên tên một người và trả về lời chào người đó, bạn có thể làm như sau:

```python
app = Flask(__name__)

@app.route('/say/<name>', methods=['GET'])
def say_hello(name):
	return f'Hello, {name}'

client = app.test_client()

response = client.get('/say/Thanh')

assert response.data == b'Hello, Thanh'
```

OK, đó là những điều mình cảm thấy Flask thật tuyệt vời để mình có thể phát triển một webservice trong Python. Bạn thì sao, cho mình ý kiến của các bạn trong phần comment bên dưới nhé, bye bye.


Giả sử, mình có project Django như sau:

```sh
── app
│   ├── admin.py
│   ├── apps.py
│   ├── __init__.py
│   ├── migrations
│   ├── models.py
│   ├── static
│   ├── templates
│   ├── tests.py
│   ├── urls.py
│   └── views.py
├── db.sqlite3
├── demo
│   ├── __init__.py
│   ├── settings.py
│   ├── urls.py
│   └── wsgi.py
└── manage.py
```

Để tắt chế độ debug trong Django, các bạn sẽ sửa biến DEBUG trong file settings.py như sau

```python
DEBUG = False if .getenv('DEBUG', '0') == 0 else True
```

OK, như vậy tưởng như xong =)). Nhưng không, khi mở trình duyệt và vào trang web của mình, các bạn sẽ thấy html vẫn được render trong khi url của các static file lại báo lỗi 404???

Mặc định, Django trong chế độ non debug sẽ không chịu trách nhiệm việc serve các static file nên khi tắt chế độ debug, trình duyệt sẽ không tải được các file ảnh, css, js, …

Để khắc phục vấn đề này, mình sẽ để thằng Django render template trong khi đó, Nginx sẽ đóng vai trò là reversed proxy và serve static file

Đầu tiên, mình sẽ quy định url của static file khi Django render template và đường dẫn static file trên host machine. Các config này nên quy định trong demo/settings.py

```python
STATIC_URL = '/static/'
STATIC_ROOT = '/var/demo/static'
```

Tiếp theo, mình sẽ config urlpatterns để mỗi khi template engine của Django render html sẽ render đúng url của static file mà mình quy định. Trong demo/urls.py

```python
from django.contrib.staticfiles.urls import static
from django.conf import settings

urlpatterns += static(
    prefix=getattr(settings, 'STATIC_URL'),
    document_root=getattr(settings, 'STATIC_ROOT')
)
```

OK, vậy là mình đã config xong đối với Django, giờ sẽ config Nginx để serve đúng chỗ của static file, ở đây là /var/demo/static . Mình tạo file /etc/nginx/conf.d/demo.conf, với nội dung như sau:

```
server {
    listen 80;
    server_name demo;

    location / {
        proxy_pass http://127.0.0.1:8000;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
    }

    location /static {
        alias /var/demo/static;
    }
}
```

Sau khi config xong, mình chạy lệnh sau trong thư mục project của Django:

```sh
$ ./manage.py collectstatic
```

Các static file ở các app mà project inject vào sẽ được gom vào STATIC_ROOT. Bây giờ, Nginx chỉ việc serve các file đó thôi ✌️

Các bạn có thể lấy repo này về test thử, https://github.com/magiskboy/django-app-deployment.

Ngoài các static file, các bạn cũng có thể áp dụng cách này đối với các file được người dùng từ client upload lên server.


Tag: web

Sử dụng Lighthouse và React Developer Tools để đánh giá hiệu năng web

Flask Context và những điều cần biết

Flask có gì hay!

Serve static file in Django