vue2 开发一个实习管理系统电脑端-前端静态网站练习
为了快速的掌握vue2的所学习到的知识点,最近又使用vue2和element-ui 做了一个实习管理系统来巩固自己的前端技术,我觉得对于新手来说,多写代码,多找一些项目练习,是提供自己编程能力的一个很好的办法,这也是这么多年来我学习编程总结的一个心得体会,每当我开始学习一个新的技术时,除了刚开始看一下 这个语言的基础语法,然后就开始找大量的项目进行练习,要么就看一些大佬的代码,然后仿照大佬的代码进行模仿,学习大佬的开发思路,然后再找一些完整的项目,自己尝试着开发。所以最近我就又写了一个 只有前端的 实习管理系统。
注意:只有前端噢,因为是只练习前端技术,所以只做了前端~
先给大家简单的看一下开发的页面
首页:
这个项目 我主要实现了 如下菜单功能:
首页:一些报表的统计。
实习管理:岗位管理、申请审核、实习分配、协议管理
学生管理:学生档案、进度跟踪、考核评价
企业管理: 企业档案、岗位审核、黑名单管理
系统工具:通知中心、文档模板、考勤统计
系统设置:账号管理、角色权限、操作日志
使用的技术:
Vue2、UI 组件库选用 Element-UI、Node版本 16.20
最后给大家简单的看一下项目路径结构:
代码量还是很多的,所以如果能坚持 根据自己所学的编程知识,然后自己尝试着写几个完整的项目,我相信自己的技术会有一个非常快的提升。
这个项目开发完成后,也搭建了一个预览地址,有兴趣的小伙伴可以去看看,希望对你有所帮助:
https://wwwoop.com/home/Index/projectInfo?goodsId=77&typeParam=2&subKey=1
最后再给大家简单的说一下 项目运行的操作说明,以防有些刚学习的小伙伴对 node的命令不熟悉!
操作说明:
-
node环境 :16.20
-
安装依赖: npm i
-
运行项目:npm run serve
-
打包项目:npm run build