Web_linlan-CSDN博客

原创使用Webpack搭建React脚手架（下篇）

一套完善的开发环境配置可以极大的提升开发效率，提高代码质量，方便多人合作，以及后期的项目迭代和维护。所以说，前端代码格式规范和语法检测的工具可以提高代码的质量和可读性，减少低级错误和维护成本，提高团队的协作效率和开发效率，是非常有必要的。本篇我们将在完善脚手架的搭建。

2024-01-04 21:01:42 948 2

原创使用Webpack搭建React脚手架（中篇）

上一篇中，通过配置webpack和环境变量，从而使得脚手架有了初始化的成效。本篇，我们来继续搭建基础功能配置。

2023-12-27 21:23:24 981 2

通过使用Create React App来搭建React脚手架，我们可以快速创建一个新的React项目，并且集成了一些常用的开发工具和库。通过构建生产版本，我们可以生成一个优化后的、可部署的应用。搭建React脚手架是开发React应用的重要一步，它可以帮助我们快速初始化项目结构，并且集成一些常用的开发工具和库，提高开发效率。这将启动一个本地开发服务器，并自动在浏览器中打开一个新的标签页，显示你的React应用。CRA提供了一些默认的配置，但你也可以根据需要对项目进行定制。文件来定制你的应用。

2023-12-24 20:46:26 506 2

原创 Node.js 图片上传

Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行时环境，具有高效、轻量级和事件驱动的特性。在 Node.js 中，可以使用各种模块和库来实现图片上传功能。在本文中，我们将介绍如何使用 Node.js 来实现图片上传功能。代码中，我们创建了一个 HTTP 服务器，监听 3000 端口。在实际应用中，你可以根据需求进一步对上传的图片进行处理，例如缩放、裁剪等操作。目录下，并向客户端返回上传成功的消息。结尾的 POST 请求时，我们使用。文件夹，用于存储上传的图片。

2023-12-18 08:28:34 410

原创 token

当用户进行后续请求时，客户端会将令牌密钥包含在请求中，服务器通过验证令牌密钥来确认用户身份。令牌密钥作为其中的关键机制，通过生成和验证令牌密钥来确认用户身份，并控制用户的访问权限。在实际开发中，我们可以使用现成的身份验证框架来实现令牌密钥的生成和验证，提高开发效率和系统安全性。通过使用令牌密钥进行身份验证，可以有效地保护用户数据的安全性，防止非授权用户访问系统或资源。唯一性：每个用户的令牌密钥是唯一的，它可以用于标识和区分不同的用户。在前后端身份验证过程中，令牌密钥的生成和验证是非常重要的步骤。

2023-12-17 21:00:14 399 1

原创什么是BFC，如何触发

要触发BFC，可以通过设置元素的特定属性或者使用特定的布局技巧。触发BFC可以通过设置元素的特定属性或使用特定的布局技巧，比如设置float属性、position属性、display属性等来触发BFC。BFC是一种独立的布局环境，它对内部的元素进行封装，并且有一些特定的属性和行为。BFC内部的元素在布局时会遵循一些特定的规则，这些规则可以用来解决一些常见的布局问题。根元素：根元素即HTML文档中的根元素，通常是。浮动元素：当元素的float属性设置为left或right时，它会创建一个BFC。

2023-12-17 20:57:50 343 1

原创事件循环机制Event Loop

为了充分利用 CPU 资源，JavaScript 采用了异步非阻塞的机制，即当一个异步操作开始后，JavaScript 会立即执行后续的代码，等异步操作完成后再去执行对应的回调函数。总结：事件循环机制是 JavaScript 实现异步非阻塞的基础，通过不断地检查任务队列，执行可执行的任务，实现了 JavaScript 单线程的异步操作。如果在执行操作期间不需要等待结果，可以继续执行其他操作，那么称为非阻塞操作。简单来说，事件循环机制是通过不断地检查任务队列，执行可执行的任务，来实现异步操作的执行。

2023-12-17 20:52:10 41 1

原创 ES6新特性

ES6（也被称为ES2015）是JavaScript的一个重要更新版本，它引入了许多令人兴奋的新特性，提供了更高效、更灵活的编码方式。本文将介绍一些ES6的新特性，并附上相应的代码示例。通过学习和使用ES6的新特性，我们可以写出更简洁JavaScript代码。箭头函数是ES6中的一个重要特性，它提供了更简洁的函数定义和更简洁的上下文绑定。解构赋值允许我们从数组或对象中提取值，并将其赋给变量，提供了更简洁的赋值方式。模板字符串允许我们在字符串中插入变量和表达式，提供了更方便的字符串处理方式。

2023-12-17 20:48:14 368 1

原创前端非入侵式骨架屏

首先，由于骨架屏是在JavaScript中生成的，所以对于一些不能被JavaScript解析的标记，骨架屏可能无法完美地展现。其次，在生成骨架屏的过程中，需要精细的CSS控制，以确保骨架屏的显示效果符合预期。这个技术通过JavaScript在页面加载时生成骨架屏，不需要后台生成骨架屏的HTML或图片，在前端直接操作DOM元素，生成骨架屏的结构和样式。但是，传统的骨架屏生成方式往往需要在页面中添加大量的HTML和CSS代码，这不仅会影响页面加载速度，还会增加维护成本。为了实现骨架屏效果，我们使用了。

2023-11-18 10:54:45 58 1

原创 HTTP和HTTPS的区别

HTTP：是互联网上应用最为广泛的一种网络协议，是一个客户端和服务器端请求和应答的标准（TCP），用于从WWW服务器传输超文本到本地浏览器的传输协议，它可以使浏览器更加高效，使网络传输减少。HTTPS：是以安全为目标的HTTP通道，简单讲是HTTP的安全版，即HTTP下加入SSL层，HTTPS的安全基础是SSL，因此加密的详细内容就需要SSL。在前端开发中，对于HTTP和HTTPS的区别，主要涉及到两个方面：一是协议的区别，二是对于部分浏览器对于HTTPS中的不安全资源的处理。

2023-11-18 10:35:35 33 1

原创 js的手风亲

当点击标题部分时，我们需要让该标题所在的div的内容部分显示出来，并将其他的内容部分隐藏。我们首先获取所有的标题部分和内容部分，并为每个标题部分添加点击事件。当点击标题部分时，我们遍历所有的div，如果当前div是被点击的标题所在的div，则显示其内容部分，否则隐藏其内容部分。手风琴框架应该具有一定的宽度和高度，并且设置position属性为relative，以便进行绝对定位的子元素。内容部分也是一个div，用于显示内容。当点击一个标题时，该标题所在的内容部分会显示出来，并将其他的内容部分隐藏。

2023-10-07 00:08:41 44 1

原创 DOM操作

通过 getElementById、getElementsByClassName、getElementsByTagName、querySelector、querySelectorAll等方法可以获取网页中的元素节点，返回的是一个对象或对象数组。下面将介绍常用的DOM操作方法。使用createElement方法可以创建一个元素节点，使用appendChild、insertBefore或者replaceChild方法可以将新节点插入到DOM树中。通过修改元素的属性可以更改元素的样式、文本内容、链接等信息。

2023-10-04 18:30:20 34 1

原创 js的冒泡排序

冒泡排序的基本思路是将每个元素与它后面的元素进行比较，如果前面的元素比后面的元素大，则交换两个元素的位置。JS的冒泡是一种常用的排序算法，其核心思想是从数组的第一个元素开始，将相邻两个元素进行比较，如果前一个元素大于后一个元素，则交换它们的位置。通过以上代码实现，我们可以看到冒泡排序有一个明显的缺点，即每一轮排序后都只能排好一个元素的位置，对于已经排好序的元素，还需要进行比较。这是因为，需要进行n-1轮排序，每轮排序需要比较n-i-1次，因此总的比较次数为n(n-1)/2次，即时间复杂度为O(n^2)。

2023-09-18 23:39:12 281 1

原创 JS的垃圾回收机制

在新生区的内存分配非常容易：我们只需保有一个指向内存区的指针，不断根据新对象的大小对其进行递增即可。当该指针达到了新生区的末尾，就会有一次清理（小周期），清理掉新生区中不活跃的死对象。JS的垃圾回收机制是为了以防内存泄漏，内存泄漏的含义就是当已经不需要某块内存时这块内存还存在着，没有被释放，导致该内存无法被使用，垃圾回收机制就是间歇的不定期的寻找到不再使用的变量，并释放掉它们所指向的内存。指的是当程序运行需要的内存超过了剩余内存的时候，就会抛出内存溢出的错误，内存泄漏积累过多时，就会导致内存溢出。

2023-09-18 19:30:09 113 1

UI_linlan的博客