网站后台为什么传不上图片,班级文化墙创意设计图片,公司创建网站销售,外贸的订单在哪个网站找个人简介 #x1f440;个人主页#xff1a; 前端杂货铺 #x1f64b;♂️学习方向#xff1a; 主攻前端方向#xff0c;也会涉及到服务端#xff08;Node.js#xff09; #x1f4c3;个人状态#xff1a; 在校大学生一枚#xff0c;已拿多个前端 offer#xff08;…个人简介 个人主页 前端杂货铺 ♂️学习方向 主攻前端方向也会涉及到服务端Node.js 个人状态 在校大学生一枚已拿多个前端 offer秋招 未来打算 为中国的工业软件事业效力n年 推荐学习前端面试宝典 Vue2 Vue3 Vue2Vue3项目实战 Node.jsThree.js 个人推广每篇文章最下方都有加入方式旨在交流学习资源分享快加入进来吧 文章目录一、前言二、毕设经历上1、初期2、明确功能3、技术选型4、数据库模型设计三、毕设经历中1、搭架子2、解决跨域3、功能实现四、毕设经历下五、写在最后一、前言
文末有投票欢迎大家积极参与~~
大家好这里是 前端杂货铺。回首一看已经 近五十天 天没有更文了深表歉意。因为前段时间一直在 忙工作和毕设上的事也没怎么学习新知识就一直拖着没有更新…
别的不多说接下来请君听我讲述一下我这十几天的毕设历程吧
二、毕设经历上
1、初期
我是从三月上中旬开始请假的虽然在这之前也利用下班时间做了几天但下班后的编码效果并 不尽人意。
因为后端Node.js的很多东西还不会数据库设计的也不太合理再加上每天晚上都会有一些报错的问题解决不了那段下班后做毕设的时光真的很糟糕…
在迷茫与急躁中度过了几天之后我便决定请一段时间的假“全职” 来做毕业设计
我的毕设从 UI 设计与复现、数据库设计、后端接口设计与实现、前后端交互 等都是自己 全权负责 的自我感觉任务量还是比较大的因为之前并没有这种全栈的开发经历。但好在结果还不错我用了 十几天的时间较完整地因为现在还有些东西需要优化完成了我的毕业设计
2、明确功能
在我们拿到毕设课题之后我们就要对我们要实现的功能有个大致的了解了。其实不管是什么功能都离不开增删改查只不过是实现的方式和困难程度不太一样。
我的毕业设计的功能包含
注册包括用户是否已存在格式校验登录用户名密码对比格式校验个人中心修改个人信息、修改密码分类展示按类型进行展示点赞点赞或取消点赞某一个作品评论评论某个作品评分给某个作品评分并且只能评一次并计算出综合评分关注关注和取消关注自己不能关注自己获取关注列表和粉丝列表并实现相应的跳转管理增删改查交易购买人减金币被买的加金币金币不够不能购买自己不能购买自己的生成相应的订单
难度上来说中规中矩。很多功能还是很常见的但有些问题在解决的过程中也是困难重重技术的广度和深度很是欠缺…
3、技术选型
其实本科的毕业设计中【xxx管理系统】或者【xxx平台】占的居多我的选题就是一个【xxx平台】类型的。
由于我对 Java 了解的不多所以在 服务端 的技术选型上我使用了 Node.js。
我毕设总体的技术选型【Vue Element ui Koa2 Sequelize MySQL】如果你对后端技术不是很了解但前端知识掌握的不错的话我觉得使用 Koa2 或者 Express 将会是个不错的选择好学易上手
4、数据库模型设计
在数据库模型设计上还是要根据自己的业务做出相应的设计。其实数据库模型的设计是 很重要 的一步如果前期对数据库模型设计的不好可能后期做工作的时候需要重新进行数据库模型的设计那时候就会带来一些不必要的麻烦了…
说实话我对数据库模型的设计也没有太多见解大家多去看一些优秀毕设的数据库模型设计做一下参考吧
但总的来说我们要提前把需要的字段都设计好还要设计好 主键、外键、以及各个字段的类型 等。
如果后端使用的是 Node.js那么推荐你 使用 sequelize 去操作 MySQL真的很好用
三、毕设经历中
1、搭架子
在明确完需求和和设计好数据库表结构之后我们就要着手把我们项目的架子搭起来了。
如果你也是采用 前后端分离 的方式那么就可以 创建两个工程一个前端一个后端我刚开始还犹豫在一个文件夹下怎么建目录更合理的问题后来发现前后端分开创建是个更好的方式。
前端 Vuevue create xxx前提是有node环境并且安装了相应版本的脚手架选择你要使用的 vue 版本Vue2 | Vue3之后可以按需进行一些配置这个其实没啥难度按需选择就可以了。
后端 Koa2可以参考一下这篇文章 —— Koa2环境搭建
2、解决跨域
毕竟这是前后端分离的项目我们首先要解决的问题就是 跨域要不然前后端根本交互不起来。
我们常用的解决跨域的方式有两种 Nginx 和 CORS
我是使用的 CORS 跨域因为这样可以少启动一个服务还是挺香的。
CORS 解决跨域
首先要安装 koa2-cors
npm install --save koa2-cors/*** description CORS解决跨域* author zahuopu*/
const CORS_CONFIG {origin: http://localhost:8080, // 前端地址credentials: true, // 是否携带 cookieallowMethods: [GET, POST, DELETE, PATCH], // 设置所允许的HTTP请求方法exposeHeaders: [Authorization], // 让浏览器能访问到其他的响应头allowHeaders: [Content-Type, Authorization, Accept] // 设置服务器支持的所有头信息字段
}module.exports {CORS_CONFIG
}之后在 app.js 文件中引入并使用即可
const Koa require(koa)
const cors require(koa2-cors)
const { CORS_CONFIG } require(./conf/cors)app.use(cors(CORS_CONFIG)
)这样跨域的问题就解决了我们再写接口返回的数据就可以在前端进行相应的展示了。
3、功能实现
总体的架子搭好之后我们就可以着手去实现 设计并复现前端UI实现接口前后端交互等 工作了。
当然在这个过程中肯定不会是一帆风顺的各种各样的报错你都可能会遇到但不要着急看一下报错的原因自己搞不懂的错误就去网上查资料相信自己问题肯定会解决的。
我在功能实现上就遇到了各种各样的问题有时候也是没有头绪但经过了一番思考查询资料及调试后也都顺利的解决了。
千万不要把毕设想的多么难其实本科的毕业设计难度真的没那么高基础差不多足矣完成它千万不要畏惧。只要思想不滑坡方法总比困难多
四、毕设经历下
在把基本的功能都实现之后呢我们的项目中还存在一些的小 bug包括一些需要优化的点。
我们要知道一个完整的项目必定是功能健全能抗能打的。我们把基本的功能要求实现后并不代表我们已经完成了毕业设计。就像玉石一样需要我们反复打磨抛光
在这一点上我还没有做好接下来会利用下班后的时间进行一系列的优化
五、写在最后
毕业设计是我们大学四年 最后一个 也是 最有意义 的一个作业了算是给我们的这四年一个交代吧希望大家都能顺利的完成它并顺利的毕业
各位加油有什么问题和想法欢迎一起交流讨论