├── .editorconfig ├── .gitignore ├── .prettierrc ├── .vscode └── settings.json ├── LICENSE ├── README.md ├── bash.exe.stackdump ├── commitlint.config.js ├── docs ├── .vitepress │ ├── cache │ │ └── deps │ │ │ ├── _metadata.json │ │ │ ├── chunk-BQOXFNVW.js │ │ │ ├── chunk-BQOXFNVW.js.map │ │ │ ├── chunk-BUSYA2B4.js │ │ │ ├── chunk-BUSYA2B4.js.map │ │ │ ├── fabric-pure-browser.js │ │ │ ├── fabric-pure-browser.js.map │ │ │ ├── package.json │ │ │ ├── ua-parser-js.js │ │ │ ├── ua-parser-js.js.map │ │ │ ├── vitepress___@vue_devtools-api.js │ │ │ ├── vitepress___@vue_devtools-api.js.map │ │ │ ├── vitepress___@vueuse_core.js │ │ │ ├── vitepress___@vueuse_core.js.map │ │ │ ├── vue-router.js │ │ │ ├── vue-router.js.map │ │ │ ├── vue.js │ │ │ └── vue.js.map │ ├── config │ │ ├── head.js │ │ ├── index.js │ │ ├── nav.js │ │ ├── sidebar.js │ │ └── themeConfig.js │ ├── script │ │ └── pwa.js │ ├── sibeBar │ │ ├── AboutSideBar.js │ │ ├── ArmorySideBar.js │ │ ├── BackEndSideBar.js │ │ ├── BigFrontSideBar.js │ │ ├── BrowserSideBar.js │ │ ├── CSBasicSideBar.js │ │ ├── DesignPatternSideBar.js │ │ ├── DockerSideBar.js │ │ ├── ES6SideBar.js │ │ ├── EngineeredSideBar.js │ │ ├── FrontEndBasicSideBar.js │ │ ├── FrontEndSideBar.js │ │ ├── HttpSideBar.js │ │ ├── InterviewSideBar.js │ │ ├── JSSideBar.js │ │ ├── NodeSideBar.js │ │ ├── PerformanceSideBar.js │ │ ├── ReactSideBar.js │ │ ├── ReadSideBar.js │ │ ├── WebpackSideBar.js │ │ └── index.js │ └── theme │ │ ├── Comment.vue │ │ ├── Layout.vue │ │ ├── components │ │ ├── AsideSponsors.vue │ │ ├── RegisterSW.vue │ │ ├── ReloadPrompt.vue │ │ ├── RoadMap.vue │ │ └── utils.js │ │ ├── index.js │ │ ├── pwa.js │ │ └── quotes.js ├── 404.md ├── About │ ├── index.md │ └── sponsor.md ├── BackEnd │ ├── Go │ │ ├── Go语法基础.md │ │ ├── Go项目学习.md │ │ ├── go-mega.md │ │ ├── index.md │ │ └── 初探Go.md │ ├── MongoDB.md │ ├── Mysql.md │ ├── Mysql数据类型明细表.md │ ├── Postgresql.md │ ├── Python │ │ ├── FastAPI.md │ │ ├── Python.md │ │ ├── Python基础.md │ │ └── index.md │ ├── RESTful.md │ ├── Redis.md │ ├── Ruby │ │ ├── index.md │ │ ├── 前端学Ruby：全栈论坛（地宫）项目一.md │ │ ├── 前端学Ruby：全栈论坛（地宫）项目二.md │ │ ├── 前端学Ruby：唐诗API项目.md │ │ ├── 前端学Ruby：唐诗项目部署优化.md │ │ ├── 前端学Ruby：安装Ruby、Rails.md │ │ ├── 前端学Ruby：熟悉Rails.md │ │ └── 前端学Ruby：熟悉Ruby语法.md │ ├── SQLite.md │ ├── cloudflare │ │ ├── hono+d1做一个服务.md │ │ ├── saas服务.md │ │ └── worker.md │ ├── index.md │ ├── session与JWT.md │ ├── 如何使用二进制文件离线安装Mysql.md │ └── 数据库案例学习.md ├── Basic │ ├── CSS │ │ ├── BFC是什么.md │ │ ├── CSS3新特性.md │ │ ├── flex.md │ │ ├── grid.md │ │ ├── index.md │ │ ├── 动画.md │ │ ├── 圣杯、双飞翼.md │ │ ├── 左图右文布局.md │ │ ├── 左边固定宽，右边自适应.md │ │ ├── 布局.md │ │ ├── 水平垂直居中.md │ │ └── 瀑布流效果.md │ ├── HTML │ │ ├── SEO.md │ │ └── index.md │ ├── JQuery │ │ ├── index.md │ │ ├── 如何设计一个JS插件.md │ │ ├── 手写jQuery.md │ │ ├── 阅读源码.md │ │ └── 高效jQuery.md │ └── index.md ├── Browser │ ├── BOM.md │ ├── DOM.md │ ├── index.md │ ├── localStorage.md │ ├── sse.md │ ├── webworker和websocket.md │ ├── web安全.md │ ├── 事件Api.md │ ├── 事件冒泡.md │ ├── 事件循环.md │ ├── 从url输入到返回请求的过程.md │ ├── 回流与重绘.md │ ├── 浏览器架构.md │ ├── 浏览器的渲染原理.md │ ├── 渲染机制.md │ ├── 渲染进程中的线程.md │ ├── 跨域.md │ └── 面试题 │ │ └── index.md ├── CSBasic │ ├── TCP的那些事儿.md │ ├── index.md │ ├── 从传纸条轻松学习到基础网络概念.md │ ├── 传输层.md │ ├── 大话计算机基础硬核知识.md │ ├── 编程必备基础知识.md │ ├── 计算机中的三大件.md │ ├── 计算机的操作系统.md │ ├── 计算机的组成.md │ ├── 计算机的起源.md │ ├── 计算机网络.md │ ├── 计算机网络传输层篇.md │ ├── 计算机网络应用层篇.md │ ├── 计算机网络网络层篇.md │ └── 进程与线程.md ├── DesignPattern │ ├── MVC模式与MVVM模式.md │ ├── index.md │ ├── 代理模式.md │ ├── 单例模式.md │ ├── 原型模式.md │ ├── 发布订阅模式.md │ ├── 外观模式.md │ ├── 工厂模式.md │ ├── 建造者模式.md │ ├── 构造器模式.md │ ├── 策略模式.md │ ├── 装饰器模式.md │ ├── 观察者模式.md │ ├── 迭代器模式.md │ └── 适配器模式.md ├── DevOps │ ├── Nginx │ │ ├── index.md │ │ └── 常用命令及配置.md │ └── index.md ├── Docker │ ├── docker-compose.md │ ├── dockerfile指令.md │ ├── docker基本介绍.md │ ├── docker实战.md │ ├── docker常见命令.md │ ├── docker的原理.md │ ├── index.md │ ├── 如何安装docker.md │ ├── 实战：docker-jenkins.md │ ├── 实战：dockerfile最小实践.md │ ├── 实战：构建自己的镜像.md │ └── 服务器上安装docker.md ├── ES6 │ ├── Class.md │ ├── ES6完全指南.md │ ├── ES6至ES12的新特性.md │ ├── Iterator&Generator.md │ ├── Let&Const.md │ ├── Map&Set.md │ ├── Promise │ │ ├── Async.md │ │ ├── Promise.md │ │ └── 手写Promise.md │ ├── Proxy.md │ ├── index.md │ ├── 手写模块打包器.md │ ├── 模块化历程.md │ └── 面试题 │ │ ├── Promise面试题.md │ │ └── index.md ├── Engineered │ ├── MicroFrontend │ │ ├── index.md │ │ ├── 微前端调研.md │ │ └── 最容易看懂的微前端知识.md │ ├── Monorepo.md │ ├── SDK │ │ ├── index.md │ │ └── trace.md │ ├── Scaffold │ │ └── index.md │ ├── StandardGuide │ │ ├── CSS规范.md │ │ ├── CodeReview规范.md │ │ ├── VSCode配置.md │ │ ├── git提交规范.md │ │ ├── index.md │ │ ├── 从0到1开发一个开源项目.md │ │ ├── 代码规范.md │ │ ├── 代码规范之-理解ESLint和Prettier和EditorConfig.md │ │ ├── 你给开源项目提过 PR 吗.md │ │ ├── 前端代码规范最佳实践.md │ │ └── 字体设置最佳实践.md │ ├── index.md │ └── 前端工程化简介.md ├── Git │ ├── git工作流程.md │ ├── git提交规范.md │ ├── index.md │ ├── 原理.md │ ├── 工作中使用Git解决问题的场景.md │ ├── 常用命令.md │ └── 教程.md ├── HTTP │ ├── HTTPS.md │ ├── HTTP历史.md │ ├── HTTP报文组成.md │ ├── HTTP是什么.md │ ├── HTTP状态码.md │ ├── HTTP缓存.md │ ├── TCPIP协议及网络分层模型.md │ ├── index.md │ ├── restful.md │ ├── session.md │ ├── 三次握手和四次挥手.md │ ├── 性能优化.md │ └── 面试题 │ │ └── index.md ├── Interview │ ├── book1.md │ ├── book10.md │ ├── book2.md │ ├── book3.md │ ├── book4.md │ ├── book5.md │ ├── book6.md │ ├── book7.md │ ├── book8.md │ ├── book9.md │ ├── index.html │ ├── index.md │ ├── talk │ │ ├── index.md │ │ ├── 你做过什么有亮点的项目吗.md │ │ ├── 如何反问面试官.md │ │ ├── 学习成长原则.md │ │ └── 解决的最难的项目回答模板.md │ └── 五年以上前端面试.md ├── Introduction │ └── index.md ├── JavaScript │ ├── Array.md │ ├── Function.md │ ├── JavaScript中的始皇.md │ ├── JavaScript是什么.md │ ├── JavaScript由什么组成.md │ ├── Object.create.md │ ├── Object.md │ ├── String.md │ ├── TypeScript │ │ ├── TypeScript中的对象与函数.md │ │ ├── TypeScript中的泛型.md │ │ ├── TypeScript中的类型.md │ │ ├── TypeScript中的面向对象.md │ │ ├── TypeScript是什么.md │ │ ├── TypeScript最佳实践.md │ │ ├── TypeScript的数据类型.md │ │ ├── TypeScript的类型兼容.md │ │ ├── TypeScript的类型运算.md │ │ ├── TypeScript的运行与调试.md │ │ ├── TypeScript省流版.md │ │ ├── TypeScript项目配置.md │ │ ├── index.md │ │ └── 面试题.md │ ├── call、apply、bind三大将.md │ ├── index.md │ ├── instanceof——找祖籍.md │ ├── new做了什么.md │ ├── this关键字.md │ ├── 一切皆对象.md │ ├── 以游戏的角度理解继承.md │ ├── 作用域.md │ ├── 作用域与执行上下文.md │ ├── 函数式编程.md │ ├── 原型.md │ ├── 原理 │ │ ├── 0.1加0.2为什么不等于0.3.md │ │ ├── index.md │ │ ├── 图片懒加载.md │ │ ├── 实现模板引擎.md │ │ └── 模拟MVVM的实现.md │ ├── 垃圾回收机制.md │ ├── 循环都来这儿.md │ ├── 执行上下文与调用栈.md │ ├── 拷贝的秘密.md │ ├── 柯里化.md │ ├── 立即执行函数（IIFE）.md │ ├── 继承.md │ ├── 词法环境.md │ ├── 闭包.md │ ├── 防抖与节流.md │ ├── 面试题 │ │ ├── index.md │ │ └── 手写各种源码.md │ └── 高阶 │ │ ├── JavaScript工作机制.md │ │ ├── JavaScript引擎.md │ │ ├── index.md │ │ ├── 如何用JavaScript实现一门编程语言.md │ │ ├── 深入理解JSCore.md │ │ └── 用js写js解析器.md ├── Linux │ ├── index.md │ ├── shell命令大全.md │ ├── 云服务器初始化脚本.md │ ├── 其他命令.md │ ├── 包管理器.md │ ├── 基本概念.md │ ├── 如果我有一台服务器，我会怎么部署.md │ ├── 常用命令.md │ ├── 平民（独立）开发者服务器折腾笔记.md │ ├── 文件目录及权限.md │ ├── 用户和用户组管理.md │ └── 系统目录结构.md ├── Node │ ├── Express.md │ ├── Koa2 │ │ ├── Koa2基础.md │ │ ├── index.md │ │ ├── 实战：Koa2从零到脚手架.md │ │ ├── 实战：vercel部署node服务.md │ │ ├── 实战：李瓶儿博客开发.md │ │ ├── 对比Express、Koa2、Redux.md │ │ ├── 手写Koa2.md │ │ └── 源码分析.md │ ├── Node走马观花.md │ ├── PM2.md │ ├── index.md │ ├── 包管理器.md │ ├── 应用开发 │ │ ├── elme.md │ │ ├── 实战：Redis.md │ │ ├── 实战：realworld项目.md │ │ ├── 实战：serverless-vercel.md │ │ ├── 实战：如何将 Express API 部署到 Vercel.md │ │ ├── 实战：极简做个saas应用.md │ │ ├── 实战：爬虫每日日报.md │ │ └── 实战：聊天室.md │ ├── 技术架构.md │ ├── 文件模块.md │ └── 脚手架.md ├── Performance │ ├── React层面优化.md │ ├── index.md │ ├── web性能优化.md │ ├── 工程化层面优化.md │ ├── 性能优化从零到一.md │ ├── 性能优化指标.md │ ├── 网络层面优化.md │ ├── 面试题.md │ └── 页面渲染层面优化.md ├── React │ ├── Diff.md │ ├── Fiber.md │ ├── Hooks.md │ ├── Hooks实现原理.md │ ├── Hooks踩坑.md │ ├── React快速了解.md │ ├── React版本更新.md │ ├── Ref以及useRef.md │ ├── VirtualDOM.md │ ├── index.md │ ├── setState.md │ ├── useCallback和useMemo.md │ ├── 事件机制.md │ ├── 函数式组件与类组件有何不同.md │ ├── 快问快答setState.md │ ├── 性能优化.md │ ├── 手写 │ │ ├── createElement代码片段.md │ │ ├── index.md │ │ ├── 一文读懂 React 组件渲染核心原理.md │ │ ├── 图解React.md │ │ ├── 手写React.md │ │ ├── 手写hooks.md │ │ ├── 源码中的调度算法.md │ │ └── 源码分析React.md │ ├── 手写自定义Hooks.md │ ├── 生命周期.md │ ├── 生态 │ │ ├── Dva.md │ │ ├── Immutable.md │ │ ├── Mobx.md │ │ ├── ReactRedux.md │ │ ├── ReactRouter.md │ │ ├── Redux-Sage.md │ │ ├── Redux-thunk.md │ │ ├── index.md │ │ ├── 从Redux说起，到手写，再到状态管理.md │ │ └── 状态管理.md │ ├── 里程碑.md │ └── 面试题 │ │ ├── index.md │ │ ├── 代码题.md │ │ └── 渲染十万条数据解决方案.md ├── Read │ ├── book │ │ ├── JavaScript 20 年.md │ │ ├── JavaScript函数式编程.md │ │ ├── JavaScript启示录.md │ │ ├── JavaScript权威指南.md │ │ ├── JavaScript框架设计.md │ │ ├── JavaScript语言精粹.md │ │ ├── JavaScript高级程序编程第四版.md │ │ ├── UNIX编程艺术.md │ │ ├── index.md │ │ ├── 凤凰项目：一个IT运维的创奇故事.md │ │ ├── 程序员修炼之道.md │ │ └── 黑客与画家.md │ ├── code │ │ ├── Jquery.md │ │ ├── Redux.md │ │ ├── Underscore.md │ │ ├── index.md │ │ └── isType.md │ └── course │ │ ├── JavaScript设计模式核⼼原理与应⽤实践.md │ │ ├── Web开发工程师必学.md │ │ ├── index.md │ │ ├── 前端算法与数据结构面试.md │ │ ├── 透视HTTP协议.md │ │ └── 重学前端.md ├── WebApp │ ├── 1px问题.md │ ├── Flutter │ │ ├── Bloc.md │ │ ├── Dart语法.md │ │ ├── FlutterTeach.md │ │ ├── Flutter理论知识了解.md │ │ ├── Widget.md │ │ ├── index.md │ │ ├── 使用 Flutter 构建一个名言名句应用程序.md │ │ ├── 快速入门Flutter开发.md │ │ └── 杂.md │ ├── H5营销页面总结.md │ ├── H5页面的适配方案.md │ ├── Hybrid.md │ ├── JSBridge.md │ ├── MiniApp │ │ └── index.md │ ├── PWA.md │ ├── ReactNative │ │ └── index.md │ ├── WeChat │ │ ├── index.md │ │ ├── 微信服务端开发.md │ │ ├── 微信网页开发之JS-SDK.md │ │ ├── 微信网页开发之常见问题.md │ │ └── 微信网页授权.md │ ├── flexible源码解析.md │ ├── index.md │ ├── mobileHack.md │ ├── offset、scroll、client.md │ ├── webview.md │ ├── 一个简洁、有趣的无限下拉方案.md │ ├── 分辨率浅析.md │ ├── 常见问题.md │ ├── 我常用的webApp开发规范.md │ ├── 滚动穿透.md │ ├── 移动端真机调试指南.md │ ├── 缓动动画.md │ ├── 网页长按保存图片及识别二维码.md │ ├── 软键盘问题汇总以及解决方案.md │ └── 适配方案.md ├── index.md ├── public │ ├── 26fbeced23574b0684d3e4ec7e00cd8c.txt │ ├── android-chrome-128x128.png │ ├── android-chrome-192x192.png │ ├── android-chrome-512x512.png │ ├── android-chrome-96x96.png │ ├── apple-touch-icon.png │ ├── baidu_verify_codeva-nBcDOxSAzM.html │ ├── browserconfig.xml │ ├── c9b5b596facb463bbc3f1f64797023db.txt │ ├── favicon-16x16.png │ ├── favicon-32x32.png │ ├── favicon.ico │ ├── favicon1.ico │ ├── images │ │ ├── Algorithm │ │ │ └── 算法和数据结构.png │ │ ├── Browser │ │ │ ├── 2021chrome浏览器架构.png │ │ │ ├── 2021edge浏览器架构.png │ │ │ ├── CSS-Rule-Tree-Example.jpg │ │ │ ├── DOM-Tree-01.jpg │ │ │ ├── DOM-Tree-02.jpg │ │ │ ├── DOM-Tree-Example.jpg │ │ │ ├── Firefox-style-context-tree.png │ │ │ ├── Render-Process-Skipping.jpg │ │ │ ├── chrome浏览器架构.png │ │ │ ├── 从输入url到渲染起始图.png │ │ │ ├── 从输入url到渲染过程图.png │ │ │ ├── 未来chrome浏览器架构.png │ │ │ ├── 浏览器架构.png │ │ │ └── 浏览器渲染大致流程.jpg │ │ ├── CSBasic │ │ │ └── 计算机发展历史.png │ │ ├── CSS │ │ │ ├── BFC1.png │ │ │ ├── BFC2.png │ │ │ └── BFC_margin.png │ │ ├── DataStructure │ │ │ ├── 复杂度量级.jpg │ │ │ ├── 数据结构思维导图.jpg │ │ │ └── 时间复杂度.png │ │ ├── Deploy │ │ │ ├── 修改安全配置.png │ │ │ └── 阿里云网关配置.png │ │ ├── DesignPattern │ │ │ ├── 23种设计模式.jpg │ │ │ └── 装饰器示例.png │ │ ├── Docker │ │ │ ├── VM与docker对比.jpg │ │ │ ├── docker_build.png │ │ │ ├── docker_inspect.png │ │ │ ├── docker_pull.png │ │ │ ├── docker_run.png │ │ │ ├── docker_version.png │ │ │ ├── docker_version_window.png │ │ │ ├── dockerfile最小实现 │ │ │ │ ├── docker_build.png │ │ │ │ ├── docker_pull.png │ │ │ │ ├── docker_push.png │ │ │ │ ├── dockerfile_脚本.png │ │ │ │ ├── lrzsz上传镜像.png │ │ │ │ ├── 导入镜像.png │ │ │ │ └── 导出镜像.png │ │ │ ├── dockerhub.png │ │ │ ├── docker架构图.jpg │ │ │ ├── docker结构.jpg │ │ │ ├── jenkins │ │ │ │ ├── docker_jenkins下载ssh插件.png │ │ │ │ ├── docker_jenkins创建账号.png │ │ │ │ ├── docker_jenkins安装node插件.png │ │ │ │ ├── docker_jenkins安装node插件1.png │ │ │ │ ├── docker_jenkins安装推荐的插件.png │ │ │ │ ├── docker_jenkins换源.png │ │ │ │ ├── docker_jenkins新手.png │ │ │ │ ├── docker_jenkins设置服务器上的ssh.png │ │ │ │ ├── docker_jenkins配置ssh1.png │ │ │ │ ├── docker_jenkins配置ssh2.png │ │ │ │ ├── jenkins任务描述1.png │ │ │ │ ├── jenkins任务描述2.png │ │ │ │ ├── jenkins任务描述3.png │ │ │ │ ├── jenkins任务描述4.png │ │ │ │ ├── jenkins任务描述5.png │ │ │ │ ├── jenkins控制台输出.png │ │ │ │ ├── jenkins新建任务.png │ │ │ │ ├── jenkins立即构建.png │ │ │ │ ├── jenkins起任务名字.png │ │ │ │ └── jenkins部署成功.png │ │ │ ├── repository、image和container.png │ │ │ ├── set_linux环境.png │ │ │ ├── 虚拟机和容器.jpg │ │ │ ├── 虚拟机结构.jpg │ │ │ └── 通过dockerfile生成的image.png │ │ ├── ES6 │ │ │ ├── Map构造函数结构.png │ │ │ └── symbol不能作为构造函数使用.png │ │ ├── Flutter │ │ │ └── statefulwidget生命周期.png │ │ ├── Git │ │ │ └── 工作区域.jpg │ │ ├── HTTP │ │ │ ├── HTTP三次握手.png │ │ │ ├── HTTP报文格式.png │ │ │ ├── TCP与UDP.jpg │ │ │ ├── 在nginx中配置https.png │ │ │ ├── 浏览器输入URL后HTTP请求返回的完整过程.png │ │ │ ├── 缓存验证Last-Modified和Etag的使用.png │ │ │ ├── 网络协议分层.png │ │ │ └── 透视HTTP知识地图.png │ │ ├── JavaScript │ │ │ ├── Array │ │ │ │ ├── 查看Array数据结构.png │ │ │ │ └── 自己写的Array.png │ │ │ ├── Object.create显示原型继承.png │ │ │ ├── dobounce.png │ │ │ ├── function的定义.png │ │ │ ├── new之后的user.png │ │ │ ├── proto.png │ │ │ ├── prototype与proto.png │ │ │ ├── prototype屏蔽继承数据能力迎合class.png │ │ │ ├── prototype继承数据.png │ │ │ ├── setPrototypeOf显式绑定原型.png │ │ │ ├── throttle1.gif │ │ │ ├── throttle2.gif │ │ │ ├── throttle3.gif │ │ │ ├── 作用域-隐形作用域.png │ │ │ ├── 作用域.png │ │ │ ├── 原型.png │ │ │ ├── 原型proto.png │ │ │ ├── 原型proto历史.png │ │ │ ├── 原型默认继承.png │ │ │ ├── 在chrome中查看执行上下文栈.png │ │ │ ├── 基于createInstance的user对象.png │ │ │ ├── 如何查看执行上下文栈.png │ │ │ ├── 执行上下文-example.png │ │ │ ├── 执行上下文中的词法环境.png │ │ │ ├── 执行上下文周期.png │ │ │ ├── 执行上下文的构成.png │ │ │ ├── 执行代码周期.png │ │ │ ├── 改变proto的值.png │ │ │ ├── 数据类型分类.png │ │ │ ├── 显示原型继承.png │ │ │ ├── 类型存储.png │ │ │ ├── 继承.png │ │ │ ├── 词法作用域-example.png │ │ │ ├── 词法环境-词法作用域example.png │ │ │ ├── 词法环境.png │ │ │ ├── 语言坐标轴.png │ │ │ ├── 隐式引用.png │ │ │ └── 面向对象思维导图.png │ │ ├── Linux │ │ │ ├── distro_family.jpg │ │ │ ├── figlet.png │ │ │ ├── release.png │ │ │ └── whatis.png │ │ ├── Performance │ │ │ └── 监听视窗激活状态.gif │ │ ├── Serverless │ │ │ └── 定义.png │ │ ├── WeChat │ │ │ └── 监听点击事件.png │ │ ├── golang │ │ │ └── VScode安装插件.png │ │ ├── sponsor │ │ │ └── xiaobot.png │ │ └── webApp │ │ │ └── 大厂-拼多多适配.png │ ├── logo.png │ ├── logo.webp │ ├── logo1.png │ ├── mstile-150x150.png │ ├── og.jpg │ ├── qrcode.jpg │ ├── robots.txt │ ├── safari-pinned-tab.svg │ ├── shenma-site-verification.txt │ ├── site.webmanifest │ └── site_logo.png └── webpack │ ├── index.md │ ├── loader以及原理解析.md │ ├── vite.md │ ├── webpack其他文章.md │ ├── 工程化、Babel、AST.md │ ├── 手写plugin.md │ ├── 手写webpack.md │ └── 面试题 │ └── index.md └── package.json /.editorconfig: -------------------------------------------------------------------------------- 1 | # http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | indent_style = space 6 | indent_size = 4 7 | end_of_line = lf 8 | charset = utf-8 9 | trim_trailing_whitespace = true 10 | insert_final_newline = true 11 | 12 | [*.md] 13 | trim_trailing_whitespace = false 14 | 15 | [Makefile] 16 | indent_style = tab 17 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | 2 | node_modules* 3 | docs/.vitepress/dist 4 | docs/.vitepress/.cache 5 | docs/.vitepress/.temp 6 | 7 | yarn.lock 8 | yarn-error.log 9 | 10 | pnpm.yaml 11 | pnpm-lock.yaml 12 | 13 | .vercel 14 | .env 15 | -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "singleQuote": true, 3 | "trailingComma": "all", 4 | "printWidth": 100, 5 | "overrides": [ 6 | { 7 | "files": ".prettierrc", 8 | "options": { "parser": "json" } 9 | } 10 | ] 11 | } 12 | -------------------------------------------------------------------------------- /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "cSpell.words": [ 3 | "birpc", 4 | "unmock" 5 | ], 6 | "editor.formatOnSave": true, 7 | "[json]": { 8 | "editor.formatOnSave": false 9 | }, 10 | "[markdown]": { 11 | "editor.formatOnSave": false 12 | }, 13 | "prettier.enable": false 14 | } 15 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2022 JohnnyJoestar 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /bash.exe.stackdump: -------------------------------------------------------------------------------- 1 | Stack trace: 2 | Frame Function Args 3 | 000005FF160 00210062B0E (002102986E2, 00210275E3E, 0000000005E, 000005FACC0) 4 | 000005FF160 0021004846A (00000000000, 00000000000, 7FFE00000000, 00000001000) 5 | 000005FF160 002100484A2 (00000000000, 000000005AF, 0000000005E, 00000000000) 6 | 000005FF160 002100DA798 (00000000000, 00200000000, 002102759F2, 000005FBE0C) 7 | 000005FF160 00210133477 (00000000000, 0021022B110, 0021022B100, 000005FDDE0) 8 | 000005FF160 002100488B4 (00210317960, 000005FDDE0, 00000000000, 00000000000) 9 | 000005FF160 0021004A01F (0007FFE0384, 00000000000, 00000000000, 00000000000) 10 | 000005FF160 002100DB7D8 (00000000000, 000006C36C4, 00000000000, 00000000000) 11 | 000005FF400 7FFE6ABD8B7F (00210040000, 00000000001, 00000000000, 7FFE6ACE8990) 12 | 000005FF400 7FFE6AC1D51D (000005FF300, 00000000000, 000006CB2B8, 00000000001) 13 | 000005FF400 7FFE6AC1D2CE (000006C3630, 000005FF400, 000006C8A50, 00000000000) 14 | 000005FF400 7FFE6AC1D340 (7FFE6ACEB760, 00000000000, 000003DF000, 7FFE00000000) 15 | 00000000000 7FFE6AC8EBC9 (00000000000, 00000000000, 00000000001, 00000000000) 16 | 00000000000 7FFE6AC7A86E (7FFE6ABB0000, 000003DF050, 000003E17EE, 00000000000) 17 | 00000000000 7FFE6AC24383 (00000000000, 000005FFAD0, 00000000000, 00000000000) 18 | 00000000000 7FFE6AC242AE (00000000000, 000005FFAD0, 00000000000, 00000000000) 19 | End of stack trace 20 | -------------------------------------------------------------------------------- /commitlint.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { extends: ['@commitlint/config-conventional'] }; 2 | -------------------------------------------------------------------------------- /docs/.vitepress/cache/deps/chunk-BUSYA2B4.js: -------------------------------------------------------------------------------- 1 | var __getOwnPropNames = Object.getOwnPropertyNames; 2 | var __commonJS = (cb, mod) => function __require() { 3 | return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports; 4 | }; 5 | 6 | export { 7 | __commonJS 8 | }; 9 | //# sourceMappingURL=chunk-BUSYA2B4.js.map 10 | -------------------------------------------------------------------------------- /docs/.vitepress/cache/deps/chunk-BUSYA2B4.js.map: -------------------------------------------------------------------------------- 1 | { 2 | "version": 3, 3 | "sources": [], 4 | "sourcesContent": [], 5 | "mappings": "", 6 | "names": [] 7 | } 8 | -------------------------------------------------------------------------------- /docs/.vitepress/cache/deps/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "type": "module" 3 | } 4 | -------------------------------------------------------------------------------- /docs/.vitepress/cache/deps/vue.js.map: -------------------------------------------------------------------------------- 1 | { 2 | "version": 3, 3 | "sources": [], 4 | "sourcesContent": [], 5 | "mappings": "", 6 | "names": [] 7 | } 8 | -------------------------------------------------------------------------------- /docs/.vitepress/config/nav.js: -------------------------------------------------------------------------------- 1 | export default [ 2 | { text: 'Introduction', link: '/Introduction/' }, 3 | { text: 'JavaScript', link: '/JavaScript/' }, 4 | { text: 'React', link: '/React/' }, 5 | { text: 'Interview', link: '/Interview/' }, 6 | { text: 'BackEnd', link: '/BackEnd/' }, 7 | { 8 | text: 'BigFront', items: [ 9 | { text: 'WebApp', link: '/WebApp/' }, 10 | { text: 'ES6', link: '/ES6/' }, 11 | { text: 'Browser', link: '/Browser/' }, 12 | { text: 'HTTP', link: '/HTTP/' }, 13 | { text: 'Performance', link: '/Performance/' }, 14 | { text: 'Basic', link: '/Basic/' }, 15 | ], 16 | }, 17 | { 18 | text: 'More', 19 | items: [ 20 | { 21 | items: [ 22 | // { 23 | // text: '数据结构与算法', 24 | // link: 'https://github.com/johanazhu/leetcode', 25 | // }, 26 | { text: 'Docker', link: '/Docker/' }, 27 | { text: 'Linux', link: '/Linux/' }, 28 | { text: 'Git', link: '/Git/' }, 29 | // { text: 'DesignPattern', link: '/DesignPattern/' }, 30 | // { text: 'CSBasic', link: '/CSBasic/' }, 31 | { text: 'About', link: '/About/' }, 32 | ] 33 | } 34 | ] 35 | }, 36 | ]; 37 | -------------------------------------------------------------------------------- /docs/.vitepress/config/sidebar.js: -------------------------------------------------------------------------------- 1 | import { 2 | AboutSideBar, 3 | ArmorySideBar, 4 | BackEndSideBar, 5 | BigFrontSideBar, 6 | BrowserSideBar, 7 | CSBasicSideBar, 8 | DesignPatternSideBar, 9 | DockerSideBar, 10 | EngineeredSideBar, 11 | ES6SideBar, 12 | FrontEndBasicSideBar, 13 | FrontEndSideBar, 14 | HttpSideBar, 15 | InterviewSideBar, 16 | JSSideBar, 17 | NodeSideBar, 18 | PerformanceSideBar, 19 | ReactSideBar, 20 | ReadSideBar, 21 | WebpackSideBar, 22 | } from '../sibeBar'; 23 | 24 | export default { 25 | '/Interview': InterviewSideBar(), 26 | '/JavaScript': JSSideBar(), 27 | '/TypeScript': JSSideBar(), 28 | '/ES6': ES6SideBar(), 29 | '/Browser': BrowserSideBar(), 30 | '/Performance': PerformanceSideBar(), 31 | '/React': ReactSideBar(), 32 | 33 | '/Node': NodeSideBar(), 34 | 35 | '/BackEnd': BackEndSideBar(), 36 | 37 | '/webpack': WebpackSideBar(), 38 | 39 | '/WebApp': BigFrontSideBar(), 40 | '/Flutter': BigFrontSideBar(), 41 | 42 | '/Basic': FrontEndBasicSideBar(), 43 | 44 | '/HTTP': HttpSideBar(), 45 | '/Docker': DockerSideBar(), 46 | 47 | '/Git': ArmorySideBar(), 48 | '/Linux': ArmorySideBar(), 49 | '/DevOps': ArmorySideBar(), 50 | 51 | '/Engineered': EngineeredSideBar(), 52 | '/MicroFrontend': EngineeredSideBar(), 53 | '/StandardGuide': EngineeredSideBar(), 54 | 55 | '/DesignPattern': DesignPatternSideBar(), 56 | '/CSBasic': CSBasicSideBar(), 57 | '/Read': ReadSideBar(), 58 | '/About': AboutSideBar(), 59 | '/Others': AboutSideBar(), 60 | '/Introduction': FrontEndSideBar(), 61 | }; 62 | -------------------------------------------------------------------------------- /docs/.vitepress/sibeBar/AboutSideBar.js: -------------------------------------------------------------------------------- 1 | export default function AboutSideBar() { 2 | return [ 3 | { 4 | text: '关于', 5 | collapsable: false, 6 | sidebarDepth: 0, 7 | items: [ 8 | { 9 | text: '关于本网站', 10 | link: '/About/', 11 | }, 12 | { 13 | text: '赞助本网站', 14 | link: '/About/sponsor', 15 | }, 16 | ], 17 | }, 18 | // { 19 | // text: '术与道', 20 | // collapsable: false, 21 | // sidebarDepth: 0, 22 | // items: [ 23 | // { 24 | // text: '软实力', 25 | // link: '/Others/', 26 | // }, 27 | // { 28 | // text: '代码和人生', 29 | // link: '/Others/代码和人生', 30 | // }, 31 | // { 32 | // text: '个人发展', 33 | // link: '/Others/个人发展', 34 | // }, 35 | // { 36 | // text: '学习原则', 37 | // link: '/Others/学习原则', 38 | // }, 39 | // { 40 | // text: '知识与技能', 41 | // link: '/Others/知识与技能', 42 | // }, 43 | // ], 44 | // }, 45 | ]; 46 | } 47 | -------------------------------------------------------------------------------- /docs/.vitepress/sibeBar/CSBasicSideBar.js: -------------------------------------------------------------------------------- 1 | export default function CSBasicSideBar() { 2 | return [ 3 | { 4 | text: '计算机基础', 5 | collapsable: false, 6 | sidebarDepth: 0, 7 | items: [ 8 | { 9 | text: '计算机基础导航', 10 | link: '/CSBasic/', 11 | }, 12 | { 13 | text: '计算机的起源', 14 | link: '/CSBasic/计算机的起源', 15 | }, 16 | { 17 | text: '计算机的组成', 18 | link: '/CSBasic/计算机的组成', 19 | }, 20 | // 操作系统基础篇 21 | { 22 | text: '计算机网络传输层篇', 23 | link: '/CSBasic/计算机网络传输层篇', 24 | }, 25 | { 26 | text: '计算机网络网络层篇', 27 | link: '/CSBasic/计算机网络网络层篇', 28 | }, 29 | { 30 | text: '计算机网络应用层篇', 31 | link: '/CSBasic/计算机网络应用层篇', 32 | }, 33 | { 34 | text: '计算机的操作系统', 35 | link: '/CSBasic/计算机的操作系统', 36 | }, 37 | { 38 | text: '计算机中的三大件', 39 | link: '/CSBasic/计算机中的三大件', 40 | }, 41 | { 42 | text: '编程必备基础知识', 43 | link: '/CSBasic/编程必备基础知识', 44 | }, 45 | { 46 | text: 'TCP的那些事儿', 47 | link: '/CSBasic/TCP的那些事儿', 48 | }, 49 | ], 50 | }, 51 | ]; 52 | } 53 | -------------------------------------------------------------------------------- /docs/.vitepress/sibeBar/DockerSideBar.js: -------------------------------------------------------------------------------- 1 | export default function DockerSideBar() { 2 | return [ 3 | { 4 | text: 'Docker', 5 | collapsable: false, 6 | sidebarDepth: 0, 7 | items: [ 8 | { 9 | text: 'Docker导航', 10 | link: '/Docker/', 11 | }, 12 | { 13 | text: 'docker基本介绍', 14 | link: '/Docker/docker基本介绍', 15 | }, 16 | { 17 | text: '如何安装docker', 18 | link: '/Docker/如何安装docker', 19 | }, 20 | { 21 | text: 'docker常见命令', 22 | link: '/Docker/docker常见命令', 23 | }, 24 | { 25 | text: 'docker的原理', 26 | link: '/Docker/docker的原理', 27 | }, 28 | { 29 | text: 'dockerfile指令', 30 | link: '/Docker/dockerfile指令', 31 | }, 32 | { 33 | text: 'docker-compose', 34 | link: '/Docker/docker-compose', 35 | }, 36 | { 37 | text: '实战：构建自己的镜像', 38 | link: '/Docker/实战：构建自己的镜像', 39 | }, 40 | { 41 | text: '实战：dockerfile最小实践', 42 | link: '/Docker/实战：dockerfile最小实践', 43 | }, 44 | { 45 | text: '实战：docker-jenkins', 46 | link: '/Docker/实战：docker-jenkins', 47 | }, 48 | ], 49 | }, 50 | ]; 51 | } 52 | -------------------------------------------------------------------------------- /docs/.vitepress/sibeBar/HttpSideBar.js: -------------------------------------------------------------------------------- 1 | export default function HTTPSideBar() { 2 | return [ 3 | { 4 | text: '常见面试题', 5 | collapsable: false, 6 | sidebarDepth: 0, 7 | items: [ 8 | { 9 | text: '常见面试题', 10 | link: '/HTTP/面试题/', 11 | }, 12 | ], 13 | }, 14 | { 15 | text: 'HTTP', 16 | collapsable: false, 17 | sidebarDepth: 0, 18 | items: [ 19 | { 20 | text: 'HTTP导航', 21 | link: '/HTTP/', 22 | }, 23 | { 24 | text: 'HTTP是什么', 25 | link: '/HTTP/HTTP是什么', 26 | }, 27 | { 28 | text: 'TCPIP协议及网络分层模型', 29 | link: '/HTTP/TCPIP协议及网络分层模型', 30 | }, 31 | { 32 | text: '三次握手和四次挥手', 33 | link: '/HTTP/三次握手和四次挥手', 34 | }, 35 | { 36 | text: 'HTTP报文组成', 37 | link: '/HTTP/HTTP报文组成', 38 | }, 39 | { 40 | text: 'HTTP缓存', 41 | link: '/HTTP/HTTP缓存', 42 | }, 43 | { 44 | text: 'HTTP状态码', 45 | link: '/HTTP/HTTP状态码', 46 | }, 47 | { 48 | text: 'HTTPS', 49 | link: '/HTTP/HTTPS', 50 | }, 51 | // '/HTTP/web安全.md', 52 | // '/HTTP/RESTful.md', 53 | // '/HTTP/session.md', 54 | ], 55 | }, 56 | ]; 57 | } 58 | -------------------------------------------------------------------------------- /docs/.vitepress/sibeBar/PerformanceSideBar.js: -------------------------------------------------------------------------------- 1 | export default function PerformanceSideBar() { 2 | return [ 3 | { 4 | text: '常见面试题', 5 | collapsable: false, 6 | sidebarDepth: 0, 7 | items: [ 8 | { 9 | text: '常见面试题', 10 | link: '/Performance/面试题/', 11 | }, 12 | ], 13 | }, 14 | { 15 | text: '性能优化', 16 | collapsable: false, 17 | sidebarDepth: 0, 18 | items: [ 19 | { 20 | text: '性能优化导航', 21 | link: '/Performance/', 22 | }, 23 | { 24 | text: '网络层面优化', 25 | link: '/Performance/网络层面优化', 26 | }, 27 | { 28 | text: '工程化层面优化', 29 | link: '/Performance/工程化层面优化', 30 | }, 31 | { 32 | text: 'React层面优化', 33 | link: '/Performance/React层面优化', 34 | }, 35 | { 36 | text: '页面渲染层面优化', 37 | link: '/Performance/页面渲染层面优化', 38 | }, 39 | { 40 | text: '性能优化从零到一', 41 | link: '/Performance/性能优化从零到一', 42 | }, 43 | { 44 | text: '性能优化指标', 45 | link: '/Performance/性能优化指标', 46 | }, 47 | ], 48 | }, 49 | ]; 50 | } 51 | -------------------------------------------------------------------------------- /docs/.vitepress/sibeBar/WebpackSideBar.js: -------------------------------------------------------------------------------- 1 | export default function webpackSideBar() { 2 | return [ 3 | { 4 | text: '常见面试题', 5 | collapsable: false, 6 | sidebarDepth: 0, 7 | items: [ 8 | { 9 | text: '常见面试题', 10 | link: '/webpack/面试题/', 11 | }, 12 | ], 13 | }, 14 | { 15 | text: 'webpack', 16 | collapsable: false, 17 | sidebarDepth: 0, 18 | items: [ 19 | { 20 | text: 'webpack导航', 21 | link: '/webpack/', 22 | }, 23 | { 24 | text: '工程化、Babel、AST', 25 | link: '/webpack/工程化、Babel、AST', 26 | }, 27 | { 28 | text: 'loader以及原理解析', 29 | link: '/webpack/loader以及原理解析', 30 | }, 31 | { 32 | text: '手写plugin', 33 | link: '/webpack/手写plugin', 34 | }, 35 | { 36 | text: '手写webpack', 37 | link: '/webpack/手写webpack', 38 | }, 39 | { 40 | text: 'webpack其他文章', 41 | link: '/webpack/webpack其他文章', 42 | }, 43 | { 44 | text: 'vite', 45 | link: '/webpack/vite', 46 | }, 47 | ], 48 | } 49 | ]; 50 | } 51 | -------------------------------------------------------------------------------- /docs/.vitepress/sibeBar/index.js: -------------------------------------------------------------------------------- 1 | import AboutSideBar from './AboutSideBar'; 2 | import ArmorySideBar from './ArmorySideBar'; 3 | import BackEndSideBar from './BackEndSideBar'; 4 | import BigFrontSideBar from './BigFrontSideBar'; 5 | import BrowserSideBar from './BrowserSideBar'; 6 | import CSBasicSideBar from './CSBasicSideBar'; 7 | import DesignPatternSideBar from './DesignPatternSideBar'; 8 | import DockerSideBar from './DockerSideBar'; 9 | import EngineeredSideBar from './EngineeredSideBar'; 10 | import ES6SideBar from './ES6SideBar'; 11 | import FrontEndBasicSideBar from './FrontEndBasicSideBar'; 12 | import FrontEndSideBar from './FrontEndSideBar'; 13 | import HttpSideBar from './HttpSideBar'; 14 | import InterviewSideBar from './InterviewSideBar'; 15 | import JSSideBar from './JSSideBar'; 16 | import NodeSideBar from './NodeSideBar'; 17 | import PerformanceSideBar from './PerformanceSideBar'; 18 | import ReactSideBar from './ReactSideBar'; 19 | import ReadSideBar from './ReadSideBar'; 20 | import WebpackSideBar from './WebpackSideBar'; 21 | 22 | export { 23 | AboutSideBar, 24 | ArmorySideBar, 25 | BackEndSideBar, 26 | BigFrontSideBar, 27 | BrowserSideBar, 28 | CSBasicSideBar, 29 | DesignPatternSideBar, 30 | DockerSideBar, 31 | EngineeredSideBar, 32 | ES6SideBar, 33 | FrontEndBasicSideBar, 34 | FrontEndSideBar, 35 | HttpSideBar, 36 | InterviewSideBar, 37 | JSSideBar, 38 | NodeSideBar, 39 | PerformanceSideBar, 40 | ReactSideBar, 41 | ReadSideBar, 42 | WebpackSideBar, 43 | }; 44 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/Comment.vue: -------------------------------------------------------------------------------- 1 | 17 | 20 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/pwa.js: -------------------------------------------------------------------------------- 1 | // import { registerSW } from 'virtual:pwa-register' 2 | 3 | // registerSW({ immediate: true }) 4 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/quotes.js: -------------------------------------------------------------------------------- 1 | 2 | const Quotes = [ 3 | '酒肉穿肠过 ，佛祖心中留， 世人若学我，如同进魔道。', 4 | '往者不可谏，来者犹可追', 5 | '像我们这样的大族人家，若从外头杀来，一时是杀不死的，必须先从家里自杀自灭起来，才能一败涂地', 6 | '母弱出商贾，父强做侍郎，族望留原籍，家贫走他乡', 7 | '找一个真正好的人，而不是喜欢你的人，才能长久。因为喜欢会变，但一个人的底色是长久不变的（多看看他怎么和家人、朋友相处的），就能知晓', 8 | '善战者无赫赫之功，善医者无煌煌之名', 9 | '不平则鸣，有骨气；不平则怨，没出息', 10 | '骏马常驮痴汉走，巧妻常伴拙夫眠', 11 | '天子之怒，伏尸百万，流血千里。布衣之怒，亦免冠徒跣，以头抢地耳', 12 | '年少不懂曲中意，读懂已是曲中人', 13 | '生活上要知足，学习上要不知足，工作上要知不足', 14 | '人与人的区别不是”受过教育“和”没受过教育“，而是”喜欢阅读“和”不喜欢阅读“ ', 15 | '如果你有强烈的好奇心，祝贺你，你的智力胃口很好！', 16 | '即使没有上帝，也要创造一个', 17 | '你应该更严格地对待身体，使它不至于不顺从你的思想', 18 | '得一个后果不算严重的慢性病，是确保健康长寿的最好方式', 19 | '万事无他，唯手熟尔', 20 | '山河已无恙，吾辈当自强', 21 | '权力的实质不是你能做你想做的事，而是你可以让别人做他不想做的事。', 22 | '我生来就是高山而非溪流，我欲于群峰之巅俯视平庸的沟壑。我生来就是人杰而非草芥，我站在伟人之肩藐视卑微的懦夫。', 23 | '坚持马克思主义，坚持其活的灵魂——实事求是。', 24 | '真正的有趣是你觉得世界有趣，而假的有趣是你只觉得自己有趣', 25 | '人把自己置身于忙碌当中，有一种麻木的踏实，但丧失了真实。什么是真实？你看到什么、听到什么、做什么、和谁在一起，有一种从心灵深处满溢出来的不懊悔，也不羞耻的平和与喜悦。', 26 | '仗义每多屠狗辈，负心多是读书人', 27 | '你还很年轻，将来你会遇到很多人，经历很多事，得到很多，也会失去很多，但无论如何，有两样东西，你绝不能丢弃，一个叫良心，一个叫理想。', 28 | '成功只有一个——按照自己的方式，去度过人生', 29 | '时代的水流漫过了每一只筏子，浸湿了我们的脚，而大雨迟早要来', 30 | '当混浊变成一种常态，清白也会是一种罪行', 31 | '我给自己规定的责任，不管是对还是错，好比一棵结实的大树，任它雨暴风狂，我也会有所依靠。我有过动摇，左晃右晃，因为我毕竟只是一个人……但我并未被刮走。', 32 | '优于别人，并不高贵，真正的高贵应该是优于过去的自己', 33 | '比较是万恶之源，而恶会受到到惩罚 ', 34 | '除了担心，嫉妒也许是不幸福的最大原因之一', 35 | '费尽周折才得到某样东西的人，比轻轻轻松就得到的人，对这件东西往往更为珍视。', 36 | '人境遇的改变往往是非线性的。积累和等待的过程很难熬，这是很多人无法改变的原因之一', 37 | '我们塑造了工具，而后工具也在塑造我们' 38 | ] 39 | 40 | let randomIndex = Math.floor(Math.random() * Quotes.length); 41 | 42 | let randomItem = Quotes[randomIndex]; 43 | 44 | export default randomItem 45 | -------------------------------------------------------------------------------- /docs/404.md: -------------------------------------------------------------------------------- 1 | 2 | 我迷路了 3 | -------------------------------------------------------------------------------- /docs/About/index.md: -------------------------------------------------------------------------------- 1 | # 关于本网站 2 | 3 | 很多技术书会随着技术的变革而过时，往往在 3、4 年后，因为技术的迭代，书的内容就过时了，从而导致书读完却没什么用 4 | 5 | 如今是信息时代，知识是需要更新的，以前我们学习 JavaScript，也许只需要关心闭包，原型链等难点，但现在各种框架的诞生，以及 ES6 的普及，各种 UI 框架，跨平台应用的出现，一个前端所要掌握的技能远远不止这些 6 | 7 | 知识在变化，在流动，构建自己知识体系的时候，要记住知识不是一蹴而就的，总有原因，因为这个或那个缺点，导致你用新的东西，新的东西是为了解决效率问题，不然，它必然被淘汰 8 | 9 | 比如在 es module 还不主流时，amd 和 cmd 由社区大神开发，但 es module 慢慢被圈子接受时，这两种模块的使命就完成了 10 | 11 | 我记得一次面试中，面试官问 你知道 amd 模块原理是什么吗？当时我工作刚满 2 年（2018年），知道 amd 模块，也知道 amd 和 cmd 的区别，但是没深入研究过，加上其他问题，结果是面试没通过 12 | 13 | 反思一下，这真的是我的错吗？前端技术迭代这么快，你问一个老技术问题是不是你的问题呢？ 14 | 15 | 技术面试面的到底是什么， Vue/React 源码？还是性能优化、算法，这些能体现一个程序员的什么能力 16 | 17 | 我很好奇，一个高级前端的标准是什么，是对源码的理解，还是 github star 数量，还是说背诵八股文？ 18 | 19 | 只要我都回答好面试官的问题了，那就能通过了，那对口才不好的人是不是一种筛选 20 | 21 | 我已经八年前端了，在去年就开始转行做全栈开发，想着35岁噩梦也离自己越来越近，到底怎么才能避免内卷与面试呢 22 | 23 | 本网站的核心是对前端知识的整合，其中包括多本前端必看的书籍+多年的社区知识+自己的经验，如有疑问，请联系 t511069160@gmail.com 24 | 25 | 26 | 27 | ——写于 2024年5月31日 28 | -------------------------------------------------------------------------------- /docs/About/sponsor.md: -------------------------------------------------------------------------------- 1 | # 成为赞助者 2 | 3 | 4 | 5 | ## 请我喝咖啡 6 | 7 | 如果您觉得这个项目能够帮助到您，可以给我个 star🌟，也可以推荐给您的朋友 8 | 9 | 持续更新中～ 🚀🚀🚀 10 | 11 | 12 | 13 | 14 | ## 展示位赞助 15 | 16 | 在侧边栏展示您的 LOGO 及跳转链接 17 | 18 | 您可以扫码加作者为好友，了解展示位的详细事宜 19 | 20 | 21 | -------------------------------------------------------------------------------- /docs/BackEnd/Go/Go语法基础.md: -------------------------------------------------------------------------------- 1 | # Go语法基础 2 | 3 | 4 | 5 | - 基础语法 6 | - 数据类型 7 | - 变量声明 8 | - 错误处理 9 | - 函数，多返回值 10 | - 接口/结构体 11 | 12 | - 进阶 13 | - 泛型 14 | - 数据结构 array slice map heap 15 | - 并发 goroutine、channel、context 16 | - 反射 17 | 18 | 19 | 20 | ## Go语言代码结构和语法初始 21 | 22 | 23 | 24 | ## 变量与常量 25 | 26 | 27 | 28 | ## 数据类型 29 | 30 | 31 | 32 | ### 基础数据类型 33 | 34 | 35 | 36 | ### 复杂数据类型 37 | 38 | 39 | 40 | 41 | 42 | -------------------------------------------------------------------------------- /docs/BackEnd/Go/go-mega.md: -------------------------------------------------------------------------------- 1 | # go-mega 2 | 3 | 4 | 5 | 6 | 7 | https://go-mega.bonfy.im/02-template-basic 8 | -------------------------------------------------------------------------------- /docs/BackEnd/Python/FastAPI.md: -------------------------------------------------------------------------------- 1 | # FastAPI 2 | 3 | 4 | 5 | 一个用于构建 API的现代、快速(高性能)的web框架。 6 | 7 | 8 | 9 | fastapi 是建立在Starlete和Pydantic基础上的，Pydantic是一个基于Pyhon类型提示来定义数据验证、序列化和文档的库。Starlete是 10 | 种轻量级的ASGI框架/工具包，是构建高性能Asyncio服务的理性选择。 11 | 12 | 13 | 14 | Starlete 负责 web 部分(Asyncio) 15 | Pydantic 负责数据部分(类型提示) 16 | 17 | 18 | 19 | 20 | 21 | ![image-20241231221840800](D:\Documents\PicGo Files\image-20241231221840800.png) 22 | 23 | 24 | 25 | ![image-20241231223930382](D:\Documents\PicGo Files\image-20241231223930382.png) 26 | -------------------------------------------------------------------------------- /docs/BackEnd/Python/Python.md: -------------------------------------------------------------------------------- 1 | # Python 2 | 3 | 4 | 5 | 纯想手作版fastapi最小化docker 6 | 7 | https://github.com/liseami/chunxiang-fastapi-temp 8 | 9 | 10 | 11 | 12 | 13 | 赵纯想推荐的入门课程 14 | 15 | https://fastapi.tiangolo.com/zh/ 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | ### 4.1.3、变量 26 | 27 | ```python 28 | x = 10 29 | y = "hi, johnny" 30 | z = True 31 | x = "hello world" 32 | ``` 33 | 34 | 35 | 36 | ```python 37 | x = 10 38 | print(id(x)) # 93968532106240 39 | x = 20 40 | print(id(x)) # 93968532106000 41 | ``` 42 | 43 | 和 JavaScript 不同，x 复制后，就是一个新的内存地址，值不会被替换 44 | 45 | 46 | 47 | ### 4.3、基本数据类型 48 | 49 | 4.3.1、整型和浮点型 50 | 51 | 在python中整数都属于整型。python只有一种整型，即`int`类型，无论整型数字多大多小都属于`int`。 52 | 53 | ```python 54 | x = 10 55 | print(type(x)) # 56 | ``` 57 | 58 | -------------------------------------------------------------------------------- /docs/BackEnd/Python/index.md: -------------------------------------------------------------------------------- 1 | # Python 2 | 3 | ## 前言 4 | 5 | 只要你学过其他编程语言，上手 Python 真的都很容易，3 - 7 天就能学会。 6 | 7 | 8 | 9 | 10 | 11 | 安装简单的，可以看[菜鸟教程](https://www.runoob.com/python/python-install.html)的教程，需要注意的是安装路径和勾选环境配置，默认会安装 pip，它是 python 的包管理工具，可以理解为i node 中的 npm 12 | 13 | 在命令行中输入以下命令： 14 | 15 | ```bash 16 | python --version 17 | # Python 3.10.6 18 | 19 | pip --version 20 | # pip 22.2.1 from D:\Program Files (x86)\Python\lib\site-packages\pip (python 3.10) 21 | 22 | pip list 23 | # 查看有哪些包 24 | # Package Version 25 | # ---------- ------- 26 | # pip 22.2.2 27 | # setuptools 63.2.0 28 | ``` 29 | 30 | 下载其他的包，例如 Django、Flask 31 | 32 | ```bash 33 | pip install Django 34 | #Looking in indexes: https://pypi.doubanio.com/simple/ 35 | #Collecting Django 36 | # Downloading #https://pypi.doubanio.com/packages/80/5c/884f9fed747679a1f70321465e664f3dc1602e8b7a6e96a21163894018b3/Django-4.1.1-py3-none-any.whl (8.1 MB) 37 | # ---------------------------------------- 8.1/8.1 MB 602.3 kB/s eta #0:00:00 38 | pip install Flask 39 | ``` 40 | 41 | 默认会从豆瓣源中下载 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | ## 参考资料 50 | 51 | - [人生苦短，我用 Python](https://github.com/jobbole/awesome-python-cn) 52 | -------------------------------------------------------------------------------- /docs/BackEnd/RESTful.md: -------------------------------------------------------------------------------- 1 | # RESTful 是个啥东西 2 | 3 | ## 一句话 4 | 5 | 用 URL 定位资源，用 HTTP 描述操作 6 | 7 | 看 URL 就知道你要什么资源 8 | 9 | 看 HTTP method 就知道你要干什么 10 | 11 | 看 status code 就知道结果是什么 12 | 13 | ## 是什么 14 | 15 | RESTful 架构风格最初由 Roy T. Fielding（HTTP/1.1 协议专家组负责人）在其 2000 年的博士学位论文中提出。 16 | 17 | REST 即 Representational State Transfer 的缩写，可译为”表现层状态转化“ 18 | 19 | - Representational: 数据的表现形式（JSON、XML......） 20 | - State：当前状态或者数据 21 | - Transfer：数据传输 22 | 23 | ## 特点 24 | 25 | REST 最大的特点为：资源、统一接口、URI 和无状态 26 | 27 | - 资源 28 | - 数据也好、服务也罢。都是资源 29 | - 以 json 为载体展示 30 | - 统一接口 31 | - 增删改查（CRUD）分别对应 HTTP 方法 32 | - GET 查询 33 | - POST 增加 34 | - PUT 更新（PATCH 也是更新，修改部分资源） 35 | - DELETE 删除 36 | - URI 37 | - URI（统一资源定位符）指向资源，URI 就是一个资源的地址或标识符 38 | - 无状态 39 | - 所有的资源，都可以通过 URI 定位，而且这个定位与其他资源无关 40 | - 对每个资源的请求，都不依赖于其他资源或其他请求 41 | 42 | ## 参考资料 43 | 44 | - [怎样用通俗的语言解释 REST，以及 RESTful？](https://www.zhihu.com/question/28557115) 45 | - [RESTful 架构风格概述](https://blog.igevin.info/posts/restful-architecture-in-general/) 46 | -------------------------------------------------------------------------------- /docs/BackEnd/Redis.md: -------------------------------------------------------------------------------- 1 | # Redis 2 | 3 | ## 什么是 Redis 4 | 5 | Redis 是一个开源（BSD 许可）的内存数据结构存储，用作数据库，缓存和消息代理。 6 | 7 | 它支持的数据结构：string，list，set，sorted set，hash 8 | 9 | - Redis 是由 C 语言写的 10 | - 数据模型为 key-value 11 | 12 | ## 特点 13 | 14 | - 速度快，因为数据存在内存中，类似于 HashMap 15 | - HashMap 的特点是查找和操作的时间复杂度为 O(1) 16 | - 可持久化 17 | - 可用于缓存，消息，按 key 设置过期时间，过期后将自动删除 18 | 19 | ## 应用场景 20 | 21 | 目前的场景就是当作缓存用 22 | 23 | 24 | 25 | `redis.cli -v`：查看 redis 版本 26 | 27 | 28 | 29 | 30 | 31 | 启动 reids 32 | 33 | ```bash 34 | redis-server 35 | ``` 36 | 37 | 查看 reids 是否启动 38 | 39 | 重新开个窗口 40 | 41 | ```bash 42 | redis-cli 43 | ``` 44 | 45 | 以上命令将打开以下终端： 46 | 47 | ```bash 48 | redis 127.0.0.1:6379> 49 | ``` 50 | 51 | 127.0.0.1 是本机 IP ，6379 是 redis 服务端口。现在我们输入 PING 命令。 52 | 53 | ```bash 54 | redis 127.0.0.1:6379> ping 55 | PONG 56 | ``` 57 | 58 | 退出 redis 终端 59 | 60 | CTRL+C 或者 exit 61 | 62 | ![redis命令](https://s2.loli.net/2022/09/26/UzI9sCcKW3ERO1p.png) 63 | 64 | ### 如何后台启动 redis 65 | 66 | 修改 redis.conf 文件中的 daemonize 67 | 68 | 开启 `daemonize yes` 报错退出 69 | 70 | 如何找到 redis.conf 71 | 72 | ```bash 73 | find / -name redis.conf 74 | ``` 75 | 76 | 使用 redis-server 启动 redis.conf 配置文件 77 | 78 | ```bash 79 | redis-server ./redis.conf 80 | ``` 81 | 82 | > PS：redis-server 为 bin 命令，在 redis.conf 目录下 83 | 84 | ![redis.conf](https://s2.loli.net/2022/09/26/8gFKCVcT3UqG5H4.png) 85 | 86 | 87 | 88 | ## 常见命令行 89 | 90 | | 命令名 | 描述 | 91 | | ------------- | -------------- | 92 | | keys \* | 查看所有的 key | 93 | | set key value | 设置 key-value | 94 | | get key | 得到某个 key | 95 | | del key | 删除某个 key | 96 | 97 | ## 实战 98 | 99 | 到现在还没用到 100 | -------------------------------------------------------------------------------- /docs/BackEnd/SQLite.md: -------------------------------------------------------------------------------- 1 | # SQLite 2 | 3 | 4 | 5 | ## 介绍 6 | 7 | SQLite是一个进程内的库，实现了自给自足的、无服务器的、零配置的、事务性的 SQL 数据库引擎。它是一个零配置的数据库，这意味着与其他数据库不一样，您不需要在系统中配置。 8 | 9 | 就像其他数据库，SQLite 引擎不是一个独立的进程，可以按应用程序需求进行静态或动态连接。SQLite 直接访问其存储文件。 10 | 11 | ## 为什么要用 SQLite？ 12 | 13 | - 不需要一个单独的服务器进程或操作的系统（无服务器的）。 14 | - SQLite 不需要配置，这意味着不需要安装或管理。 15 | - 一个完整的 SQLite 数据库是存储在一个单一的跨平台的磁盘文件。 16 | - SQLite 是非常小的，是轻量级的，完全配置时小于 400KiB，省略可选功能配置时小于250KiB。 17 | - SQLite 是自给自足的，这意味着不需要任何外部的依赖。 18 | - SQLite 事务是完全兼容 ACID 的，允许从多个进程或线程安全访问。 19 | - SQLite 支持 SQL92（SQL2）标准的大多数查询语言的功能。 20 | - SQLite 使用 ANSI-C 编写的，并提供了简单和易于使用的 API。 21 | - SQLite 可在 UNIX（Linux, Mac OS-X, Android, iOS）和 Windows（Win32, WinCE, WinRT）中运行。 22 | 23 | ## 安装 24 | 25 | 参考 [菜鸟教程的安装步骤](https://www.runoob.com/sqlite/sqlite-installation.html) 即可 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | https://www.sqlite.org/lang.html 34 | -------------------------------------------------------------------------------- /docs/BackEnd/cloudflare/saas服务.md: -------------------------------------------------------------------------------- 1 | # ai红包saas服务 2 | 3 | 4 | 5 | 6 | 7 | ai红包saas服务 8 | 9 | nextjs + paddle 的 saas 服务 10 | 11 | paddle 的支付思路 12 | 13 | 14 | 15 | 16 | 17 | 价格列表，点击去checkout页面唤起 paddle.Checkout.open(...)，传入用户 email 以及商品详情 18 | 19 | 前端发起请求 ——> 跳转到paddle 的支付页面，支付完成后，它会发送一个回调地址到你的 api/webhook 上，此时你就要对数据进行存储，订阅用户的更新 20 | 21 | 同时，也会跳转到你的之前在支付页上定义的支付成功页面 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 开源例子： 30 | 31 | https://github.com/weijunext/smart-excel-ai：比较复杂，不仅有会员体系还有加油包功能，还多了 redis 减少对数据库的读写 -------------------------------------------------------------------------------- /docs/BackEnd/index.md: -------------------------------------------------------------------------------- 1 | # 后端知识点汇总 2 | 3 | 作为一名前端出生的程序开发者，要如何学习后端方面的知识点呢？这里分享笔者对后端知识点的理解， 4 | 5 | 6 | 43 | 44 | 在 前端学习完之后，学习 [Node](../Node/)，对后端有所认知后，去了解其他语言，例如 Ruby、Go、Python 等 45 | 46 | [session 与 JWT](./session与JWT) 47 | 48 | [Web API 设计](./RESTful) 49 | 50 | [HTTP 协议](../HTTP/) 51 | 52 | ## 数据库 53 | 54 | - [Mysql](./Mysql) 55 | 56 | - [Postgresql](./Postgresql) 57 | 58 | - [MongoDB](./MongoDB) 59 | 60 | - [SQLite](./SQLite) 61 | 62 | - [Redis](./Redis) 63 | 64 | -------------------------------------------------------------------------------- /docs/BackEnd/数据库案例学习.md: -------------------------------------------------------------------------------- 1 | # 数据库案例学习 2 | 3 | 这里从开源项目中探究如何建数据库 4 | 5 | idoubi 的 [aicover](https://github.com/all-in-aigc/aicover) 6 | 7 | ```sql 8 | CREATE TABLE users ( 9 | id SERIAL PRIMARY KEY, 10 | email VARCHAR(255) UNIQUE NOT NULL, 11 | nickname VARCHAR(255), 12 | avatar_url VARCHAR(255), 13 | created_at timestamptz, 14 | uuid UUID UNIQUE NOT NULL 15 | ); 16 | 17 | CREATE TABLE covers ( 18 | id SERIAL PRIMARY KEY, 19 | user_email VARCHAR(255) NOT NULL, 20 | img_description TEXT, 21 | img_size VARCHAR(255), 22 | img_url TEXT, 23 | llm_name VARCHAR(100), 24 | llm_params JSON, 25 | created_at timestamptz, 26 | uuid UUID UNIQUE NOT NULL, 27 | status INT, 28 | is_recommended BOOLEAN, 29 | user_uuid UUID, 30 | is_uploaded BOOLEAN, 31 | is_awesome BOOLEAN, 32 | is_brand BOOLEAN 33 | ); 34 | 35 | CREATE TABLE orders ( 36 | id SERIAL PRIMARY KEY, 37 | order_no VARCHAR(255) UNIQUE NOT NULL, 38 | created_at timestamptz, 39 | user_email VARCHAR(255) NOT NULL, 40 | amount INT NOT NULL, 41 | plan VARCHAR(50), 42 | expired_at timestamptz, 43 | order_status SMALLINT NOT NULL, 44 | paied_at timestamptz, 45 | stripe_session_id VARCHAR(255), 46 | credits INT NOT NULL, 47 | currency VARCHAR(50), 48 | user_uuid UUID 49 | ); 50 | 51 | ALTER TABLE covers 52 | ADD CONSTRAINT fk_user_email 53 | FOREIGN KEY (user_email) 54 | REFERENCES users(email) 55 | ON DELETE CASCADE; 56 | ``` 57 | 58 | -------------------------------------------------------------------------------- /docs/Basic/CSS/CSS3新特性.md: -------------------------------------------------------------------------------- 1 | # CSS3 新特性 2 | 3 | 4 | 5 | ## 选择器增强 6 | 7 | CSS3 新增了更多的选择器，如属性选择器、伪类选择器 8 | 9 | ## 圆角边框 10 | 11 | 引入 border-radius 属性，可以设置元素的圆角效果 12 | 13 | ## 阴影效果 14 | 15 | 引入 box-shadow 属性，可以设置元素的阴影效果，包括水平便宜、垂直便宜、模糊半径、阴影尺寸和颜色等 16 | 17 | ## 文字效果 18 | 19 | 引入 word-wrap、text-shadow、text-overflow、text-decoration 等属性，可以为文字添加阴影效果、控制溢出文本、下划线 20 | 21 | ## 背景特性 22 | 23 | 引入多重背景图、背景渐变等效果 24 | 25 | ### 渐变 26 | 27 | - linear-gradient：线性渐变 28 | - radial-gradient：径向渐变 29 | 30 | ## 2D/3D 转换 31 | 32 | 引入 transform 属性，可以对元素进行位移、缩放、旋转、倾斜等 2D 或 3D 转换效果 33 | 34 | ## 过渡和动画 35 | 36 | 新增 transition 和 animation 属性，可以实现元素的平滑过渡和动画效果 37 | 38 | ## 弹性布局 39 | 40 | 引入弹性盒模型布局（Flex布局），能够更好地适应不同设备和屏幕尺寸 41 | 42 | ## 栅格布局 43 | 44 | 引入栅格布局（Grid布局），能够更好地适应不同设备和屏幕尺寸 45 | 46 | 47 | 48 | ## 参考资料 49 | 50 | - [面试官：CSS3新增了哪些新特性？](https://github.com/febobo/web-interview/issues/106) 51 | -------------------------------------------------------------------------------- /docs/Basic/CSS/grid.md: -------------------------------------------------------------------------------- 1 | # Grid 栅格布局 2 | 3 | ## 参考资料 4 | 5 | - [写给自己看的 display: grid 布局教程](https://www.zhangxinxu.com/wordpress/2018/11/display-grid-css-css3/) 6 | - [最强大的 CSS 布局 —— Grid 布局](https://juejin.cn/post/6854573220306255880) 7 | -------------------------------------------------------------------------------- /docs/Basic/CSS/动画.md: -------------------------------------------------------------------------------- 1 | # 动画 2 | 3 | transform 用于元素旋转、缩放、移动、倾斜等效果 4 | 5 | transition 用户较为单一的动画 6 | 7 | animation 用于较为复杂、有中间态的动画 8 | 9 | ## 参考资料 10 | 11 | - [animation、transition、transform 的区别](https://juejin.im/post/5c75cf69f265da2dbf5f15ed) 12 | - [CSS animation 与 CSS transition 有何区别？](https://www.zhihu.com/question/19749045) 13 | - [CSS（二）Transition & Animation](https://blog.csdn.net/u013243347/article/details/79943045) 14 | -------------------------------------------------------------------------------- /docs/Basic/CSS/左图右文布局.md: -------------------------------------------------------------------------------- 1 | # 左图右文布局做法 2 | 3 | 共几种，区别在哪里 4 | 5 | 6 | 7 | CSS 布局，一篇一劳永逸 8 | 9 | CSS 标准为我们提供了 3 种布局方式：`标准文档流`、`浮动布局`和`定位布局` 10 | 11 | ## 参考资料 12 | 13 | - [给你一份详细的 CSS 布局指南，请查收](https://juejin.cn/post/6844904121862979597) 14 | - [实现三栏布局的几种方法](https://github.com/ljianshu/Blog/issues/14) 15 | - [【第 2172 期】自适应布局最佳实践](https://mp.weixin.qq.com/s/8GvZetosiFJmZ1n3ZLfxNA) 16 | - [常见 CSS 布局的实现](https://github.com/funnycoderstar/blog/issues/125) 17 | -------------------------------------------------------------------------------- /docs/Basic/CSS/布局.md: -------------------------------------------------------------------------------- 1 | # 各种布局 2 | 3 | CSS 布局，一篇一劳永逸 4 | 5 | CSS 标准为我们提供了 3 种布局方式：`标准文档流`、`浮动布局`和`定位布局` 6 | 7 | ## 参考资料 8 | 9 | - [给你一份详细的 CSS 布局指南，请查收](https://juejin.cn/post/6844904121862979597) 10 | - [实现三栏布局的几种方法](https://github.com/ljianshu/Blog/issues/14) 11 | - [【第 2172 期】自适应布局最佳实践](https://mp.weixin.qq.com/s/8GvZetosiFJmZ1n3ZLfxNA) 12 | - [常见 CSS 布局的实现](https://github.com/funnycoderstar/blog/issues/125) 13 | -------------------------------------------------------------------------------- /docs/Basic/CSS/瀑布流效果.md: -------------------------------------------------------------------------------- 1 | # 瀑布流效果 2 | 3 | 4 | 5 | 6 | 7 | 多列（multi-columns）布局、弹性（Flexbox）布局、Grid 布局 8 | 9 | 10 | 11 | 12 | 13 | ## 参考资料 14 | 15 | - [「前端进阶」干货！深度解析瀑布流布局](https://github.com/chenqf/frontEndBlog/issues/17) 16 | - [关于双列瀑布流布局的优化思考](https://mp.weixin.qq.com/s/UeEKbji202ZAAXEFmkvTtg) 17 | - [瀑布流组件陷入商品重复怪圈？我是如何用心一解的！](https://mp.weixin.qq.com/s/bzkj65WMoixRSdlBLJgOZg) 18 | -------------------------------------------------------------------------------- /docs/Basic/HTML/SEO.md: -------------------------------------------------------------------------------- 1 | ## SEO 2 | 3 | ### 哥飞 4 | 5 | 跟豆瓣学 SEO 6 | 首页一定要有一个 H1 标签，让搜索引擎知道网站的核心关键字是什么，豆瓣创造性的把 logo 图和 h1 结合到一起了。 7 | 内容页，网站名称就不能作为主题了，所以 H1 是书籍电影名称，同时每一个 H2 都重复主题。让搜索引擎知道，这个页面的内容都是跟主题相关的。 8 | 9 | ![image-20211123165159650](https://i.loli.net/2021/11/23/b7BUPAIfYFjRNn8.png) 10 | 11 | ![image-20211123165216026](https://i.loli.net/2021/11/23/JNIRmY8Zu1CXpHL.png) 12 | -------------------------------------------------------------------------------- /docs/Basic/HTML/index.md: -------------------------------------------------------------------------------- 1 | # HTML 面试题 2 | 3 | HTML 是网站的基础，是最开始的灵魂，如果说网站的基础构成，那么非它莫属 4 | 5 | ## DOCTYPE 的作用？标准模式（严格模式）和 兼容模式（混杂模式）有什么区别？ 6 | 7 | 声明位于 HTML 文档中的第一行，处于标签之前，告知浏览器解析器，需要用声明文档去解析这个文档 8 | 9 | - 标准模式的排版和 JS 运行模式是以浏览器支持的最高标准运行 10 | - 兼容模式模式中，页面以宽松向后兼容的方式去显示，模拟老式浏览器的行为以防止站点无法工作 11 | 12 | ## 行内元素有哪些？块级元素有哪些？ 13 | 14 | ``` 15 | 行内：、、、、、 15 | ``` 16 | 17 | android 端 18 | 19 | ```html 20 | 21 | ``` 22 | 23 | 24 | 25 | 如何让其只能输入数字，关键在 onChange，输入的时候对其做正则，不符合条件不赋值 26 | 27 | ```javascript 28 | // 只能输入数字 29 | let value = e.target.value.replace(/\D/g, '') 30 | // 首字不能为0 31 | if (value[0] === '0') { 32 | value = value.slice(1) 33 | } 34 | ``` 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | ## 参考资料 43 | 44 | - [移动端那些戳中你痛点的软键盘问题及解决方法](https://juejin.cn/post/6961757804491178014) 45 | - [WebView 上软键盘的兼容方案](https://setcina.github.io/2020/01/20/WebView%E4%B8%8A%E8%BD%AF%E9%94%AE%E7%9B%98%E7%9A%84%E5%85%BC%E5%AE%B9%E6%96%B9%E6%A1%88/) 46 | - [iOS 键盘难题与可见视口(VisualViewport) API](http://www.alloyteam.com/2020/02/14265/) 47 | - [【适配】555- H5 手机键盘弹出收起的处理](https://mp.weixin.qq.com/s?__biz=MjM5MDc4MzgxNA==&mid=2458454398&idx=1&sn=df9c1a3a5783bf30bf415a8a460869c5&chksm=b1c2295786b5a0414abcd8164145ea025cfa812d0029a7ebaf37ec8f4b53ffe9b1a0d0959725&mpshare=1&scene=1&srcid=&sharer_sharetime=1586267698031&sharer_shareid=778ad5bf3b27e0078eb105d7277263f6#rd) 48 | - [移动端 input 输入框 键盘 遮挡 遮盖](https://github.com/yongheng2016/blog/issues/123) 49 | - [移动端弹窗输入密码的那些事](https://futu.im/article/input-pwd-on-mobile-browser-dialog/) 50 | - [可能这些是你想要的H5软键盘兼容方案](https://segmentfault.com/a/1190000018959389) 51 | 52 | -------------------------------------------------------------------------------- /docs/WebApp/适配方案.md: -------------------------------------------------------------------------------- 1 | # 移动端适配方案 2 | 3 | ### 快问快答 4 | 5 | 响应式布局有几种方式 6 | 7 | 我觉得很多情况下要多种方案一起用，很多情况下时互补的，媒体查询是必要的 8 | 9 | 1.媒体查询 2.百分比 3.rem 4.vw/vh 10 | 11 | #### 适配方案对比 12 | 13 | - viewport 缩放方案 14 | - 适配原理简单 15 | - 需要使用 JS 16 | - 直接使用设计稿标注无需换算 17 | - 方案死板只能实现页面级别整体缩放 18 | - 动态 REM 方案 19 | - 是撇原理稍复杂 20 | - 需要使用 JS 21 | - 设计稿标注换算到 CSS 的 rem 计算简单 22 | - 方案灵活技能实现整体缩放又能实现 23 | - vw 方案 24 | - 适配原理简单 25 | - 不需要 JS 即可适配 26 | - 设计稿标注的 px 换算到 CSS 的 vw 计算复杂 27 | - 方案灵活技能实现整体缩放又能实现局部不缩放 28 | 29 | ## 参考资料 30 | 31 | - [一篇搞定移动端适配](https://juejin.im/post/5e6caf55e51d4526ff026a71) 32 | - [大厂是怎么做移动端适配的](https://mp.weixin.qq.com/s?__biz=MzA3MDkzNjM3MA==&mid=2455673434&idx=1&sn=ccf86c2c5d37c98bc9e25230a9dceed4&chksm=889f0807bfe88111772a4f91cfd2d15fa0ce47a979ac09fa8f43f5b6bac07d41fa19cc7224ac&mpshare=1&scene=1&srcid=&sharer_sharetime=1586042825490&sharer_shareid=778ad5bf3b27e0078eb105d7277263f6#rd) 33 | - [移动端适配原理篇](http://www.conardli.top/blog/article/%E5%A4%9A%E7%AB%AF%E5%BC%80%E5%8F%91/%E7%A7%BB%E5%8A%A8%E7%AB%AF%E9%80%82%E9%85%8D%E6%80%BB%E7%BB%93%EF%BC%88%E4%BA%8C%EF%BC%89%E5%BA%94%E7%94%A8%E7%AF%87.html#%E4%B8%80%E3%80%81%E8%8B%B1%E5%AF%B8) 34 | - [可伸缩布局方案 amfe-flexible 解决多端适配问题](https://juejin.cn/post/6844904194273443848) 35 | - [移动 web 最佳实践](https://juejin.cn/post/6844903938051964941) 36 | - [面试官：你了解过移动端适配吗？](https://juejin.cn/post/6844903631993454600) 37 | -------------------------------------------------------------------------------- /docs/index.md: -------------------------------------------------------------------------------- 1 | --- 2 | layout: home 3 | sidebar: false 4 | 5 | title: 五年前端三年面试 6 | titleTemplate: Johnny的编程知识体系 7 | 8 | hero: 9 | name: 五年前端三年面试 10 | text: Johnny的编程知识库 11 | tagline: 像我这样平凡的前端的自我救赎 12 | image: 13 | src: ./logo.webp 14 | alt: challenges 15 | actions: 16 | - theme: brand 17 | text: Introduction 18 | link: /Introduction/ 19 | - theme: alt 20 | text: JavaScript 21 | link: /JavaScript/ 22 | - theme: brand 23 | text: React 24 | link: /React/ 25 | - theme: alt 26 | text: BackEnd 27 | link: /BackEnd/ 28 | - theme: brand 29 | text: 面试真题 30 | link: /Interview/ 31 | - theme: alt 32 | text: 大前端 33 | link: /WebApp/ 34 | - theme: brand 35 | text: 小报童导航站 36 | link: https://xiaobaot.cn?utm_source=fe.azhubaby.com&utm_medium=referral 37 | features: 38 | - title: 允许一切如其所是 39 | details: 参差百态乃幸福之本源 40 | - title: Nothing is Simple 41 | details: Things Change Roll With It 42 | - title: 不解释，不后悔，不抱怨 43 | details: 除了生死，都是小事 44 | --- 45 | 46 | 47 | 48 | 49 | 71 | -------------------------------------------------------------------------------- /docs/public/26fbeced23574b0684d3e4ec7e00cd8c.txt: -------------------------------------------------------------------------------- 1 | 26fbeced23574b0684d3e4ec7e00cd8c -------------------------------------------------------------------------------- /docs/public/android-chrome-128x128.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/android-chrome-128x128.png -------------------------------------------------------------------------------- /docs/public/android-chrome-192x192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/android-chrome-192x192.png -------------------------------------------------------------------------------- /docs/public/android-chrome-512x512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/android-chrome-512x512.png -------------------------------------------------------------------------------- /docs/public/android-chrome-96x96.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/android-chrome-96x96.png -------------------------------------------------------------------------------- /docs/public/apple-touch-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/apple-touch-icon.png -------------------------------------------------------------------------------- /docs/public/baidu_verify_codeva-nBcDOxSAzM.html: -------------------------------------------------------------------------------- 1 | 7a41b40a1985677f9e738534e19c3c37 -------------------------------------------------------------------------------- /docs/public/browserconfig.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | #da532c 7 | 8 | 9 | 10 | -------------------------------------------------------------------------------- /docs/public/c9b5b596facb463bbc3f1f64797023db.txt: -------------------------------------------------------------------------------- 1 | c9b5b596facb463bbc3f1f64797023db -------------------------------------------------------------------------------- /docs/public/favicon-16x16.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/favicon-16x16.png -------------------------------------------------------------------------------- /docs/public/favicon-32x32.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/favicon-32x32.png -------------------------------------------------------------------------------- /docs/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/favicon.ico -------------------------------------------------------------------------------- /docs/public/favicon1.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/favicon1.ico -------------------------------------------------------------------------------- /docs/public/images/Algorithm/算法和数据结构.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Algorithm/算法和数据结构.png -------------------------------------------------------------------------------- /docs/public/images/Browser/2021chrome浏览器架构.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Browser/2021chrome浏览器架构.png -------------------------------------------------------------------------------- /docs/public/images/Browser/2021edge浏览器架构.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Browser/2021edge浏览器架构.png -------------------------------------------------------------------------------- /docs/public/images/Browser/CSS-Rule-Tree-Example.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Browser/CSS-Rule-Tree-Example.jpg -------------------------------------------------------------------------------- /docs/public/images/Browser/DOM-Tree-01.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Browser/DOM-Tree-01.jpg -------------------------------------------------------------------------------- /docs/public/images/Browser/DOM-Tree-02.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Browser/DOM-Tree-02.jpg -------------------------------------------------------------------------------- /docs/public/images/Browser/DOM-Tree-Example.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Browser/DOM-Tree-Example.jpg -------------------------------------------------------------------------------- /docs/public/images/Browser/Firefox-style-context-tree.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Browser/Firefox-style-context-tree.png -------------------------------------------------------------------------------- /docs/public/images/Browser/Render-Process-Skipping.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Browser/Render-Process-Skipping.jpg -------------------------------------------------------------------------------- /docs/public/images/Browser/chrome浏览器架构.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Browser/chrome浏览器架构.png -------------------------------------------------------------------------------- /docs/public/images/Browser/从输入url到渲染起始图.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Browser/从输入url到渲染起始图.png -------------------------------------------------------------------------------- /docs/public/images/Browser/从输入url到渲染过程图.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Browser/从输入url到渲染过程图.png -------------------------------------------------------------------------------- /docs/public/images/Browser/未来chrome浏览器架构.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Browser/未来chrome浏览器架构.png -------------------------------------------------------------------------------- /docs/public/images/Browser/浏览器架构.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Browser/浏览器架构.png -------------------------------------------------------------------------------- /docs/public/images/Browser/浏览器渲染大致流程.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Browser/浏览器渲染大致流程.jpg -------------------------------------------------------------------------------- /docs/public/images/CSBasic/计算机发展历史.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/CSBasic/计算机发展历史.png -------------------------------------------------------------------------------- /docs/public/images/CSS/BFC1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/CSS/BFC1.png -------------------------------------------------------------------------------- /docs/public/images/CSS/BFC2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/CSS/BFC2.png -------------------------------------------------------------------------------- /docs/public/images/CSS/BFC_margin.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/CSS/BFC_margin.png -------------------------------------------------------------------------------- /docs/public/images/DataStructure/复杂度量级.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/DataStructure/复杂度量级.jpg -------------------------------------------------------------------------------- /docs/public/images/DataStructure/数据结构思维导图.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/DataStructure/数据结构思维导图.jpg -------------------------------------------------------------------------------- /docs/public/images/DataStructure/时间复杂度.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/DataStructure/时间复杂度.png -------------------------------------------------------------------------------- /docs/public/images/Deploy/修改安全配置.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Deploy/修改安全配置.png -------------------------------------------------------------------------------- /docs/public/images/Deploy/阿里云网关配置.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Deploy/阿里云网关配置.png -------------------------------------------------------------------------------- /docs/public/images/DesignPattern/23种设计模式.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/DesignPattern/23种设计模式.jpg -------------------------------------------------------------------------------- /docs/public/images/DesignPattern/装饰器示例.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/DesignPattern/装饰器示例.png -------------------------------------------------------------------------------- /docs/public/images/Docker/VM与docker对比.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/VM与docker对比.jpg -------------------------------------------------------------------------------- /docs/public/images/Docker/docker_build.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/docker_build.png -------------------------------------------------------------------------------- /docs/public/images/Docker/docker_inspect.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/docker_inspect.png -------------------------------------------------------------------------------- /docs/public/images/Docker/docker_pull.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/docker_pull.png -------------------------------------------------------------------------------- /docs/public/images/Docker/docker_run.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/docker_run.png -------------------------------------------------------------------------------- /docs/public/images/Docker/docker_version.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/docker_version.png -------------------------------------------------------------------------------- /docs/public/images/Docker/docker_version_window.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/docker_version_window.png -------------------------------------------------------------------------------- /docs/public/images/Docker/dockerfile最小实现/docker_build.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/dockerfile最小实现/docker_build.png -------------------------------------------------------------------------------- /docs/public/images/Docker/dockerfile最小实现/docker_pull.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/dockerfile最小实现/docker_pull.png -------------------------------------------------------------------------------- /docs/public/images/Docker/dockerfile最小实现/docker_push.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/dockerfile最小实现/docker_push.png -------------------------------------------------------------------------------- /docs/public/images/Docker/dockerfile最小实现/dockerfile_脚本.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/dockerfile最小实现/dockerfile_脚本.png -------------------------------------------------------------------------------- /docs/public/images/Docker/dockerfile最小实现/lrzsz上传镜像.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/dockerfile最小实现/lrzsz上传镜像.png -------------------------------------------------------------------------------- /docs/public/images/Docker/dockerfile最小实现/导入镜像.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/dockerfile最小实现/导入镜像.png -------------------------------------------------------------------------------- /docs/public/images/Docker/dockerfile最小实现/导出镜像.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/dockerfile最小实现/导出镜像.png -------------------------------------------------------------------------------- /docs/public/images/Docker/dockerhub.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/dockerhub.png -------------------------------------------------------------------------------- /docs/public/images/Docker/docker架构图.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/docker架构图.jpg -------------------------------------------------------------------------------- /docs/public/images/Docker/docker结构.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/docker结构.jpg -------------------------------------------------------------------------------- /docs/public/images/Docker/jenkins/docker_jenkins下载ssh插件.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/jenkins/docker_jenkins下载ssh插件.png -------------------------------------------------------------------------------- /docs/public/images/Docker/jenkins/docker_jenkins创建账号.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/jenkins/docker_jenkins创建账号.png -------------------------------------------------------------------------------- /docs/public/images/Docker/jenkins/docker_jenkins安装node插件.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/jenkins/docker_jenkins安装node插件.png -------------------------------------------------------------------------------- /docs/public/images/Docker/jenkins/docker_jenkins安装node插件1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/jenkins/docker_jenkins安装node插件1.png -------------------------------------------------------------------------------- /docs/public/images/Docker/jenkins/docker_jenkins安装推荐的插件.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/jenkins/docker_jenkins安装推荐的插件.png -------------------------------------------------------------------------------- /docs/public/images/Docker/jenkins/docker_jenkins换源.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/jenkins/docker_jenkins换源.png -------------------------------------------------------------------------------- /docs/public/images/Docker/jenkins/docker_jenkins新手.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/jenkins/docker_jenkins新手.png -------------------------------------------------------------------------------- /docs/public/images/Docker/jenkins/docker_jenkins设置服务器上的ssh.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/jenkins/docker_jenkins设置服务器上的ssh.png -------------------------------------------------------------------------------- /docs/public/images/Docker/jenkins/docker_jenkins配置ssh1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/jenkins/docker_jenkins配置ssh1.png -------------------------------------------------------------------------------- /docs/public/images/Docker/jenkins/docker_jenkins配置ssh2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/jenkins/docker_jenkins配置ssh2.png -------------------------------------------------------------------------------- /docs/public/images/Docker/jenkins/jenkins任务描述1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/jenkins/jenkins任务描述1.png -------------------------------------------------------------------------------- /docs/public/images/Docker/jenkins/jenkins任务描述2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/jenkins/jenkins任务描述2.png -------------------------------------------------------------------------------- /docs/public/images/Docker/jenkins/jenkins任务描述3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/jenkins/jenkins任务描述3.png -------------------------------------------------------------------------------- /docs/public/images/Docker/jenkins/jenkins任务描述4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/jenkins/jenkins任务描述4.png -------------------------------------------------------------------------------- /docs/public/images/Docker/jenkins/jenkins任务描述5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/jenkins/jenkins任务描述5.png -------------------------------------------------------------------------------- /docs/public/images/Docker/jenkins/jenkins控制台输出.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/jenkins/jenkins控制台输出.png -------------------------------------------------------------------------------- /docs/public/images/Docker/jenkins/jenkins新建任务.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/jenkins/jenkins新建任务.png -------------------------------------------------------------------------------- /docs/public/images/Docker/jenkins/jenkins立即构建.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/jenkins/jenkins立即构建.png -------------------------------------------------------------------------------- /docs/public/images/Docker/jenkins/jenkins起任务名字.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/jenkins/jenkins起任务名字.png -------------------------------------------------------------------------------- /docs/public/images/Docker/jenkins/jenkins部署成功.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/jenkins/jenkins部署成功.png -------------------------------------------------------------------------------- /docs/public/images/Docker/repository、image和container.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/repository、image和container.png -------------------------------------------------------------------------------- /docs/public/images/Docker/set_linux环境.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/set_linux环境.png -------------------------------------------------------------------------------- /docs/public/images/Docker/虚拟机和容器.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/虚拟机和容器.jpg -------------------------------------------------------------------------------- /docs/public/images/Docker/虚拟机结构.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/虚拟机结构.jpg -------------------------------------------------------------------------------- /docs/public/images/Docker/通过dockerfile生成的image.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Docker/通过dockerfile生成的image.png -------------------------------------------------------------------------------- /docs/public/images/ES6/Map构造函数结构.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/ES6/Map构造函数结构.png -------------------------------------------------------------------------------- /docs/public/images/ES6/symbol不能作为构造函数使用.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/ES6/symbol不能作为构造函数使用.png -------------------------------------------------------------------------------- /docs/public/images/Flutter/statefulwidget生命周期.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Flutter/statefulwidget生命周期.png -------------------------------------------------------------------------------- /docs/public/images/Git/工作区域.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Git/工作区域.jpg -------------------------------------------------------------------------------- /docs/public/images/HTTP/HTTP三次握手.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/HTTP/HTTP三次握手.png -------------------------------------------------------------------------------- /docs/public/images/HTTP/HTTP报文格式.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/HTTP/HTTP报文格式.png -------------------------------------------------------------------------------- /docs/public/images/HTTP/TCP与UDP.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/HTTP/TCP与UDP.jpg -------------------------------------------------------------------------------- /docs/public/images/HTTP/在nginx中配置https.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/HTTP/在nginx中配置https.png -------------------------------------------------------------------------------- /docs/public/images/HTTP/浏览器输入URL后HTTP请求返回的完整过程.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/HTTP/浏览器输入URL后HTTP请求返回的完整过程.png -------------------------------------------------------------------------------- /docs/public/images/HTTP/缓存验证Last-Modified和Etag的使用.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/HTTP/缓存验证Last-Modified和Etag的使用.png -------------------------------------------------------------------------------- /docs/public/images/HTTP/网络协议分层.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/HTTP/网络协议分层.png -------------------------------------------------------------------------------- /docs/public/images/HTTP/透视HTTP知识地图.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/HTTP/透视HTTP知识地图.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/Array/查看Array数据结构.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/Array/查看Array数据结构.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/Array/自己写的Array.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/Array/自己写的Array.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/Object.create显示原型继承.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/Object.create显示原型继承.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/dobounce.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/dobounce.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/function的定义.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/function的定义.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/new之后的user.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/new之后的user.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/proto.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/proto.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/prototype与proto.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/prototype与proto.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/prototype屏蔽继承数据能力迎合class.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/prototype屏蔽继承数据能力迎合class.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/prototype继承数据.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/prototype继承数据.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/setPrototypeOf显式绑定原型.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/setPrototypeOf显式绑定原型.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/throttle1.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/throttle1.gif -------------------------------------------------------------------------------- /docs/public/images/JavaScript/throttle2.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/throttle2.gif -------------------------------------------------------------------------------- /docs/public/images/JavaScript/throttle3.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/throttle3.gif -------------------------------------------------------------------------------- /docs/public/images/JavaScript/作用域-隐形作用域.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/作用域-隐形作用域.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/作用域.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/作用域.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/原型.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/原型.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/原型proto.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/原型proto.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/原型proto历史.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/原型proto历史.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/原型默认继承.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/原型默认继承.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/在chrome中查看执行上下文栈.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/在chrome中查看执行上下文栈.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/基于createInstance的user对象.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/基于createInstance的user对象.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/如何查看执行上下文栈.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/如何查看执行上下文栈.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/执行上下文-example.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/执行上下文-example.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/执行上下文中的词法环境.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/执行上下文中的词法环境.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/执行上下文周期.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/执行上下文周期.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/执行上下文的构成.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/执行上下文的构成.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/执行代码周期.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/执行代码周期.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/改变proto的值.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/改变proto的值.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/数据类型分类.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/数据类型分类.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/显示原型继承.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/显示原型继承.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/类型存储.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/类型存储.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/继承.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/继承.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/词法作用域-example.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/词法作用域-example.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/词法环境-词法作用域example.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/词法环境-词法作用域example.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/词法环境.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/词法环境.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/语言坐标轴.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/语言坐标轴.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/隐式引用.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/隐式引用.png -------------------------------------------------------------------------------- /docs/public/images/JavaScript/面向对象思维导图.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/JavaScript/面向对象思维导图.png -------------------------------------------------------------------------------- /docs/public/images/Linux/distro_family.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Linux/distro_family.jpg -------------------------------------------------------------------------------- /docs/public/images/Linux/figlet.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Linux/figlet.png -------------------------------------------------------------------------------- /docs/public/images/Linux/release.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Linux/release.png -------------------------------------------------------------------------------- /docs/public/images/Linux/whatis.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Linux/whatis.png -------------------------------------------------------------------------------- /docs/public/images/Performance/监听视窗激活状态.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Performance/监听视窗激活状态.gif -------------------------------------------------------------------------------- /docs/public/images/Serverless/定义.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/Serverless/定义.png -------------------------------------------------------------------------------- /docs/public/images/WeChat/监听点击事件.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/WeChat/监听点击事件.png -------------------------------------------------------------------------------- /docs/public/images/golang/VScode安装插件.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/golang/VScode安装插件.png -------------------------------------------------------------------------------- /docs/public/images/sponsor/xiaobot.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/sponsor/xiaobot.png -------------------------------------------------------------------------------- /docs/public/images/webApp/大厂-拼多多适配.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/images/webApp/大厂-拼多多适配.png -------------------------------------------------------------------------------- /docs/public/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/logo.png -------------------------------------------------------------------------------- /docs/public/logo.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/logo.webp -------------------------------------------------------------------------------- /docs/public/logo1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/logo1.png -------------------------------------------------------------------------------- /docs/public/mstile-150x150.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/mstile-150x150.png -------------------------------------------------------------------------------- /docs/public/og.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/og.jpg -------------------------------------------------------------------------------- /docs/public/qrcode.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/qrcode.jpg -------------------------------------------------------------------------------- /docs/public/robots.txt: -------------------------------------------------------------------------------- 1 | 2 | Sitemap: https://fe.azhubaby.com/sitemap.xml 3 | 4 | User-agent: * 5 | 6 | 7 | User-Agent: * 8 | Allow: / 9 | 10 | -------------------------------------------------------------------------------- /docs/public/shenma-site-verification.txt: -------------------------------------------------------------------------------- 1 | shenma-site-verification:fe411010541768632c2c0f87027a13c6_1689216010 -------------------------------------------------------------------------------- /docs/public/site.webmanifest: -------------------------------------------------------------------------------- 1 | { 2 | "name": "五年前端三年面试", 3 | "short_name": "五年前端三年面试", 4 | "icons": [ 5 | { 6 | "src": "/android-chrome-192x192.png", 7 | "sizes": "192x192", 8 | "type": "image/png" 9 | }, 10 | { 11 | "src": "/android-chrome-512x512.png", 12 | "sizes": "512x512", 13 | "type": "image/png" 14 | } 15 | ], 16 | "theme_color": "#ffffff", 17 | "background_color": "#ffffff", 18 | "display": "standalone" 19 | } 20 | -------------------------------------------------------------------------------- /docs/public/site_logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johanazhu/fe/63577b32520a28e65dabd18848118d0c79474176/docs/public/site_logo.png -------------------------------------------------------------------------------- /docs/webpack/index.md: -------------------------------------------------------------------------------- 1 | # Webpack 导航 2 | 3 | > 妇人说：“我听话，我不哭的。可我还要给你说的，我不说就要憋死我了！我越是大着胆儿跟你往来，心里越是害怕，害怕这样下去，日子该怎么个过呀？！庄哥，我要嫁你，真的，我要嫁了你！”妇人说着，不等庄之蝶反应，就又说：“我想嫁给你，做长长久久的夫妻，我虽不是有什么本事的人，又没个社会地位，甚至连个西京城里的户口都没有，恐怕也比不了牛月清伺候你伺候得那么周到，但我敢说我会让你活得快乐，永远会让你快乐！因为我看得出来，我也感觉到了，你和一般人不一样，你是作家，你需要不停地寻找什么刺激，来激活你的艺术灵感。而一般人，也包括牛月清在内，她们可以管你吃好穿好，却难以不停地调整自己给你新鲜。你是个认真的人，这我一见到你就这么认为，但你为什么阴郁，即使笑着那阴郁我也看得出来，以至于又为什么能和我走到这一步呢？我猜想这其中有许多原因，但起码暴露了一点，就是你平日的一种性的压抑。 4 | > 我相信我并不是多坏的女人，成心要勾引你，坏你的家庭，也不是企图享有你的家业和声誉，那这是什么原因呢？或许别人会说你是喜新厌旧的男人，我更是水性杨花的浪荡女人了。不是的，人都有追求美好的天性，作为一个搞创作的人，喜新厌旧是一种创造欲的表现！可这些，自然难被一般女人所理解，因此牛月清也说她下辈子再不给作家当老婆了。在这一点上，我自信我比她们强，我知道、我也会来调整了我来适应你，使你常看常新。适应了你也并不是没有了我，却反倒使我也活得有滋有味。反过来说，就是我为我活得有滋有味了，你也就常看常新不会厌烦。 5 | 6 | 7 | 8 | 前端要想了解工程化，必先从 webpack 入手，无它，只因它生态最完善，文章、教程最多，最容易入门，面试时最容易被面到相关知识 9 | 10 | 这章我不会讲很多，对前端而言，工程化做的最多的就是**配置**，之后就是优化，其他像手写 webpack、原理之类，浅尝辄止 11 | 12 | [工程化、Babel、AST](./工程化、Babel、AST) 13 | 14 | [loader以及原理解析](./loader以及原理解析) 15 | 16 | [手写plugin](./手写plugin) 17 | 18 | [手写webpack](./手写webpack) 19 | 20 | [webpack其他文章](./webpack其他文章) 21 | 22 | 以及最重要的一个： 23 | 24 | [webpack 面试题](./面试题/) 25 | 26 | 27 | 28 | 29 | -------------------------------------------------------------------------------- /docs/webpack/loader以及原理解析.md: -------------------------------------------------------------------------------- 1 | # loader以及原理解析 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | ## Load原理 12 | 13 | 一个 loader 可以是一个普通函数 14 | 15 | 一个 loader 也可以是一个异步函数 16 | 17 | 18 | 19 | 20 | 21 | #### 单一职责原则 22 | 23 | webpack 里每个 loader 只做一件事 24 | 25 | 目前我们的 css-loader 做了两件事 26 | 27 | 一是把 CSS 变为 JS 字符串 28 | 29 | 二是把 JS 字符串放到 style 标签里 30 | 31 | 32 | 33 | #### raw-loader 源码 34 | 35 | https://github.com/webpack-contrib/raw-loader/ 36 | 37 | 20行 38 | 39 | #### css-loader 源码 40 | 41 | https://github.com/webpack-contrib/css-loader 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | ## 参考资料 52 | 53 | - [为什么 webpack4 默认支持 ES6 语法的压缩？](https://juejin.cn/post/6844903935413583880) 54 | - [手把手带你入门 Webpack Plugin](https://mp.weixin.qq.com/s/8oDENjCOsXxlA2fyuIN4GA) 55 | - [Webpack - 手把手教你写一个 loader / plugin](https://mp.weixin.qq.com/s/T9H5HYpo-MBgZiSnaHTi0A) 56 | -------------------------------------------------------------------------------- /docs/webpack/手写webpack.md: -------------------------------------------------------------------------------- 1 | # 手写 webpack 2 | 3 | 4 | 5 | webpack 做了两个问题 6 | 7 | - 把 import、export 转译为普通代码 8 | - 把所有文件打包成一个文件 9 | 10 | 11 | 12 | 13 | 14 | ## 怎么把 import/ export 转移成函数 15 | 16 | @babel/core 已经帮我们做了 17 | 18 | 19 | 20 | import 关键字会变成 require 函数 21 | 22 | export 关键字会变成 exports 对象 23 | 24 | 本质：ESModule 语法变成了 CommonJs 规则 25 | 26 | 但目前我们不知道 require 函数怎么写，先不管，假设 require 已经写好了 27 | 28 | 29 | 30 | 31 | 32 | ## 把多个文件打包成一个 33 | 34 | 打包成一个什么样的文件 35 | 36 | 肯定包含了所有模块，然后能执行所有模块 37 | 38 | 39 | 40 | ```javascript 41 | var depRelation = [ 42 | {key: 'index.js', deps:['a.js','b.js'], code: function... }, 43 | {key: 'a.js', deps: ['b.js'], code: function...}, 44 | {key: 'b.js', deps: ['a.js'], code: function... } 45 | ] 46 | execute(depRelation[0].key) // 执行入口文件 47 | function execute(key) { 48 | var item = depRelation.find(i => i.key === key) 49 | item.code() 50 | } 51 | ``` 52 | 53 | ### 待解决 54 | 55 | 1.depRelation 是对象，需要变成一个数组 56 | 57 | 2.code 是字符串，需要变成一个函数 58 | 59 | 3.execute 函数待完善 60 | 61 | 62 | 63 | 64 | 65 | ### 如何创建最终文件 66 | 67 | 打包 68 | 69 | 把 ES6 代码转译为 ES5 版本 70 | 71 | 所有代码合并到一个文件中 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | ## 参考资料 80 | 81 | - [实现一个简单的 Webpack](https://juejin.cn/post/6844903858179670030) 82 | - [90 行代码的 webpack，你确定不学吗？](https://mp.weixin.qq.com/s/vpQq3FcJuQkKXvxsq8c9Bw) 83 | - [微医前端带你从头建立构建体系【开篇】](https://mp.weixin.qq.com/s/-8rsHyu2nys_37nVlWiyCg) 84 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "fe", 3 | "private": true, 4 | "version": "1.0.0", 5 | "type": "module", 6 | "description": "五年前端三年面试", 7 | "main": "index.js", 8 | "scripts": { 9 | "dev": "vitepress dev docs", 10 | "start": "vitepress dev docs", 11 | "build": "vitepress build docs", 12 | "preview": "vitepress preview docs" 13 | }, 14 | "author": "johan", 15 | "license": "ISC", 16 | "devDependencies": { 17 | "@vite-pwa/vitepress": "^0.5.0", 18 | "vite": "^5.3.1", 19 | "vite-plugin-pwa": "^0.20.0", 20 | "vitepress": "1.2.3", 21 | "vue": "^3.4.30", 22 | "workbox-window": "^7.1.0" 23 | }, 24 | "dependencies": { 25 | "fabric-pure-browser": "^5.1.0", 26 | "jsdom": "^24.1.0", 27 | "markdown-it-mathjax3": "^4.3.2", 28 | "ua-parser-js": "1.0.38", 29 | "vue-router": "^4.4.0" 30 | } 31 | } 32 | --------------------------------------------------------------------------------