This is the 15th day of my participation in the August More text Challenge. For details, see: August More Text Challenge

☔ Project Introduction

This little flask learned to use, the flask blueprint, template inheritance and MTV mode and some simple front-end operations, simple to what? Let’s say that a fat is the first time to write front-end, zero base. Then we can only achieve registration and deletion at present.

☔ Effect

☔ source code and implementation steps

☔ Implementation Steps

• First, the MTV model builds engineering

• Next, create the configurationsettings.pyThe main function of the apps package is to establish the transformation between blueprints and implementation routes of the functionality.

• The last istemplatesModule template inheritance and the front – end display functionalitystaticWe have not yet implemented the part we will complete in the next article.

☔ source

Top-down presentationmodel: to establish aUserclass

class User:
    def __init__(self,name,password,phone=None) :
        self.name=name
        self.password=password
        self.phone=phone

    def __str__(self) :
        return self.name

Copy the code

View: the template

from flask import Blueprint,request,render_template,redirect

from apps.user.model import User

user_bp=Blueprint('user',__name__)

users=[]

@user_bp.route('/')
def user_center() :
    return render_template('user/show.html',users=users)

@user_bp.route('/register',methods=['Get'.'POST'])
def register() :
    name = request.form.get("username")
    password = request.form.get("password")
    repassword = request.form.get("repassword")
    phone = request.form.get("phone")
    if request.method=='POST':
        for i in users:
            if i.name==name:
                return render_template('user/register.html',msg="User name already exists, let's find another one.")

        users.append(User(name,password,phone))
        return redirect('/')
    return render_template('user/register.html')


@user_bp.route('/login',methods=['GET'.'POST'])
def lofin() :
    return "User login"

@user_bp.route('/logout',methods=['GET'.'POST'])
def lofout() :
    return "Log out"

@user_bp.route('/delete')
def del_user() :
    name=request.args.get('name')
    for user in users:
        if user.name==name:
            users.remove(user)
            return redirect('/user/show.html')
    else:
        return "Deletion failed"

Copy the code

Init: This is the initialization of the apps, don’t get it wrong

from flask import Flask

import settings
from apps.user.view import user_bp


def create_app() :
    app=Flask(__name__,template_folder='.. /templates',static_folder='.. /static')
    app.config.from_object(settings)# Load configuration
    # blueprint
    app.register_blueprint(user_bp)
    #print(app.url_map)
    return app


Copy the code

tmeplates I’ve posted it from top to bottom here,loginDon’t use

{% extends 'base.html'%} {% block title %} User register {% endBlock %} {% block Center %}<br><br><br><br>
    <p><font color=#FF3366>{{msg}}</font> </p>
    <form action="/register" method="post">
        <p><input type="text" name="username" placeholder="User name"></p>
        <p><input type="password" name="password" placeholder="Password"></p>
        <p><input type="password" name="repassword" placeholder="Confirm password"></p>
        <p><input type="text" name="phone" placeholder="Cell phone number"></p>
        <p><input type="submit" value="Registered"></p>
    </form>

{% endblock %}
Copy the code

show.html

{% extends 'base.html'%}
{% block center %}
<br><br><br><br>
<h1>The user information</h1>
<span>The number of the current user: {{users | length}}</span>
<table border="2" cellspacing="1" width="60%">
    {% for user in users %}
    <tr>
        <td>{{ loop.index}}</td>
        <td>{{user.name}}</td>
        <td>{{user.password}}</td>
        <td>{{user.phone}}</td>
        <td><a href="">Modify the</a>   <a href="javascript:;" onclick="del('{{ user.name }}')">delete</a></td>

    </tr>
    
    {% endfor %}
</table>
<br>
<div><a href="">Return to the home page</a> </div>
{% endblock%}

{% block myjs %}
<script>

    function del(name){
        location.href='/delete? name='+name

    }
</script>

{% endblock %}
Copy the code

base.html

<! DOCTYPEhtml>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{% block title %} User center {% endBlock %}</title>
    <style>
        #head{
        height:500px;
        background-color:bisque;
        }
        #head ul{
        list-style:none;
        height:50px;
        }
        #header ul li{
        float:left;
        width:200px;
        text-align:center;
        font-size:18px;
        height:50px;
        line-height:50px;
        background-color:snow;
        }
        #center {
        height:800px;
        background-color:#99FFFF;
        }
        #footer{
        height:50px;
        line-height:50px;
        background-color:black;
        text-color:sonw;
        }
    </style>
    {% block mycss%}

    {% endblock %}
</head>
<body>
<div id="header">
    <ul>
        <li><a href="">Home page</a></li>
        <li><a href="">Chinese valentine's day</a></li>
        <li><a href="">Fall in love</a></li>
        <li><a href="">The evening's welfare</a></li>
    </ul>
</div>

<div id="center">

    {% block center %}

    {% endblock %}

</div>
<div id="footer">At the bottom of the</div>

{% block myjs%}

{% endblock %}
</body>
</html>
Copy the code

Master file and configuration file

from apps import create_app
app=create_app()
if __name__ == '__main__':
    app.run()
Copy the code

The configuration file

ENV='development'
DEBUG=True
Copy the code

More wonderful, support more text behind