- 博客(650)
- 资源 (82)
- 收藏
- 关注
RSS订阅原创 Vue的学习内容和目标
本文系统介绍了Vue.js的学习路径，分为基础、中级和高级三个阶段。基础部分包括核心语法、模板指令、数据绑定和计算属性等；中级涵盖组件通信、路由、HTTP请求和动画实现；高级阶段聚焦状态管理、身份验证、性能优化以及组合式API等进阶内容。通过分层递进的学习体系，帮助开发者从Vue入门到精通，掌握构建现代化Web应用的全套技能。
2025-06-24 19:27:31
464
原创 使用Vue重新构建应用程序
摘要：使用Vue重构应用的步骤与优势 本文介绍了使用Vue.js重构应用程序的基本步骤。首先通过CDN引入Vue，创建Vue实例并定义响应式数据（goals数组和enteredValue输入值）。然后通过v-model实现双向数据绑定，v-on监听点击事件，v-for进行列表渲染。相比原生JavaScript，Vue的优势体现在：1）减少重复代码，提高开发效率；2）响应式系统简化数据管理；3）内置指令简化DOM操作；4）组件化架构提升可维护性。Vue的声明式编程模式让开发者更专注于业务逻辑而非DOM操作细节
2025-06-23 22:08:03
378
原创 仅使用 javascript 构建第一个应用程序
摘要 本文演示了一个简单的前端应用实现，用户可以在输入框中输入目标内容，点击按钮后下方列表会显示提交的内容。代码包含HTML、CSS和JavaScript三部分：HTML构建了基础结构，CSS提供样式美化，JavaScript实现交互逻辑。文章最后预告下一篇文章将用Vue框架重构这个功能。整个Demo展示了基本的前端DOM操作和事件处理流程。
2025-06-22 22:02:54
263
原创 探索 Vue 替代方案
Vue、React和Angular三大前端框架各有特点：Vue提供完整组件化方案，React专注组件化UI库，Angular功能丰富但可能臃肿。技术对比显示它们在编程范式、模板语法等方面存在差异。未来发展趋势包括Vue的新工具链、React的编译器优化和Angular的信号系统。技术选型的核心在于权衡团队熟悉度、项目需求等因素，而非单纯追求"最优"框架。
2025-06-21 23:51:30
339
原创 什么是Vue.js
Vue.js是一个JavaScript框架，用于构建交互式和响应式的Web前端应用。JavaScript作为浏览器支持的语言，可以直接操作页面DOM，实现动态更新。Vue作为框架提供实用功能和开发规范，避免重复造轮子并提升团队协作效率。Vue可应用于多页面的部分控制，也可用于构建单页应用(SPA)，由前端完全控制UI界面。相比原生JavaScript，Vue简化了开发流程，提高了代码质量和安全性。
2025-06-20 21:09:49
266
原创 设置与 Netlify 的持续集成
本文介绍了如何将本地代码与Netlify自动化部署系统进行集成。主要内容包括：登录Netlify后关联GitHub存储库，授权连接后设置构建命令和输出目录，触发首次部署并查看构建日志。完成设置后，后续代码推送至GitHub时Netlify将自动构建部署。该流程实现了从本地开发到持续部署的自动化，为后续Vue学习项目部署做好准备。
2025-06-19 20:29:06
304
原创 将项目推到Github
本文介绍了如何将本地项目上传到GitHub私有仓库的操作步骤： 首先需要安装Git并注册GitHub账号； 在GitHub创建新仓库，设置可见性为私有； 使用Git命令初始化本地仓库，添加文件并提交； 通过git push命令将本地master分支推送到远程仓库； 演示了推送其他分支(new-feature)的操作； 最后添加README.md文件并再次提交推送。整个过程包含详细的操作截图和命令行示例，帮助用户完成从本地到GitHub私有仓库的项目上传。
2025-06-18 10:30:29
340
原创 Git基础
本文介绍了Git的基本操作流程。主要内容包括：使用.gitignore忽略文件、git status查看状态、git add添加文件到暂存区、git commit提交更改。重点讲解了代码回滚操作（git reset --hard）和分支管理（git branch、git checkout、git merge）。文章还提供了Git官方命令速查表的链接，建议打印学习。这些基础操作为版本控制和团队协作提供了有效工具。
2025-06-17 09:05:44
283
原创 设置Git和Github
本文介绍了Git的下载安装及基本使用流程。首先指导用户从官网下载Git安装包，通过简单的下一步操作完成安装。接着演示如何在VSCode中初始化Git存储库，并注册GitHub账户。最后讲解了连接本地Git与GitHub账户的方法，包括设置用户名和邮箱的基本命令。文章仅作入门引导，后续将深入讲解Git的详细功能。整个安装和配置过程简单明了，适合Git新手快速上手。
2025-06-16 11:08:44
553
原创 使用Netlify进行简单部署
本文介绍了如何使用Netlify部署前端项目。首先修改package.json文件，添加Parcel构建参数，然后运行构建命令生成dist目录。随后登录Netlify官网，将dist目录拖入网站即可完成自动部署。部署完成后通过生成的链接即可访问项目，还能在Netlify中配置项目名称等参数。Netlify提供免费且强大的前端项目托管服务，操作简单高效。文中还预告后续将学习版本控制和Git相关知识，这是程序员必备技能。整个部署流程清晰易懂，适合初学者快速上手。
2025-06-15 22:12:53
532
原创 总结：菜谱项目最终要点
本文介绍了如何使用JSDoc标准编写代码文档，以提高代码可读性和团队协作效率。主要内容包括：1）在VSCode中通过/** */自动生成JSDoc注释模板；2）详细说明如何为参数、返回值等添加类型注释和功能描述；3）展示文档注释的智能提示效果；4）介绍扩展注释内容的方法，如添加作者、待办事项等。此外还提出了多项功能改进建议，如分页显示、搜索排序、表单验证、营养数据获取等，并提到将项目部署到服务器的计划。通过规范的文档注释，可以让开发团队更高效地理解代码逻辑。
2025-06-14 09:15:00
305
原创 上传一个菜谱-最后部分（项目完结）
摘要：本文总结了菜谱上传功能的最后完善步骤，包括重新渲染书签视图和更新URL ID。同时重构了AJAX方法，优化了用户上传菜谱的图标显示逻辑，并在搜索功能中添加了用户数据识别。此外，修复了表单内容处理导致的空格缺失问题。该项目整合了JavaScript的核心知识点，可作为学习参考。 （149字）
2025-06-13 09:10:47
576
原创 上传一个新菜谱-第二部分
本文介绍了菜谱上传功能的开发过程。首先在model层创建了uploadRecipe方法，处理用户上传的菜谱数据。重点解决了食材信息的提取和格式验证：通过过滤ingredient前缀字段，拆分处理重量、单位和描述信息，并加入错误处理逻辑。然后构建完整的recipe对象，包含标题、图片URL、烹饪时间等字段。最后通过辅助函数sendJSON发送POST请求到API，在请求中包含API密钥进行身份验证。整个流程包含了前端数据验证、后端处理和API通信的实现。
2025-06-12 13:43:25
424
原创 上传一个新菜谱-第一部分
本文介绍了如何创建一个上传菜谱功能的第一部分实现。首先创建了AddRecipeView视图类，处理表单窗口的显示/隐藏逻辑，通过toggleWindow方法实现点击按钮和背景关闭窗口的功能。然后使用FormData API获取表单数据，并通过Object.fromEntries将其转换为对象。在控制器中设置了事件监听，最终实现了点击上传按钮获取表单数据的功能。文章还提到ID等额外字段将在第二部分通过model层处理。整个过程体现了MVC架构和发布订阅者模式的应用。
2025-06-11 10:36:27
303
原创 使用 localStorage 存储书签
本文介绍了如何利用 localStorage 实现食谱书签的本地存储功能。主要内容包括：通过 persistBookmarks 方法将书签数据存入 localStorage；编写 addBookmark 和 deleteBookmark 方法实现书签的添加与删除；使用 init 函数初始化时读取本地存储数据；通过 addHandlerRender 方法解决页面刷新时视图更新问题。最终实现了书签数据的持久化存储和页面刷新后自动加载功能，并展示了浏览器中的实际存储效果截图。该方案通过 localStorage
2025-06-10 11:35:49
262
原创 实现书签-第二部分
本文介绍了如何在书签列表中查找收藏的菜谱。首先，将书签功能单独放入一个文件中，并基于ResultsView进行修改。通过更新选择器和错误信息，确保书签视图能够正确显示。接着，在控制器中引入书签视图，并实现添加和删除书签的功能。为了解决视图更新时选中底色的问题，更新了DOM渲染逻辑。为了减少代码重复，将生成标记的代码提取到单独的PreviewView中，并在书签视图中直接渲染。最后，通过控制渲染条件，确保搜索结果和书签视图能够正确显示数据。
2025-05-21 10:56:29
337
原创 实现书签-第一部分
本文介绍了如何实现一个书签功能，允许用户收藏菜谱并在书签栏中查看。首先，修复了搜索时页面不重置的BUG，确保每次搜索都从第一页开始。接着，在状态管理中定义了一个空数组来存储书签，并在模型中添加了添加和删除书签的功能。通过事件委托的方式，监听用户点击书签按钮的操作，并在控制器中调用相应的模型方法。此外，还实现了书签样式的动态更新，确保用户点击后视图能够及时刷新。最后，通过检查当前菜谱是否已被书签，确保状态的一致性。本文是书签功能的核心实现，后续将进一步完善书签栏的展示功能。
2025-05-16 21:07:20
342
原创 更新食谱份数
这里我们还会发现一些问题，就是更新DOM的时候现在是全部更新，但是有时候我们不需要全部更新，比如增加份数，我们只需要更新部分的DOM就好，后面的文章我们来解决这样的问题。没问题，当我们将份量手动改为一般的时候，下面的食材的数量也相应的改变；之后我们来测试一下，当我们的份数减半的时候，份量会不会减半。将份量手动修改成4时。
2025-03-26 14:36:39
188
原创 实现分页功能-第一部分
目前我们已经可以将用户的搜索展现到页面上了，但是由于搜索的结果太多了，所以我们来实现分页功能来提高用户的体验；第一部分暂时就到这里了，后面我们将实现分页按钮，来实现页面的切换；这里的page在state中设置为1；
2025-03-21 11:17:18
356
原创 实现搜索功能：第一部分
第一部分到这里基本上就结束了，第二部分我们会将所有的搜索结果渲染到页面的侧边栏中！从本节开始，我们将实现我们的食谱小应用的搜索功能！
2025-03-19 23:00:52
488
原创 实施错误信息和成功信息
就目前我们的错误处理策略的话，就是简单的讲错误打印在控制台中；当然这样是不正确的，而且错误的显示也并非非发生在正确错误的地方；下面我们讲实施搜索的相关功能！
2025-03-18 11:02:00
287
原创 MVC_Publish-Subscriber 模式中的事件处理程序
程序启动时，controlRecipes将被传入addHandlerRender;addHandlerRender会侦听事件（addEventListener）,并使用controlRecipes作为回调；
2025-03-17 15:18:23
447
原创 MVC架构
就像房子一样，软件也需要一个结构: 这是我们组织代码的方式；项目永远没有终点！我们需要能够在未来轻松地对其进行修改。我们还需要可以轻松的添加新功能。
2025-02-26 21:34:56
465
原创 监听load和hashchange事件
本篇将是这个程序的核心功能，但是我们的代码并不是非常的清晰的书写，这时候就要谈谈我们在流程图里面所说的架构了！所以当我们点击切换菜谱的时候只需要在url后面加上菜谱的hash就可以获取到这个菜谱的，那么应该怎么做呢?上篇文章中，我们已经将菜谱的数据给拿到，并且已经可以渲染到页面上，本篇我们将为程序添加一些事件；我们通过之前的API也已经发现了，菜谱的获取是通过URL加上菜谱的hash值也获取到的。外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传。这里我们简单的做一个的返回即可。
2025-02-25 22:59:02
420
原创 使用获取数据渲染食谱
上篇文章我们已经成功请求了API，并且从API中成功了获取了好看的数据，本节我们将获取的数据渲染到用户界面上；注：本项目来自于Jonas Schmedtmann创建，文章仅仅作为学习作用！
2025-02-10 11:04:29
559
1
原创 从API中加载食谱
注:本项目来自于Jonas Schmedtmann创建，文章仅仅作为学习作用！现在食谱已经可以被获取了，下篇文章我们就来将数据渲染到用户界面上！本次项目的初始代码放在了如下的链接，可以自行下载获取；拿到初始代码之后，我们先初始化一下。
2025-02-08 14:30:10
360
原创 项目概述与规划 (I)
JavaScript的学习已经接近尾声了，最后我们将通过一个项目来讲我们在JavaScript中学习到的所有都在这个项目中展现出来，这个项目的DEMO来自于Udemy中的课程，作者是Jonas Schmedtmann；
2025-01-26 21:23:14
412
原创 让我们修复一些糟糕的代码-第二部分
这里我们的修复就算完全解决，和之前的代码相比，我们先是通过一般规则的修复，然后再通过比较现代的函数式的编程方式进行修复；但是请记住，这只是一种规则，并不是一种强制性要求，现实代码中可能并不能实现完全的无副作用的编码方式，我们只是需要利用这些规则来规范的我们写代码的风格，避免出现问题的概率；我们仔细的看一下这个函数，这个函数就不是一个纯函数，它会带来副作用，因为它改变了对象内部的数据。本次就上次的代码进行修复，根据我们上篇文章介绍的函数编程那样；我们可以使用第三方库来实现深度冻结，但这里不再演示；
2025-01-24 13:59:12
288
原创 让我们修复一些糟糕的代码-第一部分
上面的很多修改方法都是按照我们上篇文件来做的，看上去是非常的好的，当然这部分代码虽然看上去比之前好很多了，但是还是有一些问题，在后面的文章中再继续的分享；这段代码实现了一个简单的预算管理系统，可以记录支出并检查是否超出限额，同时提供了对大额支出的统计功能。
2025-01-22 15:35:13
363
原创 Babel 和 Polyfilling
Babel是一个广泛使用的JavaScript编译器，主要用于将最新版本的JavaScript（如ES6、ES7等）转化为向后兼容的版本，以便在旧版浏览器或环境中运行。通过使用Babel，开发者可以利用最新的语言特性，而不必担心兼容性问题。如果使用pracle构建工具，默认就是带Babel的功能；Polyfill是一种代码，通常是JavaScript函数或对象，用于为不支持某些功能的环境提供替代实现。换句话说，polyfill可以让旧环境“补全”新的标准功能。
2025-01-20 10:12:23
364
原创 使用 Parcel 和 NPM 脚本进行打包
Parcel是一个零配置的网页应用程序打包工具，主要用于快速构建现代JavaScript应用。注：在JavaScript中，对象是通过引用传递的。如果您在使用的深度复制方法时，只是复制了对象的引用，之后的修改会影响到原始对象和复制对象。这意味着如果您在热重载时更新了某个模块中的对象，而没有正确处理引用，可能会导致对象内容不断增加。所以如果这不是我们需要的，需要你手动的去初始化对象使用npm脚本启动Parcel是一种常见的做法，可以简化开发和构建过程。然后使用npmstar
2025-01-19 19:49:02
740
原创 NPM简介
NPM（NodePackageManager）是Node.js的包管理工具，用于管理和分享JavaScript代码库。它是世界上最大的开源库生态系统之一。
2025-01-18 21:57:09
702
原创 命令行入门
作为一名Web开发人员，一些打包工具，或者npm这类的工具都需要我们使用命令行，比如一个移动、删除、创建文件夹类的简单的命令一定是要会的；命令还有很多很多，但是目前就介绍这一些常用的，只要你常用这些命令，你就能很快的记住这些命令的；
2025-01-17 19:00:18
213
RCLD-0114 RG-JCOS云管理平台产品日常维护和问题排查(含UDS硬件组件).pptx
2021-04-19
RG-AP系列无线接入点AP_RGOS11.1(5)B9版本Web管理手册(V2.0).pdf
2021-04-14
RCLD-0113 RG-JCOS云管理平台产品常用功能配置(含UDS硬件组件).pptx
2021-04-19
SANGFOR_AC&SG_v6.0_2015年度渠道初级认证培训13_系统诊断工具_上网故障排除丢包模块.xls
2021-04-01
LSI 2308 mpt_SAS2_Windows7_Windows_Server_2008_R2_P20.zip
2021-04-19
CentOs7一直转圈桌面进不去
2023-05-26
TA创建的收藏夹 TA关注的收藏夹
TA关注的人