- 博客(64)
- 资源 (1)
- 收藏
- 关注
RSS订阅
原创 基于 Vuepress 搭建个人博客，文章详细，助你快速上手
搭建博客 几年前在小白阶段使用过 WordPress + 阿里云服务器 搭建了自己的博客，也走了很多坑，从零摸坑最后也弄好了，也顺便使用了阿里云的一些服务，但当时没有记录笔记的习惯，过了好久很多操作也遗忘了。 加上服务器过期了好多数据也没有备份，那就重新搭一个快速上手的博客，想着怎么也应该尝试一些新的方法，刚好也了解到了尤大神的 Vuepress。因为也更好的支持 Vue此文章内容将会抽时间持续更新ing，请尝试不同时间段来参考。准备工作1、准备服务器环境，或者最后部署到GitHub或码
2020-11-21 00:43:10
2465
1
原创 create-react-app 创建的工程中使用 antd 组件（使用 craco 配置）
组件按需打包（ant-design）有的组件有自己的css样式和js特效，那么原来的做法是按照一键导入，需要import 一个总的css包或js包，但这样有点浪费资源。所以可以进行如下配置，实现自动用哪个组件按需要导入相应的css或js包1、下载依赖包yarn add antdyarn add @craco/cracoyarn add craco-less'请注意'：下面这个依赖包在2.0版本后已经废弃yarn add react-app-rewired customize-cra
2020-11-17 19:14:40
811
原创 Redux 文章，助你了解 Web 架构其中的一种解决方案
redux设计思想Redux 的设计思想很简单，就两句话。（1）Web 应用是一个状态机，视图与状态是一一对应的。（2）所有的状态，保存在一个对象里面。学习文档英文文档: https://redux.js.org/中文文档: http://www.redux.org.cn/Github: https://github.com/reactjs/reduxredux 是什么?redux是一个独立专门用于做状态管理的JS库(不是react插件库)它可以用在react,
2020-11-16 20:47:26
337
原创 React 入手参考文章
React此文章个人作为了解学习，应用类型和代码示例多概述用于构建用户界面的JavaScript库（只关注View）由 Facebook 开源（1） 英文官网: https://reactjs.org/（2）中文官网: https://doc.react-china.org/特点1、Declarative（声明式编码）以声明式编写 UI，可以让你的代码更加可靠，且方便调试。2、Component-Based（组件化编码）组件逻辑使用 JavaScript 编写而非模版，因此
2020-11-15 12:02:41
578
原创 NodeJs 笔记补充
NodeJS知识补充Node js 和 JavaScript区别都基于ECMAScript标准的实现和扩展ECMAScript 定义语法，写js和node都要遵守语法包含了:变量定义、循环、判断、函数、原型、原型链、作用域、闭包、异步。ECMAScript定义了语法，但是它不能操作DOM，不能监听click事件，不能发送ajax请求，不能处理http请求，不能操作文件，只有它，几乎做不了任何实际的项目JavaScript（完成浏览器端任何操作）：ECMAScript + WebAPI
2020-11-04 10:40:56
1371
原创 Vue 一套构建用户界面的渐进式的框架
此文章知识来源：哔哩哔哩视频 codewhy + Vue官网 + 菜鸟教程此文章内容：基础语法+代码+图片+demo文章目录------------->知识了解篇------------->生命周期篇------------->模板语法篇------------->计算属性与监听属性篇------------->条件与循环篇------------->事件监听篇------------->表单篇------------->组件篇--.
2020-11-04 10:25:40
2016
原创 ES6 复习，知识补充
ES6知识补充概念ECMAScript 6.0（以下简称 ES6）是 JavaScript 语言的下一代标准，已经在 2015 年 6 月正式发布了。它的目标，是使得 JavaScript 语言可以用来编写复杂的大型应用程序，成为企业级开发语言。ES6 既是一个历史名词，也是一个泛指，含义是 5.1 版以后的 JavaScript 的下一代标准，涵盖了 ES2015、ES2016、ES2017 等等，而 ES2015 则是正式名称，特指该年发布的正式版本的语言标准。提到 ES6 的地方，一般
2020-10-29 18:41:50
1385
原创 jQuery 个人之前的笔记
jQuery 基础篇概述jQuery是一款优秀的JavaScript库 ，从命名可以看出jQuery最主要的用途是用来做查询(iQuery=js+Query) ，正如jQuery官方Logo副标题所说(write less, domore)使用jQuery能 上我们对HTML文档遍历和操作、事件处理、动画以及Ajax变得更加简单入门和原生JS区别1、原生JS： 等DOM元素加载完毕，并且图片也加载完毕才会执行 编写多个入口函数，后面会覆盖前面2、jQuery 等Dom元素加载完毕，但
2020-06-16 19:28:35
2751
2
原创 JavaScript 进阶笔记
JavaScript 进阶个人博客地址：https://blog.3xnb.com个人码云地址:https://gitee.com/xiaojinx9/ren_chunjin/面向对象概述面向对象编程的全称为Object Oriented Programming,简称为OOP。面向对象编程是用抽象方式创建基于现实世界模型的一种编程模式。面向对象编程可以看作是使用一系列对象相互协作的软件设计。面向对象程序设计的目的是在编程中促进更好的灵活性和可维护性。凭借其对模块化的重视，面向
2020-06-16 00:42:09
3481
4
原创 计算机网络基础（理论知识全）
计算机网络基础第一章、计算机网络概述一、计算机网络的基本概述1、计算机网络定义计算机网络是互连的、自治的计算机的集合 2、协议的定义 定义：协议是网络通信实体之间在数据交换过程中需要遵循的规则或约定，是计算机网络有序运行的重要保证。 （数据交换中的规则）协议的3个基本要素： 语法：定义实体之间交换信息的格式与结构。（如：报文：数据单元...
2020-04-06 08:50:31
5437
原创 diff 算法
(1)、若先遍历完新节点后,但旧节点树剩余的节点没有遍历完的情况,此时将旧节点的剩余子节点销毁。(2)、若先遍历完旧节点后,但新节点树剩余的节点并没有遍历完的情况,此时将创建剩余新子节点。Diff算法,至根节点到叶节点,从左到右,从上到下,依次遍历进行对比。2、若对比后新旧节点位置不同,则将旧节点的位置按照新节点进行移动。1、当节点的类型不同,将旧节点进行销毁,创建新节点。3、当节点类型相同,依次对比新旧节点树。再Vue中和React有应用到。vnode 本身是一种对象结构。
2023-11-25 19:27:08
176
原创 JS 同步异步，宏任务和微任务
本人看到各个文章的知识概念，结合自己的理解记录一下把，可能有些概念理解的不是很对。望各大佬指出知识补充1、JavaScript是单线程，而浏览器是多线程。2、浏览器包括的线程有：事件触发线程、定时器触发线程、异步http请求线程、GUI渲染线程3、异步任务区分了宏任务和微任务（当然所有的JS代码也可以看作宏任务）4、栈符合数据结构中的先进后出，队列符合先进先出5、创建Promise或async的过程是一个同步操作，reslove.then或await阻塞之后的内容才是异步同步任务：因为Ja
2021-07-14 15:59:53
379
6
原创 前端性能优化
性能优化原则要先找到最大的性能瓶颈先防止恶化，然后才是优化要找到性能问题的根由不要做过度反常态的优化要考虑各种情况下的性能不要做过早不成熟的优化一切以数据说话不要做表面的肤浅优化常用优化措施一、图片优化1、消除不必要的图片考虑是否可用CSS实现考虑是否可用SVG用Web Font代替2、减少不必要的图片请求把小图片转成base64应用CSS Script3、根据场景选择合适的格式JPEG ：有损压缩图形格式。栅格图形不合适：线条图形和文字、图标图形（与其压缩算法有关）
2021-06-15 01:10:02
291
原创 用阿里云服务器搭建个人博客（宝塔面板+wordpress）半小时上手
以下文章是本人，以前小白时候搭博客的方式，对新手来说极其容易上手，因最近又购买了服务器，想着再换个方式去搭建，另外一个方式是用Vuepress 搭建的博客（参考我另外一篇文章）云服务器的话，根据自己的需要购买，如果只是简单的发发文章图片，视频等，网站访问量不高的话，买个1核2G1M的配置也能够用。当然，如果对响应速度等体验比较看重的话，可以买个稍微高点配置的，比如2核4G的这样的。操作系统建议选择CentOS7版本下面说说用阿里云服务器建立个人网站（以WordPress为例）的具体流程：因为这篇文
2020-11-20 16:09:50
3323
1
原创 JavaScript 算法题
1、如下题：let nums = [2, 7, 8, 6, 5, 3, 1, 11, 15]let target = 9function sum(nums, target) { // 定义旧数组 var arrys = nums // 过滤掉小于target的值，返回一个新数组 var arry = nums.filter(iteam => iteam < target) // 双重for循环遍历新数组，进行判断后将符合的去和旧数组作inde
2020-11-08 18:04:29
1435
1
原创 Vue 一套构建用户界面的渐进式的框架 （Cli3 篇~）
脚手架概述Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统一个丰富的官方插件集合，集成了前端生态中最好的工具。一套完全图形化的创建和管理 Vue.js 项目的用户界面Vue CLI 致力于将 Vue 生态中的工具基础标准化。它确保了各种构建工具能够基于智能的默认配置即可平稳衔接，这样你可以专注在撰写应用上，而不必花好几天去纠结配置的问题。与此同时，它也为每个工具提供了调整配置的灵活性，无需 eject。用于快速生成 Vue 项目基础架构 ， 其官方网址 ： 'https:/
2020-11-05 21:13:28
1642
3
原创 Vue 一套构建用户界面的渐进式的框架 （Webpack篇~）
友情提示：大部分loader可以在webpack官网中找到，并且学习对应的用法或直接copy配置。参考webpack中文网址：https://www.webpackjs.com/概述是一个现代化的JavaScript应用的静态模块打包工具webpack其中一个核心就是让我们能进行模块化开发，并且会帮助我们处理模块间的依赖关系（处理好生成浏览器能识别的内部代码，更好的高效让浏览器识别）像使用前端模块化的一些方案：AMD、CMD、CommonJS、ES6（浏览器对这些规范有的不支持，但用
2020-11-05 17:08:09
1229
原创 Vue 一套构建用户界面的渐进式的框架 （路由篇~）
此块知识内容基础，没有官方文档全，仅供参考概述（了解）单页面富用阶段（SPA）SPA 主要的特点是在前后端分离（后端只提供API来返回数据，前端通过Ajax获取到的数据渲染到页面）的基础上加了一层前端路由也就是由前端来维护一套路由规则前端路由的核心：改变URL，但页面不进行整体的刷新（俩种方法：1、URL的hash 2、H5的history模式：pushState、replaceState）vue-router目前前端流行的三大框架，都有自己的路由实现：Angular的ngR
2020-11-04 20:45:11
1177
原创 Vue 一套构建用户界面的渐进式的框架（组件篇★~）
概述将一个页面拆分成一个个小的功能块，每个功能块完成属于自己这部分独立的功能，那么之后整个页面的管理和维护就变得非常容易。组件系统让我们可以用独立可复用的小组件来构建大型应用，几乎任意类型的应用的界面都可以抽象为一个组件树语法'Vue2.x 版本之前的写法：'组件使用三个步骤：创建组件构造器（调用Vue.extend()）注册组件（Vue.component()）使用组件（在Vue实例的作用范围使用组件,使用自定义的组件名）例如：<!DOCTYPE html>
2020-11-04 10:02:32
1206
原创 Vue 一套构建用户界面的渐进式的框架（表单篇~）
表单v-model可以用 v-model 指令在表单 <input>、<textarea> 及 <select> 元素上创建双向数据绑定。它会根据控件类型自动选取正确的方法来更新元素。尽管有些神奇，但 v-model 本质上不过是语法糖。它负责监听用户的输入事件以更新数据，并对一些极端场景进行一些特殊处理。v-model 会忽略所有表单元素的 value、checked、selected attribute 的初始值而总是将 Vue 实例的数据作为数据来源
2020-11-02 14:30:50
2167
原创 Vue 一套构建用户界面的渐进式的框架（事件监听篇~）
事件监听使用 v-on作用：绑定事件监听器语法糖:@参数：eventv-on 参数1、若方法不需要额外参数，那么方法后的() 可以不添加例如：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
2020-11-02 08:58:51
1342
原创 Vue 一套构建用户界面的渐进式的框架（条件与循环篇~）
条件语句条件判断<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>条件语句</title></head><body> <div
2020-11-02 08:51:46
1513
原创 Vue 一套构建用户界面的渐进式的框架（计算属性与监听属性篇~）
计算属性概述计算属性是vue实例中的一个配置选项：computed通常里面都是一个个计算相关的函数，函数里头可以写大量的逻辑，最后返回计算出来的值即我们可以把这些计算的过程写到一个计算属性中去，然后让它动态的计算。优点：相比methods，不用调用方法，而是直接访问计算后的属性，可读性强些。计算属性有缓存所以性能比methods高例如：<body> <div class="app"> <h2>{{message}}&l
2020-11-02 08:49:49
1314
原创 Vue 一套构建用户界面的渐进式的框架（模板语法篇~）
模板语法代码规范：最好每次缩进俩个空格更符合规范哟~创建Vue实例传入的optionsel类型：string | HTMLElement作用：用于挂载要管理的元素节点,值可以是 CSS 选择符，或实际 HTML 元素，或返回 HTML 元素的函数。 data类型：Object | Function（组件当中data必须是一个函数）作用：Vue实例对应的数据对象methods类型： {[key:string]:Function}作用：定义属于Vue的一些方法，可以在其他地方调用，也
2020-09-25 16:35:25
3379
原创 Vue 一套构建用户界面的渐进式的框架（生命周期篇~）
个人理解可能存在偏差，仅供参考~事物从诞生到消亡的整个过程每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如，需要设置数据监听、编译模板、将实例挂载到 DOM 并在数据变化时更新 DOM 等。同时在这个过程中也会运行一些叫做生命周期钩子的函数，这给了用户在不同阶段添加自己的代码的机会。首先看一张图吧~这是官方文档上的图片：钩子就好像是把人的出生到死亡分成一个个阶段，你肯定是在出生阶段起名字，而不会在成年或者死亡的阶段去起名字。或者说你想在出生阶段去结婚，也是不行的。组件也是.
2020-09-24 17:22:36
2068
原创 Vue 一套构建用户界面的渐进式的框架（知识了解篇~）
知识了解概念Vue是一个渐进式的框架。渐进式概念？1、可以将Vue作为应用的一部分嵌入其中，带来更丰富的交互体验2、可以将更多的业务逻辑使用Vue实现3、如 Core+Vue-router+Vuex，也可以满足各种各样的需求特点Vue很多特点和Web开发中常见的高级功能1、解耦视图和数据2、可复用的组件3、前端路由技术4、状态管理5、虚拟DOM安装1、直接CDN引入<!-- 开发环境版本，包含了有帮助的命令行警告--><script src="
2020-09-24 00:58:32
7865
原创 Vote System 用户登录判断（Cookie-session）
Cookie-session存储在后端中，所以进行后端的设置和逻辑的处理。最后只需要返回前端code码和msg便可以。1、导包const express=require('express')const mysql=rquire('mysql')const cookieSession = require('cookie-session');const cookieParser = require('cookie-parser')const app=express()//配置MySQL连
2020-09-20 21:02:40
2446
原创 Fetch API
概述fetch是一种HTTP数据请求的方式，是XMLHttpRequest的一种替代方案。fetch不是ajax的进一步封装，而是原生js。Fetch函数就是原生js，没有使用XMLHttpRequest对象。为了代替Ajax是ES2018规范中新增的API，所以浏览器支持度不是特别好语法1、第一个参数是URL:2、第二个是可选参数，可以控制不同配置的 init 对象3、使用了 JavaScript Promises 来处理结果/回调:fetch(url).then(respon
2020-09-10 17:13:11
2737
原创 Axios库
Axios库基本概述Axios 是一个基于 promise 的 HTTP 库，可以用在浏览器和 node.js 中。特性:从浏览器中创建 XMLHttpRequests从 node.js 创建 http 请求支持 Promise API拦截请求和响应转换请求数据和响应数据取消请求自动转换 JSON 数据客户端支持防御 XSRF使用 npm安装axios:$ npm install axios语法请求方式get/post/head/delete/put/option
2020-09-10 17:05:57
2912
原创 解决跨域访问
同源策略由Netscape公司引入浏览器。目前，所有浏览器都实行这个政策。目的是为了保证用户信息的安全，防止恶意的网站窃取数据若非同源，会有三种行为限制：1、Cookie、LocalStorage和indexDB无法读取2、DOM无法获得3、AJAX请求不能发送同源指的是：协议相同、域名相同、以及端口相同。互联网默认原则（不允许跨域访问）常见跨域HTML 页面中一些允许指定路径的元素具有跨域特性：<link>元素<script>元素<
2020-09-10 17:04:50
2418
原创 三级联动案列
案列分析思路建立核心对象主要用到了Ajax异步交互数据客户端创建Ajax核心对象，和服务器进行连接及交互数据，如下：//1、创建XMLTHttpRequest对象var xml=createXMLHttpRequest() //2、调用XMLHttpRequest对象的open（）方法//与服务器建立连接xml.open('get','xxxxxxxxx')//3、监听事件xml.onreadystatechange=()=>{ //xxx
2020-09-08 09:17:37
2504
原创 Ajax 异步交互
基本概述同步交互类似于排队就是指发送一个请求，需要等待返回，然后才能够发送下一个请求异步交互异步交互的区别在于同步交互需要等待结果，而异步交互不需要等待。所谓异步交互，就是指发送一个请求，不需要等待返回，随时可以再发送下一个请求。同步交互与异步交互区别在于：同步需要等待结果，而异步不需要等待结果异步交互的优势异步交互相比同步交互的优势主要具有以下几点:1、用户操作无须像同步交互必须等待结果。2、异步交互对带宽造成的压力相比同步交互更小。3、异步交互只需与服务器端交换.
2020-09-07 08:21:13
2635
原创 网络基础知识
什么是HTTP协议超文本传输协议，是服务器和客户端之间，传输超文本的传送协议。HTTP工作流程客户端连接到Web服务器，建立TCP连接；客户端发送http请求；服务器接收请求并返回http响应；释放http连接；客户端解析html。HTTP请求get示例GET /562f25980001b1b106000338.jpg HTTP/1.1Host img.mukewang.comUser-Agent Mozilla/5.0 (Windows NT 10.0; WOW64)
2020-09-06 09:47:38
2735
原创 Node.js实现，英雄页面管理系统项目案例
需要知识：1、Node.js基础用法2、express模块使用3、爬虫的简单使用4、MySQL创建5、ES6语法6、HTML、CSS、jQuery、ajax、bootstrap、js 基础语法7、cookie使用以上知识可以参考我之前写过的文章效果图展示一、爬虫入库爬取王者荣耀的英雄信息存入数据库，参考我的文章 --> 爬取数据入库二、API设计三、源码下载项目案例链接（https://jine.oss-cn-beijing.aliyuncs.com/hero.r.
2020-07-10 17:59:38
2525
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人