Website viết bằng Python

Question

Lập trình Web với Python là một trong những từ khóa được tìm kiếm nhiều nhất trên google về chủ đề lập trình Web với Python. Trong bài viết này, coder.com.vn sẽ viết bài Hướng dẫn Cách lập trình Web với Python hiệu quả mới nhất 2020

Nội dung chính Show

I. Tạo môi trường
Thiết lập framework Flask:
II. Xây dựng trang chủ
III. Xây dựng trang đăng ký
VI. Tổng kết
V. Đường link tìm đọc

Khi nói tới lập trình website thì có lẽ cực kì nhiều lập trình viên sẽ liên tưởng ngay tới ngôn ngữ php. Ngôn ngữ php được biết đến là ngôn ngữ được tạo ra để phục vụ cho việc làm web với rất nhiều framework, cms có thêm với một cộng đồng rất đông , hung hãn nhưng tại bài viết tôi mong muốn trình bày một đến gần hơn khác, bằng ngôn ngữ khác cho công cuộc làm web đấy là lập trình web với ngôn ngữ python.

Mục Lục

I. Tạo môi trường

Chọn lựa framework: Hiện tại có rất nhiều framework hỗ trợ lập trình website bằng ngôn ngữ python trong đó có 3 cái tên đó là Django, Flask, Pyramid … Mỗi framework đều có điểm mạnh và điểm yếu riêng của nó, để hiểu cụ thể hơn hãy tham khảo phần “Link tham khảo” ở phần cuối của bài viết này. tại chẳng hạn như này tôi recommend về framework Flask (Flask là một microframework cho Python dựa trên Werkzeug, Jinja 2.)

Thiết lập framework Flask:

Thiết lập python và pid như link sau:

https://docs.python-guide.org/starting/install3/osx/

Cài đặt Flask

pip install flask

Tạo thư mục của dự án:

mkdir hoctiengnhatonline

Tạo một tệp khởi tạo app.py trong thư mục “hoctiengnhatonline”, sau đó cấu hình để sử dụng module Flask tại tệp app.py

from flask import Flask
app = Flask(__name__)@app.route("/")defmain():return"Welcome"if __name__ == "__main__":
  app.run()

Thực thi app.py

python app.py

Vào trình duyệt và truy xuất đường link dưới đây

from flask import Flask
app = Flask(__name__)@app.route("/")defmain():return"Welcome"if __name__ == "__main__":
  app.run()

0

II. Xây dựng trang chủ

Tại folder

from flask import Flask
app = Flask(__name__)@app.route("/")defmain():return"Welcome"if __name__ == "__main__":
  app.run()

1 tạo folder

from flask import Flask
app = Flask(__name__)@app.route("/")defmain():return"Welcome"if __name__ == "__main__":
  app.run()

2, tại thư mục

from flask import Flask
app = Flask(__name__)@app.route("/")defmain():return"Welcome"if __name__ == "__main__":
  app.run()

2 xây dựng một tệp đặt tên là

from flask import Flask
app = Flask(__name__)@app.route("/")defmain():return"Welcome"if __name__ == "__main__":
  app.run()

4, mở tệp

from flask import Flask
app = Flask(__name__)@app.route("/")defmain():return"Welcome"if __name__ == "__main__":
  app.run()

4 thêm đoạn code HTML sau đây vào:

<htmllang="en">
 
<head>
    <title>Hoc Tieng Nhat online Apptitle>
 
 
    <đường linkhref="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"rel="stylesheet">
 
    <linkhref="https://hroy.eu/bootstrap/docs/examples/jumbotron-narrow/jumbotron-narrow.css"rel="stylesheet">
 
 
head>
 
<body>
 
    <divclass="container">
        <divclass="header">
            <nav>
                <ulclass="nav nav-pills pull-right">
                    <lirole="presentation"class="active"><ahref="#">Homea>
                    li>
                    <lirole="presentation"><ahref="#">Sign Ina>
                    li>
                    <lirole="presentation"><ahref="showSignUp">Sign Upa>
                    li>
                ul>
            nav>
            <heading 3class="text-muted">Hoc tieng Nhat online AppH3>
        div>
 
        <divclass="jumbotron">
            <heading 1>Japanese Lesson Appheading 1>
            <pclass="lead">p>
            <p><aclass="btn btn-lg btn-success"href="showSignUp"role="button">Sign up todaya>
            p>
        div>
 
        <divclass="row marketing">
            <divclass="col-lg-6">
                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>

                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>

                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>
            div>
 
            <divclass="col-lg-6">
                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>

                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>

                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>
            div>
        div>
 
        <footerclass="footer">
            <p>© Copyright 2019p>
        footer>
 
    div>
body>
 
html>

Mở

from flask import Flask
app = Flask(__name__)@app.route("/")defmain():return"Welcome"if __name__ == "__main__":
  app.run()

6 ,

from flask import Flask
app = Flask(__name__)@app.route("/")defmain():return"Welcome"if __name__ == "__main__":
  app.run()

7, cái mà chúng ta sẽ sử dụng để kết xuất những tập tin

from flask import Flask
app = Flask(__name__)@app.route("/")defmain():return"Welcome"if __name__ == "__main__":
  app.run()

8.

from flask import Flask, render_template

Sửa phương thức chủ đạo để trả về tập tin template đã được kết xuất.

defmain():return render_template('index.html')

Mở trình duyệt , truy cập http://localhost:5000/ , sẽ thấy màn hình dưới đây:

>>> Blog chia sẻ kiến thức xây dựng website

III. Xây dựng trang đăng ký

Bước 1: xây dựng Database

Tạo database tên là

from flask import Flask
app = Flask(__name__)@app.route("/")defmain():return"Welcome"if __name__ == "__main__":
  app.run()

1

CREATEDATABASE hoctiengnhatonline;

xây dựng bảng lưu người sử dụng

python app.py

0

CREATETABLE`hoctiengnhatonline`.`tbl_user` (`user_id`BIGINT AUTO_INCREMENT,`user_name`VARCHAR(4.) NULLvà`user_username`VARCHAR(4) NULLvà`user_password`VARCHAR(4) NULL,
  PRIMARY KEY (`user_id`));

tạo thủ tục để lưu nội dung người dùng đặt tên là

python app.py

1

DELIMITER $CREATE DEFINER=`root`@`localhost`PROCEDURE`sp_createUser`(IN p_name VARCHAR(2),IN p_username VARCHAR(2.),IN p_password VARCHAR(2)
)BEGINif ( selectexists (select1from tbl_user where user_username = p_username) ) THENselect'Username Exists !!';
     
    ELSEinsertinto tbl_user
        (
            user_name,
            user_username,
            user_password
        )values(
            p_name,
            p_username,
            p_password
        );ENDIF;END$
DELIMITER ;

Bước 2. Tạo bố cụ và giao diện đăng ký

Trong folder

python app.py

2 xây dựng một tệp HTML đặt tên là

python app.py

3, sau đó chèn đoạn code phía dưới vào tập tin

python app.py

3

mkdir hoctiengnhatonline

0

Tạo thêm tệp

python app.py

5 trong folder

python app.py

6 bên trong

from flask import Flask
app = Flask(__name__)@app.route("/")defmain():return"Welcome"if __name__ == "__main__":
  app.run()

1

mkdir hoctiengnhatonline

1

Thêm đoạn code sau vào trong file

from flask import Flask
app = Flask(__name__)@app.route("/")defmain():return"Welcome"if __name__ == "__main__":
  app.run()

6

mkdir hoctiengnhatonline

2

Nhập chuột vào nút

python app.py

9 màn hình ảnh dưới đây được hiển thị:

Bước 3 Xây dựng phương thức đăng ký

Thêm đoạn code giải quyết đăng ký

<htmllang="en">
 
<head>
    <title>Hoc Tieng Nhat online Apptitle>
 
 
    <đường linkhref="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"rel="stylesheet">
 
    <linkhref="https://hroy.eu/bootstrap/docs/examples/jumbotron-narrow/jumbotron-narrow.css"rel="stylesheet">
 
 
head>
 
<body>
 
    <divclass="container">
        <divclass="header">
            <nav>
                <ulclass="nav nav-pills pull-right">
                    <lirole="presentation"class="active"><ahref="#">Homea>
                    li>
                    <lirole="presentation"><ahref="#">Sign Ina>
                    li>
                    <lirole="presentation"><ahref="showSignUp">Sign Upa>
                    li>
                ul>
            nav>
            <heading 3class="text-muted">Hoc tieng Nhat online AppH3>
        div>
 
        <divclass="jumbotron">
            <heading 1>Japanese Lesson Appheading 1>
            <pclass="lead">p>
            <p><aclass="btn btn-lg btn-success"href="showSignUp"role="button">Sign up todaya>
            p>
        div>
 
        <divclass="row marketing">
            <divclass="col-lg-6">
                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>

                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>

                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>
            div>
 
            <divclass="col-lg-6">
                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>

                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>

                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>
            div>
        div>
 
        <footerclass="footer">
            <p>© Copyright 2019p>
        footer>
 
    div>
body>
 
html>

0 và import thêm thư viện vào tệp

from flask import Flask
app = Flask(__name__)@app.route("/")defmain():return"Welcome"if __name__ == "__main__":
  app.run()

6

mkdir hoctiengnhatonline

3

,

mkdir hoctiengnhatonline

4

Bước 4 Tạo đăng ký từ client

mkdir hoctiengnhatonline

5

Bước 5. Lưu thông tin bằng thủ tục của Mysql

đầu tiên cài đặt thư viện

<htmllang="en">
 
<head>
    <title>Hoc Tieng Nhat online Apptitle>
 
 
    <đường linkhref="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"rel="stylesheet">
 
    <linkhref="https://hroy.eu/bootstrap/docs/examples/jumbotron-narrow/jumbotron-narrow.css"rel="stylesheet">
 
 
head>
 
<body>
 
    <divclass="container">
        <divclass="header">
            <nav>
                <ulclass="nav nav-pills pull-right">
                    <lirole="presentation"class="active"><ahref="#">Homea>
                    li>
                    <lirole="presentation"><ahref="#">Sign Ina>
                    li>
                    <lirole="presentation"><ahref="showSignUp">Sign Upa>
                    li>
                ul>
            nav>
            <heading 3class="text-muted">Hoc tieng Nhat online AppH3>
        div>
 
        <divclass="jumbotron">
            <heading 1>Japanese Lesson Appheading 1>
            <pclass="lead">p>
            <p><aclass="btn btn-lg btn-success"href="showSignUp"role="button">Sign up todaya>
            p>
        div>
 
        <divclass="row marketing">
            <divclass="col-lg-6">
                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>

                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>

                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>
            div>
 
            <divclass="col-lg-6">
                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>

                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>

                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>
            div>
        div>
 
        <footerclass="footer">
            <p>© Copyright 2019p>
        footer>
 
    div>
body>
 
html>

2 cho flask bằng lệnh sau:

mkdir hoctiengnhatonline

6

trong file

from flask import Flask
app = Flask(__name__)@app.route("/")defmain():return"Welcome"if __name__ == "__main__":
  app.run()

6 import thêm thư viện , thêm các đoạn code giải quyết sau vào

mkdir hoctiengnhatonline

7

Tại function giải quyết đăng ký thông tin người dùng thêm đoạn code sau:

mkdir hoctiengnhatonline

8

Lưu những thay đổi và khởi động lại máy chủ. Đi đến trang đăng ký và nhập

<htmllang="en">
 
<head>
    <title>Hoc Tieng Nhat online Apptitle>
 
 
    <đường linkhref="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"rel="stylesheet">
 
    <linkhref="https://hroy.eu/bootstrap/docs/examples/jumbotron-narrow/jumbotron-narrow.css"rel="stylesheet">
 
 
head>
 
<body>
 
    <divclass="container">
        <divclass="header">
            <nav>
                <ulclass="nav nav-pills pull-right">
                    <lirole="presentation"class="active"><ahref="#">Homea>
                    li>
                    <lirole="presentation"><ahref="#">Sign Ina>
                    li>
                    <lirole="presentation"><ahref="showSignUp">Sign Upa>
                    li>
                ul>
            nav>
            <heading 3class="text-muted">Hoc tieng Nhat online AppH3>
        div>
 
        <divclass="jumbotron">
            <heading 1>Japanese Lesson Appheading 1>
            <pclass="lead">p>
            <p><aclass="btn btn-lg btn-success"href="showSignUp"role="button">Sign up todaya>
            p>
        div>
 
        <divclass="row marketing">
            <divclass="col-lg-6">
                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>

                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>

                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>
            div>
 
            <divclass="col-lg-6">
                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>

                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>

                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>
            div>
        div>
 
        <footerclass="footer">
            <p>© Copyright 2019p>
        footer>
 
    div>
body>
 
html>

4,

<htmllang="en">
 
<head>
    <title>Hoc Tieng Nhat online Apptitle>
 
 
    <đường linkhref="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"rel="stylesheet">
 
    <linkhref="https://hroy.eu/bootstrap/docs/examples/jumbotron-narrow/jumbotron-narrow.css"rel="stylesheet">
 
 
head>
 
<body>
 
    <divclass="container">
        <divclass="header">
            <nav>
                <ulclass="nav nav-pills pull-right">
                    <lirole="presentation"class="active"><ahref="#">Homea>
                    li>
                    <lirole="presentation"><ahref="#">Sign Ina>
                    li>
                    <lirole="presentation"><ahref="showSignUp">Sign Upa>
                    li>
                ul>
            nav>
            <heading 3class="text-muted">Hoc tieng Nhat online AppH3>
        div>
 
        <divclass="jumbotron">
            <heading 1>Japanese Lesson Appheading 1>
            <pclass="lead">p>
            <p><aclass="btn btn-lg btn-success"href="showSignUp"role="button">Sign up todaya>
            p>
        div>
 
        <divclass="row marketing">
            <divclass="col-lg-6">
                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>

                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>

                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>
            div>
 
            <divclass="col-lg-6">
                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>

                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>

                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>
            div>
        div>
 
        <footerclass="footer">
            <p>© Copyright 2019p>
        footer>
 
    div>
body>
 
html>

5 và

<htmllang="en">
 
<head>
    <title>Hoc Tieng Nhat online Apptitle>
 
 
    <đường linkhref="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"rel="stylesheet">
 
    <linkhref="https://hroy.eu/bootstrap/docs/examples/jumbotron-narrow/jumbotron-narrow.css"rel="stylesheet">
 
 
head>
 
<body>
 
    <divclass="container">
        <divclass="header">
            <nav>
                <ulclass="nav nav-pills pull-right">
                    <lirole="presentation"class="active"><ahref="#">Homea>
                    li>
                    <lirole="presentation"><ahref="#">Sign Ina>
                    li>
                    <lirole="presentation"><ahref="showSignUp">Sign Upa>
                    li>
                ul>
            nav>
            <heading 3class="text-muted">Hoc tieng Nhat online AppH3>
        div>
 
        <divclass="jumbotron">
            <heading 1>Japanese Lesson Appheading 1>
            <pclass="lead">p>
            <p><aclass="btn btn-lg btn-success"href="showSignUp"role="button">Sign up todaya>
            p>
        div>
 
        <divclass="row marketing">
            <divclass="col-lg-6">
                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>

                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>

                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>
            div>
 
            <divclass="col-lg-6">
                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>

                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>

                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>
            div>
        div>
 
        <footerclass="footer">
            <p>© Copyright 2019p>
        footer>
 
    div>
body>
 
html>

6 , nhấp vào nút

<htmllang="en">
 
<head>
    <title>Hoc Tieng Nhat online Apptitle>
 
 
    <đường linkhref="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"rel="stylesheet">
 
    <linkhref="https://hroy.eu/bootstrap/docs/examples/jumbotron-narrow/jumbotron-narrow.css"rel="stylesheet">
 
 
head>
 
<body>
 
    <divclass="container">
        <divclass="header">
            <nav>
                <ulclass="nav nav-pills pull-right">
                    <lirole="presentation"class="active"><ahref="#">Homea>
                    li>
                    <lirole="presentation"><ahref="#">Sign Ina>
                    li>
                    <lirole="presentation"><ahref="showSignUp">Sign Upa>
                    li>
                ul>
            nav>
            <heading 3class="text-muted">Hoc tieng Nhat online AppH3>
        div>
 
        <divclass="jumbotron">
            <heading 1>Japanese Lesson Appheading 1>
            <pclass="lead">p>
            <p><aclass="btn btn-lg btn-success"href="showSignUp"role="button">Sign up todaya>
            p>
        div>
 
        <divclass="row marketing">
            <divclass="col-lg-6">
                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>

                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>

                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>
            div>
 
            <divclass="col-lg-6">
                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>

                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>

                <h4>Lesson Listh4>
                <p>Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson List Lesson Listp>
            div>
        div>
 
        <footerclass="footer">
            <p>© Copyright 2019p>
        footer>
 
    div>
body>
 
html>

7. Khi xây dựng chiến thắng người sử dụng, bạn sẽ có khả năng thấy một thông báo trong bố cụ và giao diện console của trình duyệt.

mkdir hoctiengnhatonline

9

VI. Tổng kết

Trong bài đăng này, tôi trình bày bí quyết cơ bản nhất khi lập trình website bằng ngôn ngữ python dùng framework Flask mong rằng sẽ phần nào giúp ích được phần nào đó cho bạn đọc lần đầu lập trình web bằng ngôn ngữ python. Hãy tham khảo tất cả source code ở link tham khảo dưới đây. trong bài đăng kế tiếp tôi sẽ thuyết trình kỹ hơn về các lưu ý khi lập trình website bằng python.

Xem thêm: Business Intelligence là gì? Các thuật ngữ thông dụng mà doanh nghiệp đang dùng

>>>> Blog chia sẻ kiến thức xây dựng website

V. Đường link tìm đọc

Học lập Trình

Nguồn: https://blog.vietnamlab.vn/

Tags: khóa học djangokhóa học lập trình web pythonlập trình backend pythonlập trình pythonlập trình web bằng pycharmpython djangopython webthiết kế web với python

programming python