- 博客(271)
- 资源 (3)
- 收藏
- 关注
RSS订阅原创 CSRF与XSS攻防知识点总结
这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Ma...
2019-12-16 15:11:35
572
原创 Three.js新手入门实践案例解析
导读该篇文章呢，主要用于记录一个简单的入门级Three.js小案例，主要涉及到场景、摄像机的种类及摄像机创建，几何体创建，几何体运动，材质贴图添加，窗口渲染 内容自适应这几个方面来开发下面这个小案例，当然也包括相关实现方法的参数的详解。帮助自己知识复习，如果能帮助大家入门Three.js这门浏览器端的WebGL神奇强大炫酷框架中去，那就更好了。首选我们来看一下，Three.js的基本概念和简介...
2019-11-20 10:25:43
1171
原创 深入理解NodeJS事件循环机制
导读ALL THE TIME，我们写的的大部分javascript代码都是在浏览器环境下编译运行的，因此可能我们对浏览器的事件循环机制了解比Node.JS的事件循环更深入一些，但是最近写开始深入NodeJS学习的时候，发现NodeJS的事件循环机制和浏览器端有很大的区别，特此记录来深入的学习了下，以帮助自己及小伙伴们忘记后查阅及理解。...
2019-11-18 15:19:20
1157
原创 Node.js库puppeteer接口及常用API总结
导读这篇文章，主要用于收集整理常用的Puppeteer的一些常用API操作，自动化操作，爬虫测试，基础使用等等。当然至于是什么是Puppeteer呢，我们来看下官方介绍：Puppeteer是谷歌官方出品的一个通过DevTools协议控制headless Chrome的Node库。可以通过Puppeteer的提供的api直接控制Chrome模拟大部分用户操作来进行UI Test或者作为爬虫访问页面...
2019-11-15 14:55:13
3107
原创 初学者学习前端开发的实用指南
我在不到5年前的2014年春季开始了编码之旅。从那时起，我已经获得了一些编程技能，但我仍然知道，还有很多事情需要学习。无论如何，我决定将这些技巧集中在一个地方，以帮助将来的开发人员前进。本文是我开始旅程时希望找到的指南。在开始之前如果您决定自己学习，那么互联网上就会有很多信息，您很难将所有事情都束之高阁。重要的是要有一个结构化的计划，避免浪费时间从一种资源转移到另一种资源。请注意，这些只是进...
2019-10-24 11:10:10
558
原创 使用Proxy和defineProperty分别构建一款MVVM框架
导读这些天呢，作为前端界比较火的一件事情就是，vue 3.0的诞生，vue 3.0除了在用法上有些许变化外，最主要的变化，莫过于数据劫持的方式的改变；vue 3.0使用的是es6的Proxy进行数据拦截的，而2.x的版本呢，则是采用的Object.defineProperty()这样的方式进行对数据的监听，所以呢，今天我们做个实验，什么样的实验呢？我们分别来使用这个Proxy和definePro...
2019-10-23 15:27:37
418
原创 JS常见算法题精解
01. 模拟实现 new首先，这里呢，先简单说明一下new关键字的基本作用，有以下三点：创建一个新的对象把Person方法的原型挂载到了obj的原型链上返回一个新的对象所以呢，我们可以根据它的这三个特性，来自定义个一个方法objectFactory，如下所示：function person(name, age) { this.name = name this.age = a...
2019-10-15 09:14:53
480
原创 python 往win10剪贴板塞入文字和图片（本地图片、远程图片）记录
导读临时有个需求，需要操作下win10电脑下的剪贴板，我们需要往这个剪贴板中塞入我们的文字信息和图片资源，当然图片资源包括本地资源和远程资源，查阅了一些文档，发现都比较凌乱，这里呢，简单总结下。1. 需要的几个包# 需要载入的模块包import win32confrom PIL import Imageimport win32clipboard as wfrom io import ...
2019-10-14 14:43:14
1718
1
原创 Selenium-webdriver Node API 调用总结
准备工作node.js 的安装和配置selenium-webdriver 安装驱动：chromedriver（建议）、IEdriver、geckodriver一、基本使用const {Builder, By, Key, until， Button} = require("selenium-webdriver");let broswer = new Builder().forBrow...
2019-10-11 22:56:59
1379
原创 vuex中module里面的数据操作总结
Vuex 使用了 module 后的访问方法：01 - 如果 使用了 module 和 namespacestate 数据:=> this.$store.state.User.info (user 是模块名字. info 是 state 里面的属性名字)getters 数据: => this.$store.getters[‘User/getUserInfo’] (u...
2019-10-05 11:53:41
4028
2
原创 parcel 构建打包 scss、less、stylus css预处理器
scss、less、stylus css预处理器构建在我们开发的过程中，使用CSS预处理器可以极大的提升我们的开发效率，所以使用打包工具开发构建我们的预处理器是非常重要的一环，所以这章节内容，将给大家介绍如何使用parcel打包构建我们的项目中的几款css预处理scss预处理器构建SCSS 编译需要sass(dart-sass的 JS 版本)模块。通过 npm 安装：cnpm ins...
2019-09-30 11:39:00
1477
原创 parcel js/css/图片/文件等资源打包构建总结
Parcel js/css/图片/文件等资源打包构建总结本章节呢，大喵将带着大家，使用parcel分别对JS还有其他资源进行打包测试，让大家了解parcel是如何方便快捷开箱即用打包构建的 ~1. Javascript parcel 打包javascript打包是前端开发中最常用的打包，本章节内容呢，将使用parcel来打包 CommonJS 和 ES6 、import() 的JS模块我...
2019-09-29 17:06:16
3447
原创 linux 文件及文件夹相关命令
文件 文件夹 相关操作命令查看文件cd 切换目录位置ls 目录 查看指定目录所有文件 --缺省当前目录ls -l 目录 查看指定目录所有文件的详细信息 --同 ll 命令ls -a 目录 查看指定目录所有文件(包含隐藏文件)ls -la 目录 查看指定目录所有文件的详细信...
2019-09-29 16:36:51
854
原创 webpack等打包构建工具优秀网站资料搜集整理
01. 自动生成webpack和parcel配置的网站访问地址：https://createapp.dev/简介：可以通过表单交互，自动生成需要的webpack配置主页预览：未完待续……
2019-09-29 16:20:55
827
原创 Parcel JS 前端打包构建之完美初体验
初体验Parcel之快速开始我们这章节呢，来体验下这个号称最简单的打包工具parcel工具，它的打包构建使用情况1. 搭建本地环境cnpm inint -ycnpm install parcel-bundler --save-dev2. 创建index.html及index.js文件touch index.html index.js3. 启动本地服务，上浏览器查看打印信息是否...
2019-09-26 14:42:38
2218
原创 开发构建脚手架命令行工具总结
构建脚手架命令行工具我们这一章节呢，来总结下构建脚手架的基本过程，总的来说呢，过程也是相当愉快轻松的，愉快，心情完美 ~安装依赖首先我们需要安装构建脚手架所需要的依赖，如下：cnpm install -D commander inquirer chalk ora download-git-repo核心工具：commander、inquirer、download-git-repo每个工...
2019-09-24 15:17:32
1093
原创 Electron PC客户端开发初体验
Electron 开发初体验本章节呢，通过一个入门级别的项目来简单的体验Electron开发的过程，并简单记录一下Electron项目的开发流程总的来说呢，涉及以下知识点：搭建本地Electron开发环境创建一个新的窗口创建顶部菜单、二级菜单及菜单点击交互打开一个新的窗口窗口之间的数据传递，ipcMain和ipcRenderer事件监听和触发客户端打包搭建本地Electron...
2019-09-20 18:48:58
3209
原创 React 360 全景VR交互项目实战
react 360 项目实战这章节呢，我们从一个项目案例实战，来进一步学习react 360框架的使用。项目的内容呢，我们需要使用React VR开发一个360度球形的图像可旋转查看器。项目中呢，我们将采用几张全景图片和几张对应的小的thunmb按钮图片，最终把按钮放置在360度的立体空间内，制作点击交互；点击这些按钮图片后，全景的360画廊直接进行切换；当然，有一些开发的注意事项，由于呢，...
2019-09-13 18:00:19
3063
原创 React 360 初体验介绍与环境搭建
React 360 初体验介绍从这章节内容呢，我们来学习并了解下什么是react 360,并使用它来开发一个360度可旋转大屏的案例项目。接下来，我们就一起来逐步揭开它神秘的面纱吧！我们本章节将会从下面几个方面分别对我们的react 360进行介绍：什么是 react 360 ?react 360 它有哪些优点？相关的案例 ?本地搭建react 360开发环境？什么是 Rea...
2019-09-12 20:38:52
2062
原创 mongoose 连接警告报错信息处理 { useNewUrlParser: true } 、{ useUnifiedTopology: true }
整个章节呢，记录一个错误处理1.、在windows安装好mongodb后，启动没问题，创建数据库没问题；但是在node环境使用mongoose之后，有一些警告报信息，附上我的连接代码：//...mongoose.connect('mongodb://127.0.0.1:27017/');mongoose.connection.once('open',() => { console...
2019-09-11 15:22:16
20966
4
原创 Redis API接口缓存优化实战
Redis 缓存请求内容，优化 API 接口性能在我们日常的接口开发过程中，或者第三方请求的过程中，每次刷新页面都会重新请求接口，而且大部分接口短时间内是不会变化的；在某些场景下，我们需要转发某些第三方的API接口；所以在多次请求的情况下，就会造成很大资源浪费，也不利于WEB应用交互性能优化；我们这章节呢，将会使用Redis对第三方请求内容做个一个定期缓存，在某个时限内，我们将会直接从本地...
2019-08-29 17:32:48
2643
1
原创 手把手带你开发一个前端命令行工具
手把手带你开发一个前端命令行工具命令行工具，即 Cli (command-line interface)。是在图形用户界面得到普及之前使用最为广泛的用户界面，它通常不支持鼠标，用户通过键盘输入指令，计算机接收到指令后，予以执行。在学习这篇教程之前，我们需要先了解 NodeJs, NPM 和一些常用的 shell 命令相关知识点。那怎样才可以从0创建一个命令行工具呢？开发流程1、首先我们...
2019-08-22 23:12:41
3059
原创 vue脚手架开发之 babel、postcss配置、多页面打包
进阶阶段 babel、postcss、多页面打包导读在上一章节中，我们学习了开发环境和线上环境的区分，css、js代码分离优化，代码压缩等骚操作；我们这节内容呢，继续打造我们的脚手架工具，Let’s go ~这节内容主要涉及下面这些知识点：css之postcss工程化babel7.x配置根据入口文件，自动生成多页面打包配置postcss问：这是啥？什么鬼？我考，没听试过呀，一...
2019-08-21 16:35:54
1712
原创 进阶版 webpack 开发脚手架之线上分离、样式脚本公共提取分离、代码压缩
进阶阶段 webpack 开发线上分离、样式脚本公共提取分离、代码压缩导读在上章节呢，我们基本完成了我们的vue开发环境的构建，这节内容，我们继续深化改造这个脚手架工具；让这个脚手架支持更多的特性，让我们开发和构建打包，更加的方便快捷；hao ~ 我们现在来缕一下，我们今天要开发的内容：（温馨提示：看这章节之前呢，一定要看上一章节：https://blog.csdn.net/WU522948...
2019-08-20 20:32:25
809
原创 新手级使用webpack4.x构建vue的开发环境
起步阶段 使用webpack4.x构建vue的开发环境导读首先呢，我们在这章节呢，我将手把手带着大家使用webpack4.x搭建一个vue的开发环境，这里有的同学可能就会问了？“有现成的类似于vue-cli的webpack脚手架工具，为什么我们还要自己在造轮子呢？” 在这里呢，我将对这个问题做出回答： 同样是前端开发，看着别人拿着高薪，你心动吗？ 开发或打包过程中遇到问题，需要修改脚...
2019-08-19 12:19:36
1012
原创 nuxt 项目 配置对 less、sass、stylus 预处理器的支持
nuxt 配置对less、sass、stylus的支持导读在项目开发的过程中呢，在编写项目样式的时候，很多童鞋喜欢使用css预处理器进行方便快捷的开发，所以说，让我们的项目支持预处理器是非常有必要的；这章节呢，我们项目新增对 stylus、less、sass 这三款比较常用的css预处理器工具的支持；我们可以去到官网查看文档：https://zh.nuxtjs.org/api/conf...
2019-08-12 10:55:25
5472
1
原创 nuxt 每个页面head标签内容设置
nuxt 每个页面head标签内容设置导读在前面几节课程中，我们已经完成对首页，jokes查询页，About页面的开发，接下来，我们来看一下每个页面的head标签内容，我们会发现这三个页面的标签一致，而且和nuxt.config.js配置文件的head配置保持一致；所以我们需要对这三个页面单独做一个head，更加方便于SEO优化，搜索引擎的爬取；好，我们打开index.vue，编辑如...
2019-08-09 13:54:49
8710
1
原创 nuxt about页面功能分析和页面模块开发
nuxt about 页面功能分析和开发导读我们在上一个章节中，我们完成了jokes页面UI和接口功能模块的开发，我们紧接着来继续开发剩下的整个About Page页面，这个页面呢，属于一个纯静态的一个页面，里面主要存放着一些关于jokes相关的一些源网站接口信息，方便大家查看阅读；好，我们来简单分析下页面的结构：顶部 banner顶部标题 About Jokes API内容 ...
2019-08-09 11:54:29
880
原创 nuxt 项目开发之jokes接口联调开发
nuxt 项目开发之jokes接口联调开发导读在上章节中，我们开发完成jokes页面的基本UI骨架，这节课我们来实现实现表单接口交互功能；在编写请求之前呢，我们需要在data中定义好我们需要的属性；首先我们需要当前页的页码page，默认显示第1页，然后总的joke数量用rows字段来代替，再接着呢，我们需要每页显示的jokes条数，默认10条；最后我们需要搜索内容searchWord，...
2019-08-09 11:17:21
1065
1
原创 nuxt jokes页面UI模块结构开发
nuxt jokes 页面结构开发在这章节内容呢，我将带着大家使用bootstarpVue来开发这个jokes查询页面，这章内容呢，主要是编写我们的静态UI结构，渲染上静态数据；好我们现在来使用<Banner>编写这个顶部banner信息栏；编写如下：<Banner title="Jokes Page" para="this is a jokes search page....
2019-08-08 20:55:28
851
原创 nuxt jokes 页面模块功能分析
nuxt jokes 页面功能分析在上章节中，我们开发完成整个首页基本的页面展示，而且完成了 SSR 列表数据的服务端渲染，而且渲染输出到浏览器，在这章节呢，我们紧接着来开发这个jokes查询条件搜索页面；首先呢，我们需要来分析这个jokes页面的所展示UI模块，我们从上到下进行分析；整个jokes查询页面，我们可以分为4个部分，从上到下依次是，banner，筛选表单，jokes列表（包括...
2019-08-08 19:56:57
981
原创 nuxt 项目开发之子页 jokes 查询页面UI模块分析
nuxt 项目开发 - 首页 “笑话” jokes 列表组件开发导读我们接下来继续开发首页的列表的内容，我们首先来分析下首页的jokes列表，这个jokes列表项是异步请求我们的json-server api 接口服务渲染出来数据，且使用card组件包裹起来的，而且我们可以看一下当前页面的源码，我们往下拉，会发现整个列表数据都会被渲染响应到浏览器页面中；好，我们现在来进行开发，首页我们来...
2019-08-08 17:55:52
918
原创 nuxt 项目开发之 json-server API 服务搭建
nuxt 项目开发 - json-server 服务搭建导读我们在项目开发过程中，是需要第三方接口渲染jokes列表的，jokes页面也是需要分页，以及搜索查询的，所以呢，我们需要搭建一个小型服务器，来满足数据的分页，搜索查询；所以呢，我们可以选择json-server这样的一款本地服务的工具，它可以指定某个json文件为api接口的数据源；详细介绍好，我们来看一下这个json-s...
2019-08-08 11:27:35
1376
原创 nuxt 页面路由配置，主页轮播组件开发
nuxt pages目录页面配置，主页轮播组件开发在上一个章节内容中，我们开发了AppHeader公共顶部菜单导航栏组件，本章节呢，我们根据菜单导航的路由导航，来配置我们的 page页面，去到pages目录，我们需要创建3个[nuxt_link_name].vue页面文件，用来匹配路由导航需要加载的页面；好，我们进入命令行，来创建页面文件，windows 系统下可以使用如下命令： ...
2019-08-06 17:32:42
1840
原创 nuxt 项目实战之顶部导航菜单组件开发
nuxt.js 项目开发 - 顶部导航菜单组件开发导读首先我们来分析下，最终案例的导航栏，这是一个移动端展示形式的顶部导航栏，这个导航菜单，采用的是bootstrapVue css ui 组件库里面的navbar组件我们需要单独创建一个菜单组件，并且把这个菜单组件放置在，公共的 layout 组件内部，接下来我们来制作菜单导航我们需要在components目录中新建目录App...
2019-08-04 13:11:42
4260
原创 nuxt 目录结构及配置文件详解
nuxt 目录结构详解首先我们来看下使用 create-nuxt-app脚手架工具所创建的nuxt项目目录的结构，windows cmd 命令行输入，tree /f /a ，打印如下项目目录结构：C:.| .editorconfig| .gitignore| nuxt.config.js| package.json| README.md|+---assets...
2019-07-31 14:57:43
6745
原创 手把手带你深入了解 webpack config devSever 常用参数配置
导读DevServer 提供了一些配置项可以改变 DevServer 的默认行为。 要配置 DevServer ，除了在配置文件里通过 devServer 传入参数外，还可以通过命令行参数传入。 注意只有在通过 DevServer 去启动 Webpack 时配置文件里 devServer 才会生效，因为这些参数所对应的功能都是 DevServer 提供的，Webpack 本身并不认识 devSe...
2019-07-29 17:47:23
2154
原创 babel的配置文件的种类及安装使用@babel/cli工具
babel的配置文件的种类及安装使用babelBabel 也由配置文件！许多其他工具都有类似的配置文件：ESLint (.eslintrc)、Prettier (.prettierrc) 等等；所有 Babel API 参数 都可以被配置。然而，如果使用 JavaScript 代码 配置参数，我们就会需要使用 JavaScript 代码版 的配置文件;babel 常用的配置方案你是否希...
2019-07-26 16:12:31
2351
原创 babel 基础概念理解及新手入门初体验
一、Babel基础知识点的介绍1. 什么是 babel， babel的简介和概述Babel 是一个 JavaScript 编译器Babel 是一个工具链（编译器），主要用于将 ECMAScript 2015+ 版本的代码转换为向后兼容的 JavaScript 语法，以便代码可以运行在当前和旧版本的浏览器或其他环境中。作为一种语言，JavaScript 在不断发展，新的标准／提案和新的特...
2019-07-25 16:52:24
1123
原创 前端知识每日小拷问 007 MVVM框架相关
前端知识小拷问 007 vue、react、angular 相关准备接收大前端形法的考验吧！？每日5题，直击你的内心 ~~今天的前端知识点有如下：vue与react的对比，如何选型？从性能，生态圈，数据量，数据的传递上，作比较 ?vue slot 是做什么的 ?vue和angular的优缺点以及适用场合 ?vue 路由实现原理 ?vue的双向绑定的原理，和an...
2019-07-20 11:57:21
811
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人