flask로 당신의 첫 번째 사이트를 만듭니다!
파이톤은 현재 웹 개발 분야에서 붐을 일으키며 매년 지속적으로 성장하고 있다.파이톤을 사용하기 시작하는 것은 쉬울 뿐만 아니라, 그렇게 많은 의존항을 단독으로 다운로드할 필요가 없다.
이 프로젝트를 시작하기 위해서, 우리는 우리의 프로젝트에 필요한 소프트웨어 패키지를 설정할 것이다.
mkdir flaskproject
그리고 이 디렉터리로 이동해서python 프로젝트 파일을 만듭니다.
프로젝트를 위한 디렉토리로 이동
cd flaskproject
touch flaskweb.py
우리는 이곳에서 html 파일을 만들 것이다
mkdir templates
mkdir static
pip install virtualenv
virtualenv dev
source dev/Scripts/activate
pip install flask
code flaskweb.py
from flask import Flask
app = Flask(__name__)
@app.route("/")
def regiter():
return <h1>my first flask project</h1>
if __name__ == "__main__":
app.run(debug=True)
.png)
그리고 루트가 있는 함수를 만들고 html 파일을 보여 드리겠습니다.
from flask import Flask, render_template, request, url_for, session
app = Flask(__name__)
@app.route("/")
def home():
#our code will co here
return render_template('home.html')
@app.route("/login")
def login():
#our code will co here
return render_template('login.html')
@app.route("/logout")
def logout():
#our code will co here
return redirect(url_for('login'))
@app.route("/register")
def register():
#our code will co here
return redirect('register.html')
if __name__ == "__main__":
app.run(debug=True)
<!DOCTYPE html>
<html>
<head>
{% block title %}
<!-- we are using jinja templates to create a block where code from other html files will be passed-->
{% endblock title %}
<link rel="stylesheet" href="{{url_for('static', filename='login.css')}}">
</head>
<body>
{% block body%}
{%endblock body%}
</body>
</html>
그리고 우리는 로그인을 만들고 로그인에 폼을 등록할 것입니다.html 파일.
{% extends 'layout.html' %}
{% block title%}
<title>
{%if title%}
{{title}}
{% else%}
login
{% endif %}
</title>
{%endblock title%}
{% block body%}
<div class="login-wrap">
<div class="login-html">
<input id="tab-1" type="radio" name="tab" class="sign-in" checked><label for="tab-1" class="tab">Sign In</label>
<input id="tab-2" type="radio" name="tab" class="sign-up"><label for="tab-2" class="tab">Sign Up</label>
<div class="login-form">
<div class="sign-in-htm">
<form action="{{ url_for('login') }}" method="post" >
<div class="group">
<label for="user" class="label">Username</label>
<input id="user" type="text" class="input" name="Username">
</div>
<div class="group">
<label for="pass" class="label">Password</label>
<input id="pass" type="password" class="input" data-type="password" name="password">
</div>
<div class="group">
<input id="check" type="checkbox" class="check" checked>
<label for="check"><span class="icon"></span> Keep me Signed in</label>
</div>
<div class="msg">{{ msg }}</div>
<div class="group">
<input type="submit" class="button" value="Sign In">
</div>
</form>
<div class="hr"></div>
<div class="foot-lnk">
<a href="#forgot">Forgot Password?</a>
</div>
</div>
<div class="sign-up-htm">
<form action="{{ url_for('register') }}" method="post">
<div class="group">
<label for="user" class="label" name="username">Username</label>
<input id="user" type="text" class="input">
</div>
<div class="group">
<label for="pass" class="label" name="password">Password</label>
<input id="pass" type="password" class="input" data-type="password">
</div>
<div class="group">
<label for="pass" class="label" name="retry_password">Repeat Password</label>
<input id="pass" type="password" class="input" data-type="password">
</div>
<div class="group">
<label for="pass" class="label" name="email">Email Address</label>
<input id="pass" type="text" class="input">
</div>
<div class="msg">{{ msg }}</div>
<div class="group">
<input type="submit" class="button" value="Sign Up">
</div>
</form>
<div class="hr"></div>
<div class="foot-lnk">
<label for="tab-1">Already Member?</a>
</div>
</div>
</div>
</div>
</div>
{%endblock body%}
{% extends 'layout.html' %}
{% block title%}
<title>
{%if title%}
{{title}}
{% else%}
home
{% endif %}
</title>
{%endblock title%}
{% block body%}
<h2>Home Page</h2>
<p>Welcome back, {{ username }}!</p>
{%endblock body%}
body{
margin:0;
background:url(../images/loginbackground.jpg) no-repeat center;
font:600 16px/18px 'Open Sans',sans-serif;
padding: 0;
}
*,:after,:before{box-sizing:border-box}
.clearfix:after,.clearfix:before{content:'';display:table}
.clearfix:after{clear:both;display:block}
a{color:inherit;text-decoration:none}
.login-wrap{
width:100%;
margin:auto;
max-width:525px;
min-height:670px;
position:relative;
background:url(https://raw.githubusercontent.com/khadkamhn/day-01-login-form/master/img/bg.jpg) no-repeat center;
box-shadow:0 12px 15px 0 rgba(0,0,0,.24),0 17px 50px 0 rgba(0,0,0,.19);
}
.login-html{
width:100%;
height:100%;
position:absolute;
padding:90px 70px 50px 70px;
background:rgba(40,57,101,.9);
}
.login-html .sign-in-htm,
.login-html .sign-up-htm{
top:0;
left:0;
right:0;
bottom:0;
position:absolute;
transform:rotateY(180deg);
backface-visibility:hidden;
transition:all .4s linear;
}
.login-html .sign-in,
.login-html .sign-up,
.login-form .group .check{
display:none;
}
.login-html .tab,
.login-form .group .label,
.login-form .group .button{
text-transform:uppercase;
}
.login-html .tab{
font-size:22px;
margin-right:15px;
padding-bottom:5px;
margin:0 15px 10px 0;
display:inline-block;
border-bottom:2px solid transparent;
}
.login-html .sign-in:checked + .tab,
.login-html .sign-up:checked + .tab{
color:#fff;
border-color:#1161ee;
}
.login-form{
min-height:345px;
position:relative;
perspective:1000px;
transform-style:preserve-3d;
}
.login-form .group{
margin-bottom:15px;
}
.login-form .group .label,
.login-form .group .input,
.login-form .group .button{
width:100%;
color:#fff;
display:block;
}
.login-form .group .input,
.login-form .group .button{
border:none;
padding:15px 20px;
border-radius:25px;
background:rgba(255,255,255,.1);
}
.login-form .group input[data-type="password"]{
text-decoration:circle;
-webkit-text-security:circle;
}
.login-form .group .label{
color:#aaa;
font-size:12px;
}
.login-form .group .button{
background:#1161ee;
}
.login-form .group label .icon{
width:15px;
height:15px;
border-radius:2px;
position:relative;
display:inline-block;
background:rgba(255,255,255,.1);
}
.login-form .group label .icon:before,
.login-form .group label .icon:after{
content:'';
width:10px;
height:2px;
background:#fff;
position:absolute;
transition:all .2s ease-in-out 0s;
}
.login-form .group label .icon:before{
left:3px;
width:5px;
bottom:6px;
transform:scale(0) rotate(0);
}
.login-form .group label .icon:after{
top:6px;
right:0;
transform:scale(0) rotate(0);
}
.login-form .group .check:checked + label{
color:#fff;
}
.login-form .group .check:checked + label .icon{
background:#1161ee;
}
.login-form .group .check:checked + label .icon:before{
transform:scale(1) rotate(45deg);
}
.login-form .group .check:checked + label .icon:after{
transform:scale(1) rotate(-45deg);
}
.login-html .sign-in:checked + .tab + .sign-up + .tab + .login-form .sign-in-htm{
transform:rotate(0);
}
.login-html .sign-up:checked + .tab + .login-form .sign-up-htm{
transform:rotate(0);
}
.hr{
height:2px;
margin:60px 0 50px 0;
background:rgba(255,255,255,.2);
}
.foot-lnk{
text-align:center;
}
mySQL을 설정한 후
당신이 가장 좋아하는 이름으로 새 데이터베이스를 만듭니다.그리고 다음 sql 코드를 사용하여 데이터베이스에 주어진 값을 가진 표를 만듭니다
CREATE TABLE IF NOT EXISTS `users` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`username` varchar(50) NOT NULL,
`password` varchar(255) NOT NULL,
`email` varchar(100) NOT NULL,
PRIMARY KEY (`id`)
) ```
We will then link the database with our project. To facilatate this we have to install pymysql module that will help us in the connection. Open your command prompt and use pip to install the module.
```cmd
pip install pymysql
from flask import Flask, render_template, request, url_for, session
import pymysql
from flask import Flask, render_template, request, url_for, session
import pymysql
pp = Flask(__name__)
# database connection details
# Intializing MySQL
connection = pymysql.connect(host='localhost', password='', user='root', database='luxproject')
@app.route("/register", methods=['POST', 'GET'])
def regiter():
if request.method == "POST":
username = request.form['username']
phone = request.form['phone']
password = request.form['password']
@app.route('/register' , methods=['GET', 'POST'])
def register():
msg=''
# Check if "username", "password" and "email" POST requests exist (user submitted form)
if request.method == 'POST' and 'username' in request.form and 'password' in request.form and 'email' in request.form:
# Create variables for easy access
username = request.form['username']
password = request.form['password']
email = request.form['email']
# Show registration form with message (if any)
cursor = connection.cursor()
cursor.execute('SELECT * FROM users WHERE username = {}'.format(username,))
account = cursor.fetchone()
# If account exists show error and validation checks
if account:
msg = 'Account already exists!'
elif not re.match(r'[^@]+@[^@]+\.[^@]+', email):
msg = 'Invalid email address!'
elif not re.match(r'[A-Za-z0-9]+', username):
msg = 'Username must contain only characters and numbers!'
elif not username or not password or not email:
msg = 'Please fill out the form!'
else:
# Account doesnt exists and the form data is valid, now insert new account into accounts table
cursor.execute('INSERT INTO users VALUES (NULL, %s, %s, %s)', (username, password, email,))
connection.commit()
msg = 'You have successfully registered!'
elif request.method == 'POST':
# Form is empty... (no POST data)
msg = 'Please fill out the form!'
return render_template('login.html', msg=msg)
@app.route('/login', methods=['GET', 'POST'])
def login():
msg=''
# Check if "username" and "password" POST requests exist (user submitted form)
if request.method == 'POST' and 'username' in request.form and 'password' in request.form:
# Create variables for easy access
username = request.form['username']
password = request.form['password']
# Check if account exists using MySQL
cursor = connection.cursor()
cursor.execute('SELECT * FROM users WHERE username = %s AND password = %s', (username, password,))
# Fetch one record and return result
account = cursor.fetchone()
# If account exists in accounts table in out database
if account:
# Create session data, we can access this data in other routes
session['loggedin'] = True
session['id'] = account['id']
session['username'] = account['username']
# Redirect to home pag(
return render_template('home.html')
else:
# Account doesnt exist or username/password incorrect
msg = 'Incorrect username/password!'
return render_template('login.html', msg=msg)
가정 기능
def home():
# Check if user is loggedin
if 'loggedin' in session:
# User is loggedin show them the home page
return render_template('home.html', username=session['username'])
# User is not loggedin redirect to login page
return redirect(url_for('login'))
@app.route('/pythonlogin/logout')
def logout():
# Remove session data, this will log the user out
session.pop('loggedin', None)
session.pop('id', None)
session.pop('username', None)
# Redirect to login page
return redirect(url_for('login'))
import re
from flask import Flask, render_template, request, url_for, session
import pymysql
from werkzeug.utils import redirect
app = Flask(__name__)
# database connection details
# Intializing MySQL
connection = pymysql.connect(host='localhost', password='', user='root', database='luxproject')
@app.route('/')
@app.route('/home')
def home():
# Check if user is loggedin
if 'loggedin' in session:
# User is loggedin show them the home page
return render_template('home.html', username=session['username'])
# User is not loggedin redirect to login page
return redirect(url_for('login'))
@app.route('/login', methods=['GET', 'POST'])
def login():
msg=''
# Check if "username" and "password" POST requests exist (user submitted form)
if request.method == 'POST' and 'username' in request.form and 'password' in request.form:
# Create variables for easy access
username = request.form['username']
password = request.form['password']
# Check if account exists using MySQL
cursor = connection.cursor()
cursor.execute('SELECT * FROM users WHERE username = %s AND password = %s', (username, password,))
# Fetch one record and return result
account = cursor.fetchone()
# If account exists in accounts table in out database
if account:
# Create session data, we can access this data in other routes
session['loggedin'] = True
session['id'] = account['id']
session['username'] = account['username']
# Redirect to home pag(
return render_template('home.html')
else:
# Account doesnt exist or username/password incorrect
msg = 'Incorrect username/password!'
return render_template('login.html', msg=msg)
@app.route('/pythonlogin/logout')
def logout():
# Remove session data, this will log the user out
session.pop('loggedin', None)
session.pop('id', None)
session.pop('username', None)
# Redirect to login page
return redirect(url_for('login'))
@app.route('/register' , methods=['GET', 'POST'])
def register():
msg=''
# Check if "username", "password" and "email" POST requests exist (user submitted form)
if request.method == 'POST' and 'username' in request.form and 'password' in request.form and 'email' in request.form:
# Create variables for easy access
username = request.form['username']
password = request.form['password']
email = request.form['email']
# Show registration form with message (if any)
cursor = connection.cursor()
cursor.execute('SELECT * FROM users WHERE username = {}'.format(username,))
account = cursor.fetchone()
# If account exists show error and validation checks
if account:
msg = 'Account already exists!'
elif not re.match(r'[^@]+@[^@]+\.[^@]+', email):
msg = 'Invalid email address!'
elif not re.match(r'[A-Za-z0-9]+', username):
msg = 'Username must contain only characters and numbers!'
elif not username or not password or not email:
msg = 'Please fill out the form!'
else:
# Account doesnt exists and the form data is valid, now insert new account into accounts table
cursor.execute('INSERT INTO users VALUES (NULL, %s, %s, %s)', (username, password, email,))
connection.commit()
msg = 'You have successfully registered!'
elif request.method == 'POST':
# Form is empty... (no POST data)
msg = 'Please fill out the form!'
return render_template('login.html', msg=msg)
if __name__ == ('__main__'):
app.run(debug=True)
Reference
이 문제에 관하여(flask로 당신의 첫 번째 사이트를 만듭니다!), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/chris_murimi/build-your-first-website-with-flask-1nea텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
좋은 웹페이지 즐겨찾기
