2022年我新学习的技术

简介: 作为一名后端菜鸟,之前工作中因为有前端人员,开发过程中并未接触过前端的技术,一直在做后端的开发,21年底跳槽更换了一份新的工作,因为工作原因,前后端都需要做,开始接触前端相关框架,因为新项目周期性较长,独立设计和开发,自身也是希望能够学习下vue开发,所以新项目的前端技术选型采用了比较受欢迎的前端 UI 框架:VUE+ElementUI。

背景

作为一名后端菜鸟,之前工作中因为有前端人员,开发过程中并未接触过前端的技术,一直在做后端的开发,21年底跳槽更换了一份新的工作,因为工作原因,前后端都需要做,开始接触前端相关框架,因为新项目周期性较长,独立设计和开发,自身也是希望能够学习下vue开发,所以新项目的前端技术选型采用了比较受欢迎的前端 UI 框架:VUE+ElementUI。

ElementUI介绍 以及它的优点

简介

Element UI是一套为开发者、设计师和产品经理准备的基于Vue 2.0的桌面端元组件库,由饿了么前端团队推出。它并不依赖于Vue,却是一个十分适合Vue项目的框架。可使用Element UI轻松制作出网页,为前端开发人员大大减轻了代码负担。

优点

1.快速搭建,vue官网提供的脚手架,使用 vue-admin-template ,在此基础上开发,而且github上配有详细的模板说明,这样可以节省开发时间

2.工程结构明了,便于编写及理解

3.element所有的组件都存在于其官网上,找到所需要的组件,复制其代码,拷贝到项目的位置上即可使用 ,页面简洁,方便上手。

4.节约成本,开发的项目大部分是管理系统,大多数使用到的组件都能在这官方文档中找到,节省很多写样式的时间

搭建环境

创建项目

前往node官网下载最新版本的node,根据自己的操作系统选择相应的包,按照步骤一步步走就可以,这里不做过多介绍。

安装好后可以打开命令行用 npm-v node-v 查看是否安装成功以及版本号

如果以前已经安装过node 和 npm 最好升级到最新版本,命令行 npm install npm@x.xx.x

首先全局安装vue-cli,打开CMD命令行,npm install -g vue-cli

接下来新建项目,运行 vue init webpack demo 这里的demo是你项目的名字,接下来会有一些初始化的设置,其中vue-router是路由,反正我都会选择安装,其他的可以回车跳过或者选择no

网络异常,图片无法展示
|

---按照提示,cd到新建的项目下,运行npm install

---运行npm run dev

安装Element

cd到当前项目 运行 npm i element-ui -S

网络异常,图片无法展示
|

接下来就是在项目里面引用了,打开src目录下的main.js

网络异常,图片无法展示
|

下面我们就可以愉快的使用element里面优雅的组件了,这个是element的网址element.eleme.io/#/zh-CN/com…

结束

其实任何一门语言都有他的独到之处,根据自身情况,选择一种适合自己的编程语言,虽然在学习写前端代码,但我主要的还是java,希望2022能把VUE+ElementUi框架使用熟练

祝大家2022升职加薪,前程似锦,早日实现财富自由


相关文章
|
7天前
|
机器学习/深度学习 人工智能 自然语言处理
探索数据科学:从理论到实践的技术感悟
【5月更文挑战第31天】本文通过作者在数据科学领域的学习与实践经历,探讨了理论与实际应用之间的桥梁。文章首先回顾了数据科学的基础知识和核心概念,然后通过案例分析展示了如何将抽象的理论知识转化为解决实际问题的工具。最后,作者分享了个人对数据科学未来发展的看法和建议,旨在为同行提供参考和启发。
|
23天前
|
机器学习/深度学习 算法 搜索推荐
【高效率学习】探索最适合你的学习之路:从心理学、动机到教育学的深度解析
【高效率学习】探索最适合你的学习之路:从心理学、动机到教育学的深度解析
102 0
【高效率学习】探索最适合你的学习之路:从心理学、动机到教育学的深度解析
|
23天前
|
机器学习/深度学习 Python
有没有一些开源的深度学习项目可以帮助我实践所学的知识?
【2月更文挑战第14天】【2月更文挑战第40篇】有没有一些开源的深度学习项目可以帮助我实践所学的知识?
|
23天前
|
人工智能 前端开发 JavaScript
【利用AI让知识体系化】前端开发学习&了解业务架构(一)
【利用AI让知识体系化】前端开发学习&了解业务架构
|
23天前
|
人工智能 前端开发 JavaScript
【利用AI让知识体系化】前端开发学习&了解业务架构(二)
【利用AI让知识体系化】前端开发学习&了解业务架构
|
23天前
|
存储 前端开发 安全
【利用AI让知识体系化】前端安全攻防知识点(一)
【利用AI让知识体系化】前端安全攻防知识点
|
23天前
|
安全 前端开发 JavaScript
【利用AI让知识体系化】前端安全攻防知识点(二)
【利用AI让知识体系化】前端安全攻防知识点
|
11月前
|
机器学习/深度学习 数据采集 人工智能
|
机器学习/深度学习 人工智能 自然语言处理
跟着阿里训练营视频课程学习人工智能技术遇到的模型网络概念问题
参加人像卡通画训练营视频课程记录的一些概念介绍内容
119 0
|
编译器 C语言 C++
高效学习C++基础部分&话题挑战赛
高效学习C++基础部分&话题挑战赛
124 0
高效学习C++基础部分&话题挑战赛

热门文章

最新文章