關於python學習javascript
近年來,python編程語言大火,在2017年,國外的許多知名雜誌和機構都對python和其餘編程語言進行了比較。2017年7月,IEEE Spectrum 雜誌發佈了一年一度的編程語言排行榜,python居於首位;9月,Stack Overflow發佈的統計數據代表,python是增加量最快的編程語言。在2017年年底,IEEE Spectrum雜誌發佈了2017年的編程語言排行榜,從數據上顯示,python語言僅次於C語言,排名第二。至於國內,有關python的事情也不少,例如浙江信息技術教材將放棄VB,改向Python;山東小學教材加入Python內容;教育部也決定在2018年起,Python列入全國計算機等級考試等等新聞。在人工智能的時代,該學習什麼編程語言,python是不二之選。css
這個學期以來,咱們學習python,一方面是利用python語言進行爬蟲,另外一方面就是利用python來開發網頁。管理信息系統這門課程,咱們主要是學習了python的相關知識和利用python作前端網頁設計,如下爲這個學期關於python學習的總結和介紹了利用Python+Flask+MySQL的web建設技術過程。html
學期總結:在剛開始學習python的過程當中,前期主要利用python3.6軟件學習python的基礎知識,例如python中的turtle庫、利用python進行中文詞頻統計等;後期,主要利用python來設計網頁。python語言比java語言相對簡單一些,利用python作web方便快捷。在整個學期的學習過程當中,前期所學的python基礎知識都沒什麼問題,可是在後來的學習,利用python設計web的知識就逐漸深刻了。剛開始設計簡單的web模板還行,到了後來要實現網頁的各類功能時,我感受有點吃力,不理解如何運用、設計功能,在寫完代碼對項目進行調試時,老是出現一些錯誤。或許是由於本身不理解,又或者是由於本身的分析錯誤能力還欠缺,致使整個項目沒法正常進行。不過,通過查找資料、查閱書籍和請教同窗,最終仍是把問題解決了,使項目可以正常運行。咱們如今所學的python知識還只是冰山一角,還有不少深奧的知識還有待去深刻學習,真正掌握python語言。不積跬步,無以致千里;不積小流,無以成江海,這個學期所學的python知識只是打下一個基礎,在從此的學習中須要不斷加深理解python知識,從基礎學起,作到可以順手利用python作爬蟲、作網頁開發。同時,也須要溫故而知新,對所學的知識進行復習,真正掌握、理解每個知識的應用。前端
Python+Flask+MySQL的web建設技術過程:java
1.須要安裝python3.六、Pycharm、MySQL等相關軟件和安裝相關的庫。python
2.須要有python、CSS、javastring、mysql、html等基礎知識。mysql
3.如下爲本學期設計的一個簡單web項目jquery
建立html、js、CSS、python文件的時候最好存放規範合理,命名合理web
父模板的製做 base.csssql
nav ul{ width: 1000px; border: 1px solid pink; margin: 50px auto 0px auto; } .nav ul li{ float: left; } .nav ul li a{ width: 80px; height: 28px; line-height: 28px; background-color: pink; color: aliceblue; margin: 5px 35px; font-size: 12px; display: block; text-align: center; text-decoration: none; } .nav ul li a:hover{ width: 78px; height: 26px; line-height: 28px; border: 1px solid pink; background: #FFF; } .nav img{ height: 28px; width:28px; float: left } .all{ width: 88%; height:70%; overflow: auto; margin: auto; position: absolute; top: 0; left: 0; bottom: 0; right: 0; } .pic{ border: 1px solid orange; width: 300px; float: left; margin: 15px; } .pic img{ width: 100%; height: 180px; } .wenzi1{ text-align: center; padding: 5px; font-family: ''; background-color: bisque; } .wenzi1:hover{ border: 1px solid orangered; background-color: salmon; } .wenzi2{ text-align: center; padding: 5px; font-family: ''; background-color: darkseagreen } .wenzi2:hover{ border: 1px solid orangered; background: darkgreen; } .wenzi3{ text-align: center; padding: 5px; font-family: ''; background-color: khaki; } .wenzi3:hover{ border: 1px solid orangered; background: orange; } .wenzi4{ text-align: center; padding: 5px; font-family: ''; background-color:salmon; } .wenzi4:hover{ border: 1px solid orangered; background: red; } .pic img:hover{ border: 1px solid orangered; } .all a{ text-decoration: none; font-family: '華文中宋'; }
base.html
!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title> {% block title %} {% endblock %} Home</title> <link rel="stylesheet" href="{{ url_for('static',filename='css/common.css')}}"> {% block head %} {% endblock %} </head> <body id="myBody"> <div class="banner"> <div class="p-nav"> <div class="container"> <ul class="nav_left"> <li><a href="{{ url_for('home') }}">首頁</a></li> <li><a href="#">下載</a></li> <li><a href="#">新聞</a></li> <li><a href="{{ url_for('question') }}">發佈問答</a></li> </ul> <form action="{{ url_for('search') }}" method="get"> <div style=" height: 50px;padding-top: 13px;"> <button type="submit" class="search">搜索</button> <input type="text" style="padding-left: 10px;width: 200px" name="q" PLACEHOLDER="輸入要搜索的內容"> </div> </form> <ul class="nav_right"> {% if username %} <li><a href="#">{{username}}</a></li> <li><a href="{{ url_for('logout') }}">退出</a></li> {% else %} <li><a href="{{ url_for('sign_in') }}">登陸</a></li> <li><a href="{{ url_for('sign_up') }}">註冊</a></li> {% endif %} </ul> </div> </div> {% block main %} {% endblock %} <div id="bottom"> <a href="">聯繫咱們·</a> <a href="">加入咱們·</a> <a href="">品牌與徽標·</a> <a href="">幫助中心·</a> <a href="">合做夥伴</a> </div> <div class="copyright"> <p>Copyright © 2017. Created by <a href="#" target="_blank">niu</a></p> </div> </body> </html>
首頁的製做
index.css
.ties-list{ position: relative; margin: 50px auto; width: 90%; } .tie-item{ border: 1px solid #ddd; background: #fff; padding: 10px 20px; margin-bottom: -1px; } .tie-item:hover { border: 1px solid #169fe6; position: relative; z-index: 10; } .tie-title { font-size: 16px; line-height: 1.5em; float: left; clear: right; } .tie-title a{ text-decoration: none; font-size: 16px; line-height: 1.5em; } .tie-content { font-size: 14px; color: #333; line-height: 200%; word-wrap: break-word; word-break: break-all; overflow: hidden; padding: 15px 0; clear: both; } .tie-desc-link { color: #9ab26b; padding-left: 5px; } .tie-desc { clear: both; color: #bcbcbc; float: none; text-align: left; line-height: 200%; font-size: 12px; }
index.html
{% extends'base.html' %} {% block title %} Home {% endblock %} {% block head %} <link rel="stylesheet" href="{{ url_for('static',filename='css/index.css')}}"> <style type="text/css"> div.all{ width: 80%; margin: auto; } div.pic{ width: 50%; float: left; } img{ width: 100%; height: 400px; } </style> {% endblock %} {% block main %} <div class="ties-list"> {% for tie in question %} <div class="tie-item"> <div class="tie-title"> <a href="{{ url_for('question_detail',question_id = tie.id) }}" target="_blank">{{tie.title }}</a></div> <div class="tie-content"> {{ tie.detail | safe }} <a class="tie-desc-link" href="{{ url_for('question_detail',question_id = tie.id) }}" >閱讀全文</a> </div> <div class="tie-desc">{{tie.author.username}}發佈於({{tie.creatTime }}) <span><a href="#">評論({{ tie.comments|length }})</a></span> </div> </div> {% endfor %} </div> <div class="all"> <div class="pic"> <a href="#"><img src="http://pic1.win4000.com/wallpaper/f/51b9b06f1d0fb.jpg"></a> <div class="wenzi1"><a href="">淡雅清新</a></div> </div> <div class="pic"> <a href="#"> <img src="http://www.zcool.com.cn/community/0379bb5579eead00000012e7e1c65aa.jpg"></a> <div class="wenzi2"><a href="">蓓蕾初開</a></div> </div> <div class="pic"> <a href="#"> <img src="http://imgstore.cdn.sogou.com/app/a/100540002/766171.jpg"></a> <div class="wenzi3"><a href="">倉央兮措</a></div> </div> <div class="pic"> <a href="#"> <img src="http://pic.5442.com:82/2013/0417/16/02.jpg%21720.jpg"></a> <div class="wenzi4"><a href="">驕陽似火</a></div> </div> </div> {% endblock %}
註冊頁面設計 regiser.html
{% extends'base.html' %} {% block title %} Login {% endblock %} {% block head %} <title>註冊頁面</title> <script type="text/javascript" src="http://libs.baidu.com/jquery/2.1.1/jquery.min.js"></script> <link rel="stylesheet" type="text/css" href="{{ url_for('static',filename='css/register.css')}}"> <script type="text/javascript"> $(function () { $("button.submit").click(function () { var userName = $("input[name='user']").val(); var passWord = $("input[name='pwd']").val(); var RepassWord = $("input[name='repwd']").val(); if(userName.length == 0 || userName== " ") { $("#register_notice").html("用戶名不容許爲空"); $("#register_notice").show(); $("input[name='user']").val(""); } else if(passWord != RepassWord) { $("#register_notice").html("兩次輸入密碼不一致"); $("#register_notice").show(); $("input[name='pwd']").val(""); $("input[name='repwd']").val(""); } else { var data = {"username":userName, "password":passWord}; $.post("{{ url_for('sign_up') }}",data,function(result) { var err = result["err"]; if (err ==0) { alert("註冊成功"); } else { $("#register_notice").text(result["text"]); $("#register_notice").show(); $("input[name='user']").val(""); $("input[name='pwd']").val(""); $("input[name='repwd']").val(""); } }); } }); }); </script> {% endblock %} {% block main %} <body> <div class="logo"> </div> <div class="register"> <p> <label>用戶名<br> <input type="text" name="user" class="input" size="20"> </label> </p> <p> <label>密碼<br> <input type="password" name="pwd" value="" size="20"> </label> </p> <p> <label>確認密碼<br> <input type="password" name="repwd" value="" size="20"> </label> </p> <p> <a href="{{ url_for('index') }}">← 返回到博客</a> <button class="submit">註冊</button> </p> <span id="register_notice">用戶名或者密碼錯誤</span> </div> </body> {% endblock %}
css
body{ background:#e7e7e7 ; } .logo{ width: 330px; height: 58px; margin: 100px auto 0; background-image: url("../image/logo_daizuo.png"); } .register{ width: 260px; margin: 0 auto; height: 340px; box-shadow: 10px 10px 5px #888888; background: white; padding: 10px 60px; } label{ color: #72777c; font-size: 14px; } input{ width: 100%; height: 34px; } p>a{ float: left; font-size: 14px; height: 36px; line-height: 36px; color: #72777c; text-decoration: none; } button{ float: right; width: 80px; height: 36px; background: #108099; color: #fff; } #register_notice{ float: left; margin-left: 50px; color: red; font-size: 14px; display: none }
登陸功能設計
{% extends'base.html' %} {% block title %} Login {% endblock %} {% block head %} <script type="text/javascript" src="http://libs.baidu.com/jquery/2.1.1/jquery.min.js"></script> <link rel="stylesheet" type="text/css" href="{{ url_for('static',filename='css/login.css')}}"> <script type="text/javascript"> $(function () { $("button.submit").click(function () { var userName = $("input[name='user']").val(); var passWord = $("input[name='pwd']").val(); var data = {"username":userName,"password":passWord}; $.post("{{ url_for('sign_in') }}",data,function(result) { var err = result["err"]; if (err ==0) { window.location.href = "/"; } else { $("#login_notice").html(result["text"]); $("#login_notice").show(); $("input[name='user']").val(""); $("input[name='pwd']").val(""); } }); }); }); </script> {% endblock %} {% block main %} <body> <div class="logo"> </div> <div class="login"> <p> <label for="user_login">用戶名<br> <input type="text" name="user" class="input" size="20"> </label> </p> <p> <label for="user_pass">密碼<br> <input type="password" name="pwd" value="" size="20"> </label> </p> <p> <a href="{{ url_for('index') }} ">← 返回到博客</a> <button class="submit">登陸</button> </p> <span id="login_notice" style="">用戶名或者密碼錯誤</span> </div> </body> {% endblock %}
發佈問答功能
{% extends'base.html' %} {% block title %} Question {% endblock %} {% block head %} <link rel="stylesheet" href="{{ url_for('static',filename='css/question.css')}}"> <style> div.question{ width: 80%; margin: auto; } textarea.form-control{ width: 80%; margin: auto; } </style> {% endblock %} {% block main %} <div class="question"> {% if username %} <p class="name">歡迎你,{{ username }}</p> <h1>發佈問答</h1> <form class="biao" action="{{ url_for('question') }}" method="post"> <div class="form-group"> <label for="ask">Question</label><br> <textarea name='title' class="form-control" rows="1" id="ask"></textarea> </div> <br> <div class="form-group"> <label for="questionDetail">Detail</label><br> <textarea name='detail' class="form-control" rows="8" id="questionDetail"></textarea> </div> <button type="submit" class="btn-default">發佈</button> </form> {% else %} <p class="name">歡迎你,請先<a href="{{ url_for('sign_in') }}" >登陸</a>或者<a href="{{ url_for('sign_up') }}">註冊</a></p> {% endif %} </div> {% endblock %}
評論功能設計
{% extends'base.html' %} {% block title %} Question {% endblock %} {% block head %} <link rel="stylesheet" href="{{ url_for('static',filename='css/question_detail.css')}}"> <style> </style> {% endblock %} {% block main %} <section> <div class="container"> <div class="artical_content"> <div class="content_head"> <h3 class="article_title">{{question.title}}</h3> <p class="time">發佈時間:{{question.create_time}} </p> </div> <article> {{question.detail|safe}} </article> {% if username %} <form action="{{ url_for('comment') }}" method="post"> <textarea name='detail' class="form-control" rows="3" id="questionDetail"></textarea><br> <button class="btn-default">發佈</button> <input name="question_id" value="{{ question.id }}" type="hidden" /> </form> {% else %} <p class="name">歡迎你,請先<a href="{{ url_for('sign_in') }}" >登陸</a>或者<a href="{{ url_for('sign_up') }}">註冊</a></p> {% endif %} <p>評論:({{ question.comments|length }})</p> <ul > {% for foo in question.comments %} <li><p>{{ foo.author.username }} ({{ foo.creatTime }})</p><p class="neirong">{{ foo.detail }}</p></li> {% endfor %} </ul> </div> </div> </section> {% endblock %}
數據庫功能設計
import os SECRET_KEY = os.urandom(24) SQLALCHEMY_DATABASE_URI = 'mysql+pymysql://root:123456@localhost:3306/mis_db?charset=utf8' SQLALCHEMY_TRACK_MODIFICATIONS = False
主py文件
from flask import Flask,render_template,request,redirect, url_for,session,Response from sqlalchemy import or_, and_ from flask_sqlalchemy import SQLAlchemy import json import datetime import config app = Flask(__name__) app.config.from_object(config) db=SQLAlchemy(app) class User(db.Model): __tablename__ = 'User' id = db.Column(db.Integer,primary_key=True,autoincrement=True) username = db.Column(db.String(20),nullable=False) password = db.Column(db.String(20),nullable=False) nickname = db.Column(db.String(20)) db.create_all() class Question(db.Model): __tablename__ = 'question' id=db.Column(db.Integer,primary_key=True,autoincrement=True) title=db.Column(db.String(100),nullable=False) detail=db.Column(db.Text,nullable=False) creatTime=db.Column(db.DateTime, default=datetime.datetime.now) authorID=db.Column(db.Integer,db.ForeignKey('User.id')) author=db.relationship('User',backref=db.backref('question')) db.create_all() class Comment(db.Model): _tablename_='comment' id=db.Column(db.Integer,primary_key=True,autoincrement=True) author_id=db.Column(db.Integer,db.ForeignKey('User.id')) question_id=db.Column(db.Integer,db.ForeignKey('question.id')) detail=db.Column(db.Text,nullable=False) creatTime=db.Column(db.DateTime,default=datetime.datetime.now) question=db.relationship('Question',backref=db.backref('comments',order_by=creatTime.desc)) author=db.relationship('User',backref=db.backref('comments')) db.create_all() @app.route('/') def index(): context={ 'question': Question.query.all() } return render_template('index.html', **context) @app.route('/question_detail/<question_id>') def question_detail(question_id): question = Question.query.filter(Question.id == question_id).first() return render_template('question_detail.html', question=question) @app.route('/home') def home(): context={ 'question': Question.query.all() } return render_template('index.html', **context) @app.route('/sign_in',methods=['GET','POST']) def sign_in(): if request.method == 'GET': return render_template('login.html') else: username = request.form.get('username') password = request.form.get('password') user = User.query.filter(User.username == username).first() if user: if user.password == password: session['user']=username session.permanent = True return Response(json.dumps({"err": 0,"text":"login success"}), mimetype='application/json') else: return Response(json.dumps({"err": -1,"text":" user or password error"}), mimetype='application/json') else: return Response(json.dumps({"err": -1,"text":" username is not existed"}), mimetype='application/json') @app.route('/sign_up',methods=['GET','POST']) def sign_up(): if request.method == 'GET': return render_template('register.html') else: username = request.values.get('username') password = request.values.get('password') user = User.query.filter(User.username == username).first() if user: return Response(json.dumps({"err": 0,"text":"username existed."}), mimetype='application/json') else: user1 = User(username=username, password=password) db.session.add(user1) db.session.commit() return Response(json.dumps({"err": 0}), mimetype='application/json') @app.route('/logout') def logout(): session.clear() return redirect(url_for('home')) @app.context_processor def mycontext(): username=session.get('user') if username: return {'username': username} else: return {} @app.route('/question/',methods=['GET','POST']) def question(): if request.method == 'GET': return render_template('question.html') else: title = request.form.get('title') detail = request.form.get('detail') authorID =User.query.filter(User.username == session.get('user')).first().id user = User.query.filter(User.username == session.get('user')).first() question = Question.query.filter(Question.title == title).first() if question: return 'question existed' else: questions = Question(title=title, detail=detail, authorID=authorID) questions.author = user db.session.add(questions) db.session.commit() return redirect(url_for(('home'))) @app.route('/comment/',methods=['GET','POST']) def comment(): if request.method == 'GET': return render_template('question_detail.html') else: detail = request.form.get('detail') author_id =User.query.filter(User.username == session.get('user')).first().id question_id=Question.query.filter(Question.authorID ==author_id).first().id comments = Comment(detail=detail,author_id=author_id,question_id=question_id) #comments.question=question #comments.author = user db.session.add(comments) db.session.commit() return redirect(url_for('question_detail', question_id=question_id)) @app.route('/search/') def search(): qu=request.args.get('q') ques=Question.query.filter( or_( Question.title.contains(qu), Question.detail.contains(qu) ) ).order_by('-creatTime') return render_template('index.html',question=ques) if __name__ == '__main__': app.run(debug=True) if __name__ == '__main__': app.run()
以上爲用python在這個學期中web建設的一些代碼,整個設計出來的網頁仍是很不完整的,部分功能沒法實現,在以後的學習中,應該繼續完善、改進這個網頁。掌握更多的html、python、css、sql知識,熟練這些技術,設計一個更加完整的網頁。