本系列教程是用Vue.js + Nuxt.js + Element + Vuex + 开源js绘图库,打造一个属于自己的在线绘图软件,最终效果:topology.le5le.com .如果你觉得好,欢迎给文章和开源库点赞,让我们更有动力去做好! 本系列教程源码地址:Github 一.创建项目框架 1. 使用Nuxt.js向导创建项目 yarn create nuxt-app topology-vue // 注意在后面提示中,上移下移,按空格选中 Element 复制代码 选择Element后,在…

大概是在18年的时候,当时还没有疫情.当时工作中同时负责多个项目,有 PC 端运营管理后台的,有移动端 M 站的,有微信小程序的,每天 git 分支切到头昏眼花,每个需求提测需要发送邮件,而且周五要写烦人的周报,我就萌生了做一个任务管理系统的想法.其实不管是日常需求还是处理线上 bug,都可以看作一个个大大小小的任务.这些任务有排期,prd,项目分支,开发测试人员等关键因素,在开发过程中这些都会得到明确,从而根据这些信息推导出提测邮件内容,进而通过排期时间区间汇总出周报. 说干就干,花了两个周末…

本系列教程是教大家如何根据开源js绘图库,打造一个属于自己的在线绘图软件.当然,也可以看着是这个绘图库的开发教程.如果你觉得好,欢迎点个赞,让我们更有动力去做好! 本系列教程重点介绍如何开发自己的绘图软件,因此,react基础和框架不在此介绍.可以推荐react官网学习,或<React全家桶免费视频>. 本系列教程源码地址:Github 前面教程一,搭建了一个基础框架,现在我们来实现顶部导航菜单栏功能. 一.react组件间通信 - 菜单事件 这里,我们通过redux方式来实现组件间消息通信.…

pl-drag-template Github地址:https://github.com/livelyPeng/pl-drag-template 前言 想必你一定使用过易企秀或百度H5等微场景生成工具制作过炫酷的h5页面,除了感叹其神奇之处有没有想过其实现方式呢?本文从零开始实现一个H5编辑器项目完整设计思路和主要实现步骤,并开源前后端代码.有需要的小伙伴可以按照该教程从零实现自己的H5编辑器.(实现起来并不复杂,该教程只是提供思路,并非最佳实践) 一个h5可视化编辑器种子, 高仿凡科建站模板.…

说到地图,大家一定很熟悉,平时应该都使用过百度地图.高德地图.腾讯地图等,如果涉及到地图相关的开发需求,也有很多选择,比如前面的几个地图都会提供一套js API,此外也有一些开源地图框架可以使用,比如OpenLayers.Leaflet等. 那么大家有没有想过这些地图是怎么渲染出来的呢,为什么根据一个经纬度就能显示对应的地图呢,不知道没关系,本文会带各位从零实现一个简单的地图引擎,来帮助大家了解GIS基础知识及Web地图的实现原理. 选个经纬度 首先我们去高德地图上选个经纬度,作为我们后期的地图…

要说到微信,我相信是个人都应该知道,几乎人人都会安装这款社交APP吧,它已经成为了我们生活中不可缺少的一份子. 我记得我上大学那会刚接触Java,做的第一个小项目就是基于J2SE的聊天室,使用Java编写websocket异常麻烦,而且又是同步阻塞的,性能非常差.随后几年经过工作的历练,接触了netty,使用netty可以搭建一款高性能的服务器,他封装了很多api,也提供NIO 和 AIO,当然可以用来编写websocket. 其实我一直想着自己能不能开发一款APP,用于聊天,用于社交呢?苦于不…

注:在搭建项目之前,请先安装一些全局的工具(如:node,vue-cli等) node安装:去node官网(https://nodejs.org/en/)下载并安装node即可,安装node以后就可以正常使用npm命令 全局安装vue-cli工具:npm install vue-cli -g 开始创建项目: 找一个合适的位置,打开命令窗口,使用vue初始化基于webpack的新项目 vue init webpack vue-demo //注意名称太长的话它会有错误提示,就像VueDemo 我们可…

此系列文章会进行不定期的更新,应该会有6章左右. 感兴趣的朋友可以跟着看看,本教程适合已经看过ABP的文档但是又无从下手的小伙伴们. 初衷: 发布系列教程的原因是发现ABP在园子火了很久,但是发现还是有很多小伙伴们无从下手,收集了一些信息,大部分都反馈是文档太难看不懂. 如果你还没有看过文档,那么请到阳铭大大的博客或者tkb-至简的博客去学习文档. 如果你已经对ABP玩的很不错了.那么可以去看看HKZHANG大神的ABP的源码分析. 以及没搞懂ABP有什么特点都在说好,但是哪里好缺不明白,以及不…

初始化Nuxt.js项目步骤 1.使用脚手架工具 create-nuxt-app 创建Nuxt项目 使用yarn或者npm $ yarn create nuxt-app <项目名> 注:根据自己的实际情况初始化项目 2.添加公共的css样式文件 如果要使用 sass 就必须要安装 node-sass和sass-loader $ yarn add node-sass sass-loader -D 在assets文件夹下创建公共的scss样式文件: /assets/styles/common.sc…

直接使用 Vue 构建前端单页面应用,页面源码时只有简单的几行 html,这并不利于网站的 SEO,这时候就需要服务端渲染 2016 年 10 月 25 日,zeit.co 背后的团队对外发布了一个 React 的服务端渲染应用框架 Next.js 几小时后,一个基于 Vue.js 的服务端渲染应用框架应运而生,与 Next.js 异曲同工,这就是 Nuxt.js 一.快速模板 在已经安装了 vue-cli 的前提下,可以快速创建一个 nuxt 的项目模板 vue init nuxt-commu…