网页框架怎么用个人总结 本学期第一次接触web前端开发技术,(3)

电脑杂谈  发布时间:2018-01-06 06:01:59  来源:网络整理

使用Flask中render_template,用不同的路径,返回到不同页;

用视图函数反转得到URL,完成导航里的链接;代码如下:

技术分享图片

这时我们运行run.py,然后,访问:5000/就返回到base页面。

4、导入相关的库与包

5、连接设置

技术分享图片

技术分享图片

四、学习期间

每次学习web框架和完成作业时,我都会上菜鸟编程这个网站了解一下关于js教程、css、html元素中的一些布局,经常上网借鉴Bootstrap,学会了解使用开源框架的感受,学习别人封装代码的思路,可以帮助你从另一个角度去思考,让你的代码更简洁,这是最重要的。

刚开始自己在设计网站时走了很多弯路,布局了一个页面,写了一些css元素进去后,打开网站后发现格局还是很丑,不是自己想要的效果,也不会如何去变通老师教给的知识。更多的是请教其他同学,也听了老师的一些意见,模范其他网站的布局与写法,创造属于自己的网站。老师每次讲课都会以简书或者知乎网站为例子,我也开始学会去抓去我要的一些代码,丰富自己的页面。个人小建议:

找到一个模板

边修改模板,边查阅资料,以此来完成一个应用

阅读官方文档或者代码来补漏

编写博客、文章、书籍来加强印象

练习,那可是相当烧时间的大事;时间,又是一种相宝贵的资源。遇到最大的问题就是代码泄漏或者代码理解不够导致前后代码不一致导致出现错误情况,而检查到出错和改正错误是一项令很头痛的事情。对于我这个粗心大意又急性子的人来说,每一次作业几乎都会出现这些细节上的错误。几周后,我学会跟着老师的教学思路去理解代码,虽然还是很多不懂,但最起码不会经常出错,也不会浪费时间不断检查代码。思路也慢慢清晰了,这对于以后进一步学习吸收了经验。

五、我的项目

设计概况

2、风格定位

色彩是以浅灰色为主,简洁清新,以便浏览者一眼就寻找到自己想要欣赏的东西。网站的色彩具有一致性,会使网站看起来美观,使浏览者不容易对内容混淆,增加浏览的简介和方便,不感觉到观看娱乐新闻的那种复杂性。

排版分为三个部分:头部导航条、底部图片导航、中间主显示区域布局。头部和底部分别设置导航栏,底部导航还融入图片等一些元素。中间布局融入了自己喜欢的明星的一些东西进去。

特效:网站的特效就是让网页看起来生动活泼的各种应用,如Flask、JavaScript等。设计中用一颗“灯泡”对白天和黑夜模式进行设置,还有对字体颜色和效果简单设置等。

3、网站栏目划分

父模版(base.html)

技术分享图片

技术分享图片

个人中心(usercenter.html)

技术分享图片

详情页(xiangqing.html)

技术分享图片

网页框架怎么用_html网页框架代码_框架结构

登录页(login.html)

技术分享图片

注册页(regist.html)

技术分享图片

问题(question.html)

技术分享图片

修改密码(edit_password.html)

技术分享图片

六、Web前端与后端设计主要代码

父模版

前端:

后台:

前端:

后端:

3、登录

前端:

后端:

4、注册

前端:

后端:

5、个人中心

前端:

后端:

6、详情页

前端:

后端:

7、问题页

前端:

后端:

9、上下文处理器

10、跳转页面前登录

11、修改密码

12、注销

13、分类

前端:

后端:

七、总计和体会

历经十几周的web前端开发的学习后,进步不算大,但也收获不少我的设计当中还是有许多不足,算是低级的,但如果在以后从事相关工作时,我可以借鉴其他人的想法融入自己的设计中,把自己的页面能比较完美的呈现出来。多学会优化自己的网站,多实践和操作,不要小看每次小小的优化,实力都是慢慢积累的。个人觉得“图灵”系列的书籍都是不错的,清晰、透彻,比较适合我们来学习,比如:javascript高级程序设计,精通html与css设计模式等。每个web前台开发工程师都应该具有很强的想象力,发挥想象力,并不断去验证自己的想法才会提高。


本文来自电脑杂谈,转载请注明本文网址:
https://www.pc-fly.com/a/ruanjian/article-58513-3.html

相关阅读
    发表评论  请自觉遵守互联网相关的政策法规,严禁发布、暴力、反动的言论

    热点图片
    拼命载入中...