> For the complete documentation index, see [llms.txt](https://gzbin.gitbook.io/map/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://gzbin.gitbook.io/map/cs/frount.md). # 前端 | | | | -------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------- | | **The Net Ninja(**[**u**](https://www.youtube.com/c/TheNetNinja/playlists)**, )** | **六角學院(**[**u2b**](https://www.youtube.com/channel/UC-b2nGm0xLzic38Byti0VjA/playlists)**, )** | | **Ben Awad(**[**u**](https://www.youtube.com/c/BenAwad97/playlists)**, )** | Florin Pop [u](https://www.youtube.com/c/FlorinPop/playlists) | | 布魯斯前端 [u](https://www.youtube.com/c/%E5%B8%83%E9%AD%AF%E6%96%AF%E5%89%8D%E7%AB%AF/playlists) | 野生IT散修 [u](https://www.youtube.com/channel/UCLH9ADYJh3UaqYI554Lm84w/playlists) | | Pepcoding [u](https://www.youtube.com/c/Pepcoding/playlists) | 彭彭的課程 [u](https://www.youtube.com/c/%E5%BD%AD%E5%BD%AD%E7%9A%84%E8%AA%B2%E7%A8%8B) | | Leonard Chan [u](https://www.youtube.com/channel/UCEFSGtsGlCK7SNadurivx5Q/playlists) | Online Tutorials [u](https://www.youtube.com/c/OnlineTutorials4Designers/playlists) | | 程序员小山与Bug 抖音号：[xiaoshan.bug](https://www.douyin.com/user/MS4wLjABAAAAE8pu3OvkCMpd_mbHotBKV8Bth4LLl4OA_rVSIAz2Zq2xK22KVBfRlNtegdFy8wtm) | Progress Bar 進度條線上課程 [u](https://www.youtube.com/c/ProgressBarTW/playlists) | | Coding Tech [u](https://www.youtube.com/c/CodingTech) | 优途课堂 [u](https://www.youtube.com/@user-tq5fq1ee9m) | | Slaying The Dragon [u](https://www.youtube.com/@slayingthedragon) | Alex 宅幹嘛 [u](https://www.youtube.com/@AlexOtakuWhat) | | Nader Dabit [u](https://www.youtube.com/@naderdabit) | 黑马程序员 [u](https://www.youtube.com/@itheima666/playlists) | | **前端** | | | ---------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | **前端开发规范手册(**[**书栈**](https://www.bookstack.cn/books/Aaaaaashu-Guide)**, )** | 前端羊村长 抖音号： [webyangcunzhang](https://www.douyin.com/user/MS4wLjABAAAAVeJm5Oa2UlX76qQ0-HvcF49SC0h7eA9SjNtp_ZVwqhTBAEh09cDvcH3hdcvRzJye?author_id=3482891519263176\&enter_from=video_detail\&enter_method=video_title\&from_gid=7002185357970197793\&group_id=7002185357970197793\&log_pb=%7B%22impr_id%22%3A%22202110091511330101310550370405CAD4%22%7D) | | **前端开发者手册(**[**书栈**](https://www.bookstack.cn/books/front-end-handbook)**, )** | [Vue.js 技术揭秘](https://ustbhuangyi.github.io/vue-analysis/) [book](http://www.mianquan.net/tutorial/vue-analysis/) | | [**How you can simplify your CSS with :is()**](https://www.youtube.com/watch?v=McC4QkCvbaY) | [CodeSandbox](https://codesandbox.io/): Online Code Editor and IDE for Rapid Web Development [v](https://www.douyin.com/video/7045256496048885005) | | [**I Challenged The CSS King To A CSS Battle**](https://www.youtube.com/watch?v=-QgJgZCJvo4) | 小闪电 - [JsRun](https://jsrun.net/) 可以用手机写代码的JS在线编辑器网站 [v](https://www.douyin.com/video/7045256496048885005) | | [CodePen](https://codepen.io/): Online Code Editor and Front End Web Developer Community [v](https://www.douyin.com/video/7045256496048885005) | | | [Gitpod](https://www.gitpod.io/) - Always ready to code [v](https://www.douyin.com/video/7045256496048885005) | [JSFiddle](https://jsfiddle.net/) - Code Playground [v](https://www.douyin.com/video/7045256496048885005) | | **Coding Addict**[ **u**](https://www.youtube.com/c/CodingAddict/playlists) | 代码真香 [u](https://www.youtube.com/c/biezhi/playlists) | | SimonDev [u](https://www.youtube.com/@simondev758/playlists) | ❤️程序媛郭襄 抖音号： [31411193181](https://www.douyin.com/user/MS4wLjABAAAA5yOBDpv-Yu5Rsk0TCW6abBy5uHt8bj14FFLjn3TEbPXsfNp1fwY8O6hhyvxNBu-Y) | | | | | | | | | | ------------------------------------------------------------------------------------------------------------------------------------- | | 网站，值得前端工程师收藏 [v](https://www.douyin.com/video/7002896729465048331) | | 截图复刻网站，Github霸榜第一，单日2500+ Star，免费，快速AI生成网页 \| Screenshot to Code [AI煉金術](https://www.youtube.com/watch?v=6EwOQMEwngA) | | 前端、後端、資料庫是什麼？它們如何溝通？實際範例解說 [走歪的工程師James](https://www.youtube.com/watch?v=G-Ks1XYGyaY) | | App/小程序开发怎么选择跨端技术开发框架 [写代码的产品兔](https://www.douyin.com/video/7032020021471628574) | | Micro-Frontends Course - Beginner to Expert [freeCodeCamp](https://www.youtube.com/watch?v=lKKsjpH09dU) | | codepen [s](https://codepen.io/) 构建、测试和发现前端代码的最佳场所。[eg](https://codepen.io/Ma5a/full/jOBWBYw) | | FrontEndGitHub/[FrontEndGitHub](https://github.com/FrontEndGitHub/FrontEndGitHub) GitHub最全的前端资源汇总仓库 [前端导航](https://www.kwgg2020.com/) | | strikingly [s](https://cn.strikingly.com/) 几分钟制作一个网站 | | [Webflow](https://webflow.com/): Create a custom website \| No-code website builder | | 前端样式命名规范BEM [程序员蒙德伊彼](https://www.douyin.com/video/7155418032012135716) | ## Web 开发, Web Development | | | | ------------------------------------------------------------- | ------------------------------------------------------------------ | | LearnWebCode [u](https://www.youtube.com/watch?v=lgyszZhAZOI) | web3Mantra [u](https://www.youtube.com/@web3mantra/playlists) | | | Mohammad Taheri [u](https://www.youtube.com/@DevEmpower/playlists) | | | | | web 开发 | | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | |

Web开发是指创建和维护用于互联网或局域网的网站和应用程序的过程。它涉及多个方面，包括网站设计、前端开发、后端开发、数据库设计等。

网站设计是关于网站的外观和感觉，包括页面布局、色彩、图形和文本等。前端开发则是指实现网站设计的过程，通过使用HTML、CSS和JavaScript等技术来创建网站的用户界面。后端开发则是指实现网站功能的过程，包括数据处理、业务逻辑和服务器端编程。数据库设计则是关于如何存储和访问数据的过程，包括数据模型、查询和索引等。

Web开发需要使用多种编程语言和框架，如HTML、CSS、JavaScript、Python、PHP、Java和Ruby等。此外，Web开发也需要使用各种工具和技术，如版本控制工具、Web服务器、API、云计算和安全性等。

总的来说，Web开发是一个广泛的领域，需要掌握多种技能和知识才能创建出高质量、安全、稳定的网站和应用程序。

| |

以下是一个完整的Web开发路线图，包括了需要学习的技术和工具，以及学习的顺序和重点：

  1. 基础知识：HTML、CSS、JavaScript
  2. 版本控制工具：Git
  3. 服务器端编程语言：Python、Ruby、Java、PHP、Node.js
  4. 数据库：MySQL、PostgreSQL、MongoDB
  5. Web框架：Django、Ruby on Rails、Spring、Laravel、Express.js
  6. 前端框架：React、Vue.js、AngularJS
  7. 前端构建工具：Webpack、Gulp、Grunt
  8. CSS预处理器：Sass、Less、Stylus
  9. 前端组件库：Bootstrap、Materialize、Foundation
  10. 测试工具：Jasmine、Mocha、Karma、Selenium
  11. 部署工具：Docker、Heroku、AWS、DigitalOcean
  12. 移动端开发：React Native、Ionic、Cordova
  13. 数据可视化：D3.js、Highcharts、Chart.js
  14. 实时Web：Socket.IO、Firebase
  15. API设计和开发：REST、GraphQL
  16. Web性能优化：HTTP、CDN、缓存、压缩
  17. 搜索引擎优化：SEO、Meta标签、网站地图、Robots协议
  18. 安全性：HTTPS、XSS、CSRF、OWASP Top 10
  19. 计算机科学基础：数据结构、算法、计算机网络
  20. 人机交互设计：用户研究、原型设计、可用性测试
  21. 数据科学：统计学、数据分析、机器学习
  22. 人工智能：自然语言处理、计算机视觉、深度学习

需要注意的是，学习的顺序和重点应该根据您的具体情况和需求进行调整。例如，如果您的重点是前端开发，那么前端框架、组件库、构建工具和CSS预处理器等就应该放在前面。如果您的重点是移动端开发，那么移动端框架、API设计和开发、实时Web等就应该放在前面。总之，路线图只是一个参考，您需要根据自己的实际情况进行调整和完善。

| | How To Make A Website \~ 2022 \~ A Website Tutorial For Beginners [WebYoda](https://www.youtube.com/watch?v=MbKpfDyRMyo) | | baidu/[amis](https://github.com/baidu/amis) 前端低代码框架，通过 JSON 配置就能生成各种页面。 [v](https://www.douyin.com/video/7146905674667052318) | | Web 开发必备常识 [代码真香](https://www.youtube.com/playlist?list=PLK2w-tGRdrj7BxYFryNVGgAVD7nTzfSoA) | | Backend web development - a complete overview (2021) [SuperSimpleDev](https://www.youtube.com/watch?v=XBu54nfzxAQ) | | Build and Deploy a Modern Full Stack ECommerce Application with Stripe [JavaScript Mastery](https://www.youtube.com/watch?v=4mOkFXyxfsU) | | 用 Eleventy 做一个静态博客只要 10 分钟 [Randy Music](https://www.youtube.com/watch?v=epikKwnhvSs) | | World Wide Web Consortium (W3C)([s](https://www.w3.org), ) | | Thinkphp5商城项目实战第一季 [开发者学堂](https://www.youtube.com/playlist?list=PLGmd9-PCMLhYnmwGuTzPMcGmhRvJxpfp1) | | [ThinkPHP5.0完全开发手册](https://www.kancloud.cn/manual/thinkphp5) | | UIKit练习 仿网易新闻首页 [开发者学堂](https://www.youtube.com/playlist?list=PLGmd9-PCMLhbzJlad6fkYWXEcXGZ9swjo) | | 麦子商城项目制作 [开发者学堂](https://www.youtube.com/playlist?list=PLGmd9-PCMLhZWPTcreTRcvY_H6dZKFJuG) | | 麦子学院-使用Angularjs开发Web App [开发者学堂](https://www.youtube.com/playlist?list=PLGmd9-PCMLhbV9I2KieLn3GeMrLZX8JrF) [Yang Liu](https://www.youtube.com/playlist?list=PLhXu26RzZZTzn1uxx0vG5UQ2jTst1A5nF) | | Bottle Web开发 [开发者学堂](https://www.youtube.com/playlist?list=PLGmd9-PCMLhbhJ2seQMvyCp3QLSYStQSa) | | WEB系统基础 [开发者学堂](https://www.youtube.com/playlist?list=PLGmd9-PCMLhakkkW69D7IIDfrnExhnucB) | | python自动化运维+web监控系统 [开发者学堂](https://www.youtube.com/playlist?list=PLGmd9-PCMLhbHu1uI4g6Bb44gGpq2aXvJ) | | node js开发web应用基础 [开发者学堂](https://www.youtube.com/playlist?list=PLGmd9-PCMLhYawh3CGLy7c6JLkIxAr1ql) | | Java Web扩展 Jsf [开发者学堂](https://www.youtube.com/playlist?list=PLGmd9-PCMLhZZwUFY88NgQA1gGa7dodV2) | | Web Performance Optimization [Udacity](https://www.youtube.com/playlist?list=PLAwxTw4SYaPmKmNX-INgcxQWf30KuWa_A) | | Responsive Web Design Fundamentals [Udacity](https://www.youtube.com/playlist?list=PLAwxTw4SYaPl8h1mZezuYpMQV6t8s8ktb) | | How to Make a Landing Page using HTML, SCSS, and JavaScript - Full Course [freeCodeCamp](https://www.youtube.com/watch?v=aoQ6S1a32j8) | | Full Stack Web Development Course [Web Dev Simplified](https://www.youtube.com/playlist?list=PLZlA0Gpn_vH8jbFkBjOuFjhxANC63OmXM) | | This Website Has No Code or Does It? [PwnFunction](https://www.youtube.com/watch?v=msdymgkhePo) | | Web Hacking 101 [PwnFunction](https://www.youtube.com/playlist?list=PLI_rLWXMqpSl_TqX9bbisW-d7tDqcVvOJ) | |

Web Development In 2023 - A Practical Guide Traversy Media 2:54:24

Web Development In 2021 - A Practical Guide Traversy Media 1:05:15

| |

小白用户如何创建一个属于自己的网站？（阿里云/WordPress/Astra/Elementor/Https）

Mac云课堂

| | 零基础教你如何快速搭建一个属于自己的视频网站！苹果cms网站搭建 视频网站赚钱 [金熊猫](https://www.youtube.com/watch?v=d3JDGZrSoKE) | | 在线电影网站搭建 零基础搭建在线影视网站([一](https://www.youtube.com/watch?v=Hg64-noVnTE))([二](https://www.youtube.com/watch?v=7RF013Zz81A))([三](https://www.youtube.com/watch?v=PeM7-MB6J00)) Duke | | Gatsby Static Site Generator Tutorial [freeCodeCamp](https://www.youtube.com/watch?v=RaTpreA0v7Q) | | Make A Python Website As Fast As Possible! [Tech With Tim](https://www.youtube.com/watch?v=kng-mJJby8g) | | JavaScript Tutorial - PuzzleCam Game　[freeCodeCamp](https://www.youtube.com/watch?v=HS6KHYIYdXc) | | Full Stack Web Development in the Cloud Course - Svelte, Postgres, Vercel, Gitpod [freeCodeCamp](https://www.youtube.com/watch?v=OUzaUJ3gEug) | | Full Stack Projects [Coding With Dawid](https://www.youtube.com/playlist?list=PLChiukrA-RMOEB1PRQqB1NITIRsDz9pIN) | | How to Put a Website Online: Template, Coding, Domain, Hosting, and DNS [freeCodeCamp](https://www.youtube.com/watch?v=NQP89ish9t8) | | Web Applications for Everybody Course - Dr. Chuck Teaches HTML, PHP, SQL, CSS, JavaScript, and more! [freeCodeCamp](https://www.youtube.com/watch?v=xr6uZDRTna0) | | Ultimate Freelancing Guide for Web Developers (Make money through freelance programming!) [freeCodeCamp](https://www.youtube.com/watch?v=4TIvB8zDFio) | | How to Find Freelance Jobs [freeCodeCamp](https://www.youtube.com/watch?v=Z63TxAJotgQ) | | Create a Video Membership Web App from Scratch with Python, NoSQL, & FastAPI [CodingEntrepreneurs](https://www.youtube.com/watch?v=KQ-u4RcFLBY) | | Build a Mindblowing 3D Portfolio Website // Three.js Beginner’s Tutorial [Fireship](https://www.youtube.com/watch?v=Q7AOvWpIVHU) | | Build a Responsive Website \| HTML, CSS Grid, Flexbox & More [Traversy Media](https://www.youtube.com/watch?v=p0bGHP-PXD4) | | How to use AI Art and ChatGPT to Create a Insane Web Designs [Codex Community](https://www.youtube.com/watch?v=8I3NTE4cn5s) | | Frontend Web Development: In-Depth Project Tutorial (HTML, CSS, JavaScript, TypeScript, React) [freeCodeCamp](https://www.youtube.com/watch?v=MsnQ5uepIaE) 10:02:09 | | Web Development Tutorials For Beginners In Hindi: HTML, CSS, JavaScript & More [CodeWithHarry](https://www.youtube.com/playlist?list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg) | | Web Development [Ezee AI (Shree Balaji Institute)](https://www.youtube.com/playlist?list=PLYdsgrylSw-jOoJTv4rgKs8_iV7S3wC57) | | | | | | | - | - | | | | | | | | | | | | | | ---------------------------------------------------------------------------------------------------------- | - | | Mobile Web Development [Udacity](https://www.youtube.com/playlist?list=PLAwxTw4SYaPm5NhhVow5zCtZ_eScc1f-b) | | {% content-ref url="/pages/-MaSwQKyQAIs2\_sLgj-i" %} [区块链](/map/algorithm/crypto-and-blockchain.md) {% endcontent-ref %} #### 黑马前端 | | | -------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | 黑马程序员Pink老师前端HTML+CSS教程 [野生IT散修](https://www.youtube.com/playlist?list=PLKLUwbV5J_7e22Cd0qfD51ceUAL23ObVc) [gitee](https://gitee.com/xiaoqiang001/html_css_material) | | 黑马程序员Pink老师前端Javascript基础教程（语法篇） [野生IT散修](https://www.youtube.com/playlist?list=PLKLUwbV5J_7dkgKBMDfFrgJTG4rxWXiHX) | | 黑马程序员Pink老师前端Javascript进阶教程（ DOM / BOM篇）[ 野生IT散修](https://www.youtube.com/playlist?list=PLKLUwbV5J_7fB6CEP48ivmmutJ8BWQf8k) | | 黑马程序员Pink前端Javascript高阶教程(面向对象+ES6) [野生IT散修](https://www.youtube.com/playlist?list=PLKLUwbV5J_7cSHVUfn3PMPs6tfvsfzkBE) | | 黑马程序员Pink老师前端Jquery教程 [野生IT散修](https://www.youtube.com/playlist?list=PLKLUwbV5J_7cP5gz9lU7U_IobaAGRoO5p) | | | ## Ajax | | | | ------------------------------------------------------------------------------------------------- | -------------------------------------------------- | | Intro to Ajax [Udacity](https://www.youtube.com/playlist?list=PLAwxTw4SYaPkZTDQ0vR9BwkHnku9QRwqh) | 优途课堂 [u](https://www.youtube.com/@user-tq5fq1ee9m) | | AJAX / JSON 教學 [六角學院](https://www.youtube.com/watch?v=DxdTWIYqIzU) | | | | | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | |

AJAX（Asynchronous JavaScript and XML）是一种通过JavaScript和XML在Web页面中创建异步请求和响应的技术。通过AJAX，Web应用程序可以在不刷新整个页面的情况下与服务器进行通信，并且可以更新页面的一部分内容，从而提高用户的交互性和体验。

在AJAX中，JavaScript负责在Web浏览器中创建异步请求，并在后台向服务器发送请求，服务器响应后，JavaScript再处理返回的数据，将结果更新到页面上。XML经常被用来作为数据交换的格式，但是现在也有很多使用JSON等其他格式的AJAX应用。

AJAX的优点包括：

  1. 提高用户体验，因为用户不需要等待整个页面刷新；
  2. 减少服务器的负载，因为只有需要更新的数据才会被传输；
  3. 可以实现动态网页，允许用户与服务器进行交互。

AJAX技术已经被广泛应用于现代Web应用程序中，例如谷歌地图、Facebook和Twitter等。

| | | | | ## Vuejs | | | | ------------------------------- | -------------------------------------------------- | | Vuejs([s](https://vuejs.org), ) | Reactjs([s](https://reactjs.org), ) | | | 优途课堂 [u](https://www.youtube.com/@user-tq5fq1ee9m) | | | | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | |

Vue.js是一种流行的JavaScript框架，用于构建用户界面。它是一种响应式的框架，可以使开发者轻松地构建交互性强、易于维护的单页应用程序（SPA）和动态Web界面。

Vue.js由尤雨溪在2014年创建，并于同年在GitHub上发布。它的主要特点包括：

  1. 轻量级：Vue.js的文件大小很小，压缩后只有几十KB，可以很快地下载和使用。
  2. 组件化：Vue.js的核心是组件系统，可以将UI拆分为独立、可重用的组件，从而实现代码的模块化和可复用性。
  3. 双向数据绑定：Vue.js支持双向数据绑定，可以使视图层和数据层之间的同步更加简单。
  4. 指令系统：Vue.js提供了一些内置指令，例如v-bind、v-if、v-for、v-on等，可以轻松地操作DOM元素。
  5. 虚拟DOM：Vue.js使用虚拟DOM来提高应用程序的性能，通过对虚拟DOM进行操作，最终更新真实的DOM，从而避免了直接操作DOM所带来的性能损失。

Vue.js还具有其他一些功能，例如过渡效果、过滤器、计算属性等，这些功能可以帮助开发者构建更加丰富、交互性更强的Web应用程序。Vue.js也与其他前端框架（例如React和Angular）有很好的兼容性，可以与它们一起使用。

| | Vue js详解 [开发者学堂](https://www.youtube.com/playlist?list=PLGmd9-PCMLha-LwiC9WjsMhppOeZEpzJp) | | Learn Vue.js - Full Course for Beginners - 2019 [freeCodeCamp](https://www.youtube.com/watch?v=4deVCNJq3qc) | |

Vue.js：纪录片 Honeypot

Vue.js: The Documentary

| | Vue.js Course for Beginners \[2021 Tutorial] [freeCodeCamp](https://www.youtube.com/watch?v=FXpIoQ_rT_c) | | Create a Twitter Clone with Vue.js, Quasar Framework & Firebase for iOS, Android, Mac & Windows　[freeCodeCamp](https://www.youtube.com/watch?v=la-0ulfn0_M) | | PanJiaChen/[vue-element-admin](https://github.com/PanJiaChen/vue-element-admin) [v](https://www.douyin.com/video/7144685614561086728) | | \[ 想入門，我陪你 ] Vue 3 宅家輕鬆玩｜Day 0：15 步認識 Vue [Alex 宅幹嘛](https://www.youtube.com/watch?v=oDd5KtEtAlo) | ## React | | | | ------------------------------------------------------------------ | ------------------------------------------------------------------------- | | evening kid([u](https://www.youtube.com/c/eveningkid/playlists), ) | Code With Antonio [u](https://www.youtube.com/@codewithantonio/playlists) | | | | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | |

React是由Facebook开发的一个JavaScript库，用于构建用户界面。它是一个开源的库，使开发人员能够使用组件化方法快速构建可重用的UI元素。React具有高度的灵活性和性能优势，可以用于构建各种Web应用程序和移动应用程序。

React的核心思想是组件化。开发人员可以将应用程序拆分为小组件，每个组件可以独立开发、测试和维护。React中的组件由JavaScript编写，并使用类或函数声明。React还提供了一些内置组件，例如文本输入框、按钮和列表。

React使用虚拟DOM（Virtual DOM）来更新页面。虚拟DOM是一个轻量级的JavaScript对象，表示真实DOM的状态。当数据发生变化时，React会计算虚拟DOM的差异，并仅更新需要更新的部分，这使得React具有更高的性能和更快的渲染速度。

React还可以与其他库和框架一起使用，例如Redux、React Router和Axios等。它还有大量的社区支持和资源，包括文档、教程、示例和开发工具。

| |

React JS 和 React 实际上指的是同一个东西，都是 Facebook 开发的 JavaScript 库，用于构建用户界面。React 提供了一种声明式的编程模型，允许开发人员以组件化的方式构建应用程序，这些组件可以通过将它们组合在一起来形成复杂的用户界面。

通常情况下，人们称呼 React 时，指的是 React JS，因为它是最常用的 React 实现方式之一。但是，React 还有其他实现方式，如 React Native，用于构建原生移动应用程序，以及 React VR，用于构建虚拟现实应用程序。无论使用哪种实现方式，React 的核心概念和使用方式都是相同的。

| | Let's Build a Full-Stack AMAZON Clone with REACT JS for Beginners (Full E-Comm Store in 8 Hrs) 2021 [Clever Programmer](https://www.youtube.com/watch?v=RDV3Z1KCBvo) | | All The JavaScript You Need To Know For React [PedroTech](https://www.youtube.com/watch?v=m55PTVUrlnA) | | Build and Deploy a Modern YouTube Clone Application in React JS with Material UI 5 \| RapidAPI [JavaScript Mastery](https://www.youtube.com/watch?v=FHTbsZEJspU) | | Build and Deploy a Fully Responsive Website with Modern UI/UX in React JS with Tailwind [JavaScript Mastery](https://www.youtube.com/watch?v=_oO4Qi5aVZs) | | React、React.js、React Native的区别 [壹点微尘](https://www.jianshu.com/p/75fe1a5a5fd7) | | React JS Tutorials [Max Teaches Tech](https://www.youtube.com/playlist?list=PL30AETbxgR-cyNBjRTUuaHETPAuxefwul) | | Create 3D Site with Spline and React - Full Course [DesignCode](https://www.youtube.com/watch?v=EJxeMbDTkVI) | | Build and Deploy a React Admin Dashboard App With Theming, Tables, Charts, Calendar, Kanban and More [JavaScript Mastery](https://www.youtube.com/watch?v=jx5hdo50a2M) | | React Redux Full Course for Beginners \| Redux Toolkit Complete Tutorial [Dave Gray](https://www.youtube.com/watch?v=NqzdVN2tyvQ) | | Fullstack Flask React Tutorial - Master Flask Basics And Build A Python Flask React App \| 2020 HD [THE SHOW](https://www.youtube.com/watch?v=cb1vy1HpVwk) | | React Project Tutorial – Build a Portfolio Website w/ Advanced Animations [freeCodeCamp](https://www.youtube.com/watch?v=bmpI252DmiI) | | Instagram Clone Full Tutorial - Using React, Express & Sanity [Tech With Tim](https://www.youtube.com/watch?v=iRORiaLAgaE) | | React with Redux Toolkit Crash Course [Laith Harb](https://www.youtube.com/watch?v=jR4fagDcvrc) | | Livestream with Kent: React Patterns [Kent C. Dodds](https://www.youtube.com/watch?v=WV0UUcSPk-0) | | React Crash Course - Build A Full Recipe App Tutorial [Dev Ed](https://www.youtube.com/watch?v=xc4uOzlndAk) | | React Course - Beginner's Tutorial for React JavaScript Library \[2022] [freeCodeCamp](https://www.youtube.com/watch?v=bMknfKXIFA8) | | React [James Q Quick](https://www.youtube.com/playlist?list=PLDlWc9AfQBfYnzzS-tUQbvl6OtZhNmSZ3) | | ReactJS从入门到实战 [开发者学堂](https://www.youtube.com/playlist?list=PLGmd9-PCMLhaIGUur0mtlTuZocJXB5aCM) | | React实战开发特训班 [Yang Liu](https://www.youtube.com/playlist?list=PLhXu26RzZZTyvECwwf_TCbCSSRO0y0qrC) | | React Native documentaries [evening kid](https://www.youtube.com/playlist?list=PLiVL41zTt2lLuUS7_7MAehMkimi6KcxF_) | | Learn React Native [evening kid](https://www.youtube.com/playlist?list=PLiVL41zTt2lKiTGGgY7eu9Sf-U5ghbZsQ) | | React Optimisation [evening kid](https://www.youtube.com/playlist?list=PLiVL41zTt2lJt6lPOX1Woe449zc-Z-pVa) | | How To Animated [evening kid](https://www.youtube.com/playlist?list=PLiVL41zTt2lIIdZvWBwzoCjOb84DKtOX6) | | You Can Animated [evening kid](https://www.youtube.com/playlist?list=PLiVL41zTt2lLEu23KNdjtV1myqZcSQkwh) | | Full MERN Website React Nodejs w/ GraphQL Tailwind and Docker From Zero To Deployment + GIVEAWAY [CoderOne](https://www.youtube.com/watch?v=4ELH8CT4J0A) | | React / GraphQL Course - Build a social media app (MERNG Stack) [freeCodeCamp](https://www.youtube.com/watch?v=n1mdAPFq2Os) | | Full Stack MERN Project - Build and Deploy an App \| React + Redux, Node, Express, MongoDB \[Part 2/2] [JavaScript Mastery](https://www.youtube.com/watch?v=aibtHnbeuio) | | Let's Create a Rich Text Editor with Draftjs and React [CoderOne](https://www.youtube.com/playlist?list=PLvXDmnBbOF7QNkpFwzsbKvZUUAtedgIhn) | | Build React Apps (Fleux & Redux) Practical Examples [CoderOne](https://www.youtube.com/playlist?list=PLvXDmnBbOF7RnYiZvDwl2Pzcs2kfi10wd) | | Redux Tutorial - Beginner to Advanced [freeCodeCamp](https://www.youtube.com/watch?v=zrs7u6bdbUw) | | React JS Course for Beginners - 2021 Tutorial [freeCodeCamp](https://www.youtube.com/watch?v=nTeuhbP7wdE) | | Full Stack React & Firebase Tutorial - Build a social media app [freeCodeCamp](https://www.youtube.com/watch?v=m_u6P5k0vP0) | | Learn the MERN Stack - Full Tutorial (MongoDB, Express, React, Node.js) [freeCodeCamp](https://www.youtube.com/watch?v=7CqJlxBYj-M) | | MERN Stack Full Tutorial & Project \| Complete All-in-One Course \| 8 Hours [Dave Gray](https://www.youtube.com/watch?v=CvCiNeLnZ00) | | React JS - React Tutorial for Beginners [Programming with Mosh](https://www.youtube.com/watch?v=Ke90Tje7VS0) | | React JS Crash Course for Beginners - Build 4 Apps in 12 Hours (Redux, Firebase, Auth + More) \[2021] [Sonny Sangha](https://www.youtube.com/watch?v=tbvguOj8C-o) | | React JS Crash Course 2021 [Traversy Media](https://www.youtube.com/watch?v=w7ejDZ8SWv8) | | React JS Tutorial – Build a Weather App With Cities Autocomplete [freeCodeCamp](https://www.youtube.com/watch?v=Reny0cTTv24) | | Data Visualization with D3, JavaScript, React - Full Course \[2021] [freeCodeCamp](https://www.youtube.com/watch?v=2LhoCfjm8R4) | | Build an Instagram Clone with React Native, Firebase Firestore, Redux, Expo - Full Course [freeCodeCamp](https://www.youtube.com/watch?v=1hPgQWbWmEk) | | Code a Reddit Clone with React, Next.js, Firebase v9, Chakra UI – Full Course [freeCodeCamp](https://www.youtube.com/watch?v=rCm5RVYKWVg) | | React Crash Course for Beginners 2021 - Learn ReactJS from Scratch in this 100% Free Tutorial! [Academind](https://www.youtube.com/watch?v=Dorf8i6lCuk) | | React Native Tutorial for Beginners - Crash Course 2020 [Academind](https://www.youtube.com/watch?v=qSRrxpdMpVc) | | FARM Stack Course - FastAPI, React, MongoDB [freeCodeCamp](https://www.youtube.com/watch?v=OzUzrs8uJl8) | | FastAPI Course for Beginners [freeCodeCamp](https://www.youtube.com/watch?v=tLKKmouUams) | | Full React Course 2020 - Learn Fundamentals, Hooks, Context API, React Router, Custom Hooks [freeCodeCamp](https://www.youtube.com/watch?v=4UZrsTqkcW4) | | Code a Dictionary with React and Material UI - Tutorial [freeCodeCamp](https://www.youtube.com/watch?v=ToXna81iij0) | | 🔴 REAL TIME CHAT APP USING REACT AND SOCKET.IO IN HINDI | | Chat Application Tutorial With Socket.IO & React [Coding Expert](https://www.youtube.com/watch?v=8wAy_xv8b9o) | | Build and Deploy a Fully Responsive Modern UI/UX Website in React JS [JavaScript Mastery](https://www.youtube.com/watch?v=LMagNcngvcU) | | Build and Deploy a React Cryptocurrency App and Master Redux Toolkit in One Video [JavaScript Mastery](https://www.youtube.com/watch?v=9DDX3US3kss) | | Learn React Native Gestures and Animations - Tutorial [freeCodeCamp](https://www.youtube.com/watch?v=wEVjaXK4sYQ) | | 2020版React入门到大神【千锋】 [千锋教育](https://www.youtube.com/playlist?list=PLwDQt7s1o9J7u0lzzlFQYx5sJ7GvZkA4i) | | How To Create An Advanced Shopping Cart With React and TypeScript [Web Dev Simplified](https://www.youtube.com/watch?v=lATafp15HWA) | | React Video Chat App \| WebRTC Video Chat Zoom Clone \| Tabnine [JavaScript Mastery](https://www.youtube.com/watch?v=oxFr7we3LC8) | | How To Create A Messaging App With Socket.io And React [Web Dev Simplified](https://www.youtube.com/watch?v=tBr-PybP_9c) | | Realtime Chat With Users & Rooms - Socket.io, Node & Express [Traversy Media](https://www.youtube.com/watch?v=jD7FnbI76Hg) | | React State Management – Intermediate JavaScript Course [freeCodeCamp](https://www.youtube.com/watch?v=-bEzt5ISACA) | | Next.js React Framework Course – Build and Deploy a Full Stack App From scratch [freeCodeCamp](https://www.youtube.com/watch?v=KjY94sAKLlw) | | ChatGPT Clone – OpenAI API and React Tutorial [freeCodeCamp](https://www.youtube.com/watch?v=98bGwOYoEGg) | | React JS Tutorial For Beginners [Leon Noel](https://www.youtube.com/watch?v=edsuuCsiah0) | | Learn React 18 with Redux Toolkit – Full Tutorial for Beginners [freeCodeCamp](https://www.youtube.com/watch?v=2-crBg6wpp0) | | React Hooks Course - All React Hooks Explained [PedroTech](https://www.youtube.com/watch?v=LlvBzyy-558) | | React.js Full Course in Hindi for Beginners - 2023 \| Master React in 12 Hours [web3Mantra](https://www.youtube.com/watch?v=lLeZ8Cr2YVM) | | React Native Course – Android and iOS App Development [freeCodeCamp](https://www.youtube.com/watch?v=obH0Po_RdWk) | | Filmyverse React Project in Hindi \| Tailwindcss \| Firebase \| Firestore DB \| OTP Authentication [web3Mantra](https://www.youtube.com/watch?v=NdQN9f9LAcM) | | Pet Store Fullstack project with React18, ASP.NET Core7 WebAPI, TypeScript and Entity Framework Core [Mohammad Taheri](https://www.youtube.com/watch?v=5N9FsYPsAso) | | Build a LinkedIn Clone with React and Firebase – Tutorial [freeCodeCamp](https://www.youtube.com/watch?v=HimR8Xtz17U) | | React Router 6 – Full Course [freeCodeCamp](https://www.youtube.com/watch?v=nDGA3km5He4) 9:44:42 | | Zustand React State Management Course (Simple Redux Alternative) [freeCodeCamp](https://www.youtube.com/watch?v=fZPgBnL2x-Q) | | | ### Next.js | | | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | |

Next.js是一个基于React的服务器端渲染框架，它允许开发者使用React编写应用程序，并且可以在服务端进行渲染，以提高应用程序的性能和SEO。Next.js还提供了许多实用功能，例如静态文件服务、自动代码拆分、CSS模块化、快速开发API等。以下是Next.js的一些特点：

  1. 服务器端渲染：通过服务器端渲染，可以加速首次渲染和提高SEO。
  2. 自动代码拆分：Next.js自动将页面分割成较小的块，只在需要时加载，从而提高应用程序的性能。
  3. 预渲染静态页面：通过预渲染静态页面，可以加快页面的加载速度和SEO排名。
  4. 完整的CSS支持：Next.js允许开发者使用CSS模块化，从而避免CSS命名冲突和其他问题。
  5. 快速开发API：Next.js提供了一个轻量级API路由器，可帮助开发者快速构建API。
  6. TypeScript支持：Next.js支持TypeScript，从而可以提供更好的类型检查和IDE支持。
  7. 开箱即用：Next.js提供了许多有用的功能，如Hot Module Replacement、静态文件服务等，使开发人员可以更快地开发应用程序。

总的来说，Next.js是一个快速、简单、可靠的React框架，它提供了服务器端渲染、自动代码拆分、预渲染静态页面、CSS模块化、快速开发API等实用功能，使开发人员可以更快地构建现代化的Web应用程序。

| | [site](https://www.nextjs.cn) | | Nextjs Crash Course with Fauna, Auth0, Tailwind, and More! [James Q Quick](https://www.youtube.com/playlist?list=PLDlWc9AfQBfao-jcw-SEiyON58ipmIzbL) | | Next.js Crash Course for Beginners 2021 - Learn NextJS from Scratch in this 100% Free Tutorial! [Academind](https://www.youtube.com/watch?v=MFuwkrseXVE) | | Next.js for Beginners - Full Course [freeCodeCamp](https://www.youtube.com/watch?v=1WmNXEVia8I) | | 🔴 Build Modern Portfolio with NextJS, TypeScript, SSR, and CMS [Clever Programmer](https://www.youtube.com/watch?v=Ym6RYyRBPaA) | | Next.js 12.3 Overview: Improved Fast Refresh, TypeScript Auto-Install, and more. [Vercel](https://www.youtube.com/watch?v=3UD7Y02AcN4) | | The Story of Next.js [uidotdev](https://www.youtube.com/watch?v=BILxV_vrZO0) | | How to Create a Stunning Portfolio Website with Nextjs, Tailwind CSS and Framer-motion🌟 [CodeBucks](https://www.youtube.com/watch?v=Yw7yWHigGKI) 5:50:43 | | Real-Time Messenger Clone: Next.js 13, React, Tailwind, Prisma, MongoDB, NextAuth, Pusher (2023) [Code With Antonio](https://www.youtube.com/watch?v=PGPGcKBpAk8) | | Full Stack Airbnb Clone with Next.js 13 App Router: React, Tailwind, Prisma, MongoDB, NextAuth 2023 [Code With Antonio](https://www.youtube.com/watch?v=c_-b_isI4vg) 8:40:33 | | | ### Redux | | | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | | | 就是用来共享项目数据的，比如你项目中一个数据好多页面或者地方都要用到，并且要同步数据的变化，也就是说数据变了，所有使用的地方都要立即更新，但是使用props等数据传递太麻烦了，一层层传递上去，又一层层传递下来，实在太繁琐了，Redux就解决了这个问题，简单的实现项目的动态数据共享。[s](https://juejin.cn/post/7112465342479204389) | | Redux 中文官网 [s](https://cn.redux.js.org/) | | Redux and Modern Redux Toolkit with Asynchronous Operation – Full Course [freeCodeCamp](https://www.youtube.com/watch?v=SlC8941Wwrk) | | | | | ## Node | node | | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | |

Node.js是一个基于Chrome V8 JavaScript引擎的开放源代码、跨平台、事件驱动、非阻塞I/O的服务器端JavaScript环境。

Node.js最初是由Ryan Dahl在2009年创建的，目的是提供一种在Web服务器上运行JavaScript代码的解决方案。Node.js内置了许多用于网络编程的库，使得它可以用于构建高性能、可扩展的网络应用程序。

Node.js的最大特点是单线程、异步IO模型和事件驱动，这意味着Node.js可以在处理大量并发连接时保持较低的系统资源开销。同时，Node.js的模块化系统也使得开发人员可以轻松地使用第三方模块来扩展功能，从而加速开发过程。

Node.js已经成为了一个非常流行的技术，被广泛应用于Web应用程序、实时应用程序、API服务器、微服务等领域。

| | Node.js 教程 [菜鸟教程](https://www.runoob.com/nodejs/nodejs-tutorial.html) NPM 使用介绍 [菜鸟教程](https://www.runoob.com/nodejs/nodejs-npm.html) | | **一起学 Node.js(**[**书栈**](https://www.bookstack.cn/books/N-blog)**, )** | | **Node.js Tutorials(**[**freeCodeCamp.org**](https://www.youtube.com/playlist?list=PLWKjhJtqVAbmGQoa3vFjeRbRADAOC9drk)**)** | | node js上最新HTML5开发框架 Meteor [开发者学堂](https://www.youtube.com/playlist?list=PLGmd9-PCMLhaba39ov73zbIgLCUErUZNf) | | node js开发web应用基础 [开发者学堂](https://www.youtube.com/playlist?list=PLGmd9-PCMLhYawh3CGLy7c6JLkIxAr1ql) | | Node.js [CodePulse](https://www.youtube.com/playlist?list=PLZQftyCk7_SeiyU54I5pitw3o6w-Nl9S9) | | Deno [CodePulse](https://www.youtube.com/playlist?list=PLZQftyCk7_ScDd471zmrENcQzHKhD806i) | | Nodejs From Scratch For Beginners (FS, Events and Express) [CoderOne](https://www.youtube.com/playlist?list=PLvXDmnBbOF7Sxr-sdW72qO62Su6Pxp9Ly) | | Socket.io Nodejs Build Real Time Apps [CoderOne](https://www.youtube.com/playlist?list=PLvXDmnBbOF7R2AVit9M9cjbmC7CC48tyD) | | Nodejs From Scratch For Beginners (FS, Events and Express) [CoderOne](https://www.youtube.com/playlist?list=PLvXDmnBbOF7Sxr-sdW72qO62Su6Pxp9Ly) | | Let's Create a Blockchain on Nodejs With MongoDB [CoderOne](https://www.youtube.com/playlist?list=PLvXDmnBbOF7S0L5y85dK5s2oSrp5GcTJ4) | | Let's Create a Command Line Interface CLI From Scratch Nodejs [CoderOne](https://www.youtube.com/playlist?list=PLvXDmnBbOF7SUw-_GWcATbLkmRB-BmQHK) | | Nodejs之消息服务器开发 [开发者学堂](https://www.youtube.com/playlist?list=PLGmd9-PCMLhZQaU20Ay2gCVxyBIovkCX0) | | Node.js and Express.js - Full Course [freeCodeCamp](https://www.youtube.com/watch?v=Oe421EPjeBE) | | Node.js Crash Course [Traversy Media](https://www.youtube.com/watch?v=fBNz5xF-Kx4) | | 7 Ways to Deploy a Node.js App [Fireship](https://www.youtube.com/watch?v=uEVmD6n8Il0) | | Web Scraping with Puppeteer & Node.js: Chrome Automation [LearnWebCode](https://www.youtube.com/watch?v=lgyszZhAZOI) | | Learn Node.js - Full Tutorial for Beginners [freeCodeCamp](https://www.youtube.com/watch?v=RLtyhwFtXQA) | | Node.js Full Course for Beginners \| Complete All-in-One Tutorial \| 7 Hours [Dave Gray](https://www.youtube.com/watch?v=f2EqECiTBL8) | | Node.js Tutorials [Dave Gray](https://www.youtube.com/playlist?list=PL0Zuz27SZ-6PFkIxaJ6Xx_X46avTM1aYw) [Traversy Media](https://www.youtube.com/playlist?list=PLillGF-Rfqbb786uDGaO8r9atpx1kt3iP) | | Node.js Tutorial \| Node.js Tutorial For Beginners \| Learn Node.js \| NodeJS Tutorial \| [Simplilearn](https://www.youtube.com/watch?v=CELj-DCB0go) | | Node.js & Stripe API - Ebook Sales App & Heroku Deploy [Traversy Media](https://www.youtube.com/watch?v=QT3_zT97_1g) | | Node.js / Express Course - Build 4 Projects [freeCodeCamp](https://www.youtube.com/watch?v=qwfE7fSVaZM) | | \[Tutorialsplanet.NET] Udemy - The Complete Node.js Developer Course (3rd Edition) | | Full Stack Web Development for Beginners (Full Course on HTML, CSS, JavaScript, Node.js, MongoDB) [freeCodeCamp](https://www.youtube.com/watch?v=nu_pCVPKzTk) | | How To Delete Data with nodejs [Njoku Samson Ebere](https://www.youtube.com/watch?v=JptWEtAtOeA) | | Node.js编程系列教程 [YuFeng Deng](https://www.youtube.com/playlist?list=PL3dZh-p-vVofgTEnJ_SL1LM9jxmQp19E2) | | | | | | | - | - | | | | | | | ---------------------------------------------------------------------------------------------------------------- | | Express [开发者学堂](https://www.youtube.com/playlist?list=PLGmd9-PCMLhYtyErKbbNlADtecXVJgNDT) | | **Node and Express Tutorial(**[**u**](https://www.youtube.com/watch?v=TNV0_7QRDwY)**, )** | | Gulp+Angular+Express实现简易任务管理系统 [开发者学堂](https://www.youtube.com/playlist?list=PLGmd9-PCMLhYUdJkNhxhorb3PiNDUr4zb) | ## HTML5 and CSS3 | | | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | Learn HTML & CSS – Full Course for Beginners [freeCodeCamp](https://www.youtube.com/watch?v=a_iQb1lnAEQ) | | HTML / CSS Tutorial – Create an Order Summary Component [freeCodeCamp](https://www.youtube.com/watch?v=SR5GxoFhIAU) | | 10 HTML, CSS & JAVASCRIPT Projects For BEGINNER (Road to PRO LEVEL) [ProgrammingWithSingh](https://www.youtube.com/watch?v=XQpDfZE3SUM) | | SpaceX Website Clone - HTML, CSS & JavaScript [Traversy Media](https://www.youtube.com/watch?v=wryPX7KSwSc) | | 5 HTML, CSS & JS Mini Projects - Scroll Animation, Rotating Navigation, Drag Events, etc [Traversy Media](https://www.youtube.com/watch?v=HtunPQtr-Xw) | | Create A Responsive Website Using HTML, CSS And Bootstrap 4 In Hindi [CodeWithHarry](https://www.youtube.com/watch?v=o5vKJmqXO_g) | | CS50 Marathon - CS50 2021 - Lecture 8 - HTML, CSS, JavaScript [CS50](https://www.youtube.com/watch?v=f_mFUq-rHfk) [list](https://www.youtube.com/playlist?list=PLhQjrBD2T380Xnv_v683p6UjiKJZe13ki) | | Learn HTML – Full Tutorial for Beginners (2022) [freeCodeCamp](https://www.youtube.com/watch?v=kUMe1FH4CHE) | | Learn HTML5 and CSS3 For Beginners - Crash Course([Dev Ed](https://www.youtube.com/watch?v=vQWlgd7hV4A))3:54:02 | | HTML and CSS Tutorial - Create a Website for Beginners [freeCodeCamp](https://www.youtube.com/watch?v=kMT54MPz9oE) | | HTML5 & CSS Development: Learn How to Build a Professional Website \| Udemy, Jordan Hudgens [Udemy](https://www.youtube.com/watch?v=5bMdjkfvONE) | | HTML, CSS and JavaScript [Computer Science](https://www.youtube.com/playlist?list=PLTd6ceoshprcUtRW7sd0eoDgj8a2ED_69) | | Build a Quiz App with HTML, CSS, and JavaScript [James Q Quick](https://www.youtube.com/playlist?list=PLDlWc9AfQBfZIkdVaOQXi1tizJeNJipEx) | | H5实现俄罗斯方块游戏 [开发者学堂](https://www.youtube.com/playlist?list=PLGmd9-PCMLhbOU2pQP6LxWlmo8OX6iVf-) | | node js上最新HTML5开发框架 Meteor [开发者学堂](https://www.youtube.com/playlist?list=PLGmd9-PCMLhaba39ov73zbIgLCUErUZNf) | | HTML5绘图 [开发者学堂](https://www.youtube.com/playlist?list=PLGmd9-PCMLhayk3WdK9Jjx_Qgarn0tof-) | | Html概述 [开发者学堂](https://www.youtube.com/playlist?list=PLGmd9-PCMLhZOrOnXXsSEz_RdSxAUcbzd) | | bootstrap综合实战 [开发者学堂](https://www.youtube.com/playlist?list=PLGmd9-PCMLhbct61SvA1VQP-zJpV21V1m) | | DatePicker组件开发 [开发者学堂](https://www.youtube.com/playlist?list=PLGmd9-PCMLhZw6aY081_bwJ9kx5Sba3CH) | | 麦子学院-Web前端开发之HTML+CSS基础入门 [Yang Liu](https://www.youtube.com/playlist?list=PLhXu26RzZZTyAJmlttiGjoZzrA5IePLUv) | | 麦子学院-Web前端开发之HTML5+CSS3快速入门 [Yang Liu](https://www.youtube.com/playlist?list=PLhXu26RzZZTz3qnV2fCr1TRsEO4g5PhJ-) | | 麦子学院-Web前端开发之Photoshop切片 [Yang Liu](https://www.youtube.com/playlist?list=PLhXu26RzZZTzReUvoeYU5S6DbbSoK_Lcb) | | 麦子学院-使用Angularjs开发Web App [Yang Liu](https://www.youtube.com/playlist?list=PLhXu26RzZZTzn1uxx0vG5UQ2jTst1A5nF) | | Angular Crash Course 2021 [Traversy Media](https://www.youtube.com/watch?v=3dHNOWTI7H8) | | 麦子学院-响应式web设计及项目实践 [Yang Liu](https://www.youtube.com/playlist?list=PLhXu26RzZZTzAICeftDHZXbX4xIla4aLW) | | 强大的抓包神器-Charles详解课程 Charles抓包配置极速实战视频教程 Charles原理与实战 [Yang Liu](https://www.youtube.com/playlist?list=PLhXu26RzZZTxDdlsMDdXZky7DBF3BPXV6) | | HTML Full Course - Build a Website Tutorial [freeCodeCamp](https://www.youtube.com/watch?v=pQN-pnXPaVg) | | HTML完整课程 - 构建网站教程 [freeCodeCamp](https://www.youtube.com/watch?v=pQN-pnXPaVg\&t=1s) | | CSS & HTML [Proxlight](https://www.youtube.com/playlist?list=PLi3fckH40FL4_qPH9t7DdFRhfJCktswzr) | | HTML5 Game Development [Udacity](https://www.youtube.com/playlist?list=PLAwxTw4SYaPlUUkh6txMRXE-w-6N1Z225) | | Electron Build Desktop Apps Using HTML\CSS\JS [CoderOne](https://www.youtube.com/playlist?list=PLvXDmnBbOF7TTTjsEFfASkgqwlyZOPSWz) | | Responsive Personal Portfolio Website Using HTML CSS And JavaScript \| Dark/Light Mode [Bedimcode](https://www.youtube.com/watch?v=27JtRAI3QO8) | | Portfolio Website Tutorial – Frontend Development with HTML, CSS, JavaScript [freeCodeCamp](https://www.youtube.com/watch?v=xV7S8BhIeBo) | | Personal Website Tutorial with Next.js 13, Sanity.io, TailwindCSS, and TypeScript [freeCodeCamp](https://www.youtube.com/watch?v=OcTPaUfay5I) | | Introduction To Responsive Web Design - HTML & CSS Tutorial [freeCodeCamp](https://www.youtube.com/watch?v=srvUrASNj0s) | | Learn HTML5 and CSS3 From Scratch - Full Course [freeCodeCamp](https://www.youtube.com/watch?v=mU6anWqZJcc) | | How To Make Website Using HTML & CSS | | HTML and CSS Tutorial for 2021 - COMPLETE Crash Course! [DesignCourse](https://www.youtube.com/watch?v=D-h8L5hgW-w) | | CSS Tutorial - Zero to Hero (Complete Course) [freeCodeCamp](https://www.youtube.com/watch?v=1Rs2ND1ryYc) | | How To Make A Website Like YouTube Using HTML CSS JS \| Video Sharing Website Design [Easy Tutorials](https://www.youtube.com/watch?v=4ykAepVkG5Y) | | HTML Crash Course for Beginners - Website Tutorial [freeCodeCamp](https://www.youtube.com/watch?v=916GWv2Qs08) | | Responsive Dropdown Sidebar Menu using HTML CSS and JavaScript \| Side Navigation Bar [CodingLab](https://www.youtube.com/watch?v=ES8vJcUqE7s) | | 【html】1小时初学者教程 [GrandmaCan -我阿嬤都會](https://www.youtube.com/watch?v=CLUPkcLQm64) | | Feature Toggles - Why and How to Add to Your Software [freeCodeCamp](https://www.youtube.com/watch?v=-yHZ9uLVSp4) | | Canvas图形、动画、游戏开发从入门到精通全系列课程　[Jomy King](https://www.youtube.com/playlist?list=PL9nxfq1tlKKlmrUsdfVrTRt0lI1yQ9DEb) | | HTML5 Canvas and JavaScript Mario Game Tutorial [Chris Courses](https://www.youtube.com/watch?v=4q2vvZn5aoo) | | HTML、CSS、JavaScript 網頁前端工程 [彭彭的課程](https://www.youtube.com/playlist?list=PL-g0fdC5RMbqW54tWQPIVbhyl_Ky6a2VI) | | Pokémon JavaScript Game Tutorial with HTML Canvas [Chris Courses](https://www.youtube.com/watch?v=yP5DKzriqXA) | | JavaScript Fighting Game Tutorial with HTML Canvas [Chris Courses](https://www.youtube.com/watch?v=vyqbNFMDRGQ) | | Vertical Platformer Game Tutorial with JavaScript and HTML Canvas [Chris Courses](https://www.youtube.com/watch?v=rTVoyWu8r6g) | | | ### html HTML Tutorial - How to Make a Super Simple Website [freeCodeCamp](https://www.youtube.com/watch?v=PlxWf493en4) HTML Tutorial for Beginners: HTML Crash Course [Programming with Mosh](https://www.youtube.com/watch?v=qz0aGYrrlhU) HTML for Beginners 🌎 [Bro Code](https://www.youtube.com/watch?v=HD13eq_Pmp8) HTML & Coding Introduction – Course for Beginners [freeCodeCamp](https://www.youtube.com/watch?v=GDGejH3SDNQ) 千锋教育 [u](https://www.youtube.com/channel/UCtlYTdQCuSRP7W5r2aOMvQw) | | | | | ----------------------------------------------------------------------------- | ------------------------------------------------------------------------ | ------- | | 为什么OA系统要加上名字工号的水印？web前端实现添加水印 [s](https://juejin.cn/post/7085497566535614478) | 书生隐形水印组件软件 [s](http://www.sursenelec.com/index.php?c=category\&catid=29) | oa 隐形水印 | | | | | | | | | ### CSS, Cascading Style Sheets | | | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | | CSS Full Course for Beginners \| Complete All-in-One Tutorial \| 11 Hours [Dave Gray](https://www.youtube.com/watch?v=n4R2E7O-Ngo) | | CSS Crash Course For Absolute Beginners [Traversy Media](https://www.youtube.com/watch?v=yfoY53QXEnI) | | CSS for Beginners 🎨 [Bro Code](https://www.youtube.com/watch?v=wRNinF7YQqQ) | | 麦子学院-利用Sass编写高质量CSS [开发者学堂](https://www.youtube.com/playlist?list=PLGmd9-PCMLhbNkUTsKNXovhiN0iPXCzTO) [Yang Liu](https://www.youtube.com/playlist?list=PLhXu26RzZZTx3QnzKg5uCIKz4BMb9fBQd) | | Sass Tutorial for Beginners - CSS With Superpowers [freeCodeCamp](https://www.youtube.com/watch?v=_a5j7KoflTs) | | CSS [CodePulse](https://www.youtube.com/playlist?list=PLZQftyCk7_SeTVVqMM3kySJx0RPSsc9Mn) | | Intro to HTML and CSS [Udacity](https://www.youtube.com/playlist?list=PLAwxTw4SYaPmd5v7c9i883AwqVZquegHM) | | 3D CSS - lighting, animations, and more! [Kevin Powell](https://www.youtube.com/watch?v=NdftnCDwKaU) | | Customizable typewriter animation with CSS [Kevin Powell](https://www.youtube.com/watch?v=w1nhwUGsG6M) | | I've been challenged to a CSS Battle rematch \| Can I beat him again??? [Kevin Powell](https://www.youtube.com/watch?v=20QiX8rmHnU) | | Learn Flexbox in 15 Minutes [Web Dev Simplified](https://www.youtube.com/watch?v=fYq5PXgSsbE) | | CSS Flexbox Crash Course [freeCodeCamp](https://www.youtube.com/watch?v=tXIhdp5R7sc) | | Bootstrap CSS Framework - Full Course for Beginners [freeCodeCamp](https://www.youtube.com/watch?v=-qfEOE4vtxE) | | CSS Crash Course Tutorial [freeCodeCamp](https://www.youtube.com/watch?v=r1xBCi5SOjw) | | 網頁前端工程入門：基礎 CSS 教學 By 彭彭 [彭彭的課程](https://www.youtube.com/watch?v=Jr7lwHnTK68) | | Create a Design System with CSS - Web Development Course [freeCodeCamp](https://www.youtube.com/watch?v=lRaL-8qZ0mM) | | CSS Full Course \| CSS Tutorial For Beginners \| CSS Interview Questions And Answers \| [Simplilearn](https://www.youtube.com/watch?v=J5KxiOnIrKg) | | Can I Create A Deck Of Cards With CSS? Web Dev [Simplified](https://www.youtube.com/watch?v=iEPK5fppX8w) | | How To Make Website Using HTML CSS \| Crete Full Website Step by Step Tutorial [Easy Tutorials](https://www.youtube.com/watch?v=lBfshkPlMW8) | | Learn Tailwind CSS – Course for Beginners [freeCodeCamp](https://www.youtube.com/watch?v=ft30zcMlFao) | ## JavaScript | | | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | |

JavaScript是一种动态编程语言，通常用于在网页上实现交互效果和动态功能。它是目前最为流行的编程语言之一，可在各种环境中运行，包括网页浏览器、服务器、移动设备等。

JavaScript最初由Netscape公司的Brendan Eich在1995年创建，目的是为了让网页能够动态地响应用户的操作和输入。随着网页技术的不断发展，JavaScript逐渐成为了网页开发中不可或缺的一部分。

JavaScript的语法与Java类似，但并不是Java的简化版，也不是Java的一种方言。它是一种完全独立的编程语言，有自己的语法和特点。

JavaScript支持面向对象编程、函数式编程等多种编程范式。它可以与HTML和CSS结合使用，使网页更具有交互性和动态性。

JavaScript的应用领域非常广泛，包括网页开发、桌面应用程序、游戏开发、移动应用程序、服务器端开发等。由于它的普及程度和适应性，学习JavaScript对于从事计算机编程和网页设计的人员来说是非常重要的。

| | 优途课堂 [u](https://www.youtube.com/@user-tq5fq1ee9m) | | Build a Simple Website with HTML, CSS, JavaScript – Course for Beginners [freeCodecamp](https://www.youtube.com/watch?v=krfUjg0S2uI) | | JavaScript Project Tutorials [Radu Mariescu-Istodor](https://www.youtube.com/playlist?list=PLB0Tybl0UNfaT1uq9anIjt_Ggo7mT6mMb) | | Learn JavaScript With This ONE Project! [Tech With Tim](https://www.youtube.com/watch?v=E3XxeE7NF30) | | Asynchronous Javascript Tutorial - Promises and Async Await Explained [PedroTech](https://www.youtube.com/watch?v=PgZ9npYJZzU) | | JavaScript Mastery Complete Course \| JavaScript Tutorial For Beginner to Advanced [Nerd's lesson](https://www.youtube.com/watch?v=xc3a_CJhjCc) 1:08:53:45 | | Harvard CS50’s Web Programming with Python and JavaScript – Full University Course [freeCodeCamp](https://www.youtube.com/watch?v=vzGllw18DkA) 14:14:23 | | Let's build Battleships in JavaScript! [Code with Ania Kubów](https://www.youtube.com/watch?v=Ubh_k18sX4E) | | JavaScript Talking Avatar with Face Tracking (no libraries and no internet help 😂) [Radu Mariescu-Istodor](https://www.youtube.com/watch?v=U88NM8ScsPY) | | Sorting Visualizer with Sound (JavaScript Tutorial) [Radu Mariescu-Istodor](https://www.youtube.com/watch?v=_AwSlHlpFuc) | | JavaScript Full Course for Beginners \| Complete All-in-One Tutorial \| 8 Hours [Dave Gray](https://www.youtube.com/watch?v=EfAl9bwzVZk) | | HTML、CSS、JavaScript [網頁前端工程](https://www.youtube.com/playlist?list=PL-g0fdC5RMbqW54tWQPIVbhyl_Ky6a2VI) | | How To Make Form (Multi-Step) Using HTML CSS & JS \| Create Form With HTML & CSS [Easy Tutorials](https://www.youtube.com/watch?v=T76bbMVMX6M) | | How to create a Messenger Style ChatBot with JavaScript Tutorial (Part 1) \| Best JavaScript Project [CodeWellTech](https://www.youtube.com/watch?v=C2bKXt1yuPE) | | Chat Bot on JavaScript \| HTML \| CSS [STAPE](https://www.youtube.com/watch?v=J4RObRyfmkM) | | mrdoob/[three.js](https://github.com/mrdoob/three.js/)/ JavaScript 3D Library. [v](https://www.douyin.com/video/7145082792458620168) | | JavaScript Hacking [Loi Liang Yang](https://www.youtube.com/watch?v=CxS3i4LJdAo) | | JavaScript King [u](https://www.youtube.com/c/JavaScriptKing) | | Multi-Step Login Form using HTML , CSS & JS [Anunay Bhaiyaa](https://www.youtube.com/watch?v=DdSi9vJ1Aus) | | How to build Jarvis with javascript [The Enthusiastic Dev](https://www.youtube.com/playlist?list=PLWqtZHJOTN49HtkbGvjM8DcsrytltF1kP) | | 3d robot with html, css and js [Funny web](https://www.youtube.com/watch?v=Z_cjaiJwAvI) | | I created a talking BOT with Javascript \|\| Javascript Project\|HTML CSS JS Mini Project For Beginners [KadirMedia](https://www.youtube.com/watch?v=9o2rSxHiv9w) | | Low Level JavaScript [u](https://www.youtube.com/c/LowLevelJavaScript) | | JavaScript Full Course 🌐 -Learn to code today-【𝙁𝙧𝙚𝙚】 [Bro Code](https://www.youtube.com/watch?v=8dWL3wF_OMw) | | JavaScript DOM Manipulation – Full Course for Beginners [freeCodeCamp](https://www.youtube.com/watch?v=5fb2aPlgoys) | | BEST JavaScript Tutorial for Beginners for Getting a Job 2021 (High Quality, Project Based Course) [SuperSimpleDev](https://www.youtube.com/watch?v=DqaTKBU9TZk) | | JavaScript Tutorial – Build 2 Word Games! [freeCodeCamp](https://www.youtube.com/watch?v=vYEkEMfoi1c) | | Redux Toolkit Tutorial – JavaScript State Management Library [freeCodeCamp](https://www.youtube.com/watch?v=bbkBuqC1rU4) | | LeetCode in JavaScript 刷題即興秀：Roman to Integer、Valid Parentheses at 2021/10/03 [彭彭的課程](https://www.youtube.com/watch?v=a7EX5vsiUf8) | | 彭彭老師的直播紀錄 [彭彭的課程](https://www.youtube.com/playlist?list=PL-g0fdC5RMbqd7hBZANa3TkD5D0RD1_QJ) | | Advanced JavaScript Crash Course 2022 [Codevolution](https://www.youtube.com/watch?v=R9I85RhI7Cg) | | **JavaScript Learning Space(**[**quora**](https://jslearninglibrary.quora.com)**, )** | |

JavaScript Tutorials(freeCodeCamp.org)

JavaScript Tutorials freeCodeCamp

| | Learn JavaScript by Building 7 Games - Full Course [freeCodeCamp](https://www.youtube.com/watch?v=lhNdUVh3qCc) | | Build 15 JavaScript Projects - Vanilla JavaScript Course [**freeCodeCamp**](https://www.youtube.com/watch?v=3PHXvlpOkf4) | | Animated Flag With Color Change Effect (Vanilla JavaScript Tutorial) [Radu Mariescu-Istodor](https://www.youtube.com/watch?v=JWT1mFIbi-A) | | JavaScript Array Methods Practice [James Q Quick](https://www.youtube.com/playlist?list=PLDlWc9AfQBfZGZXFb_1tcRKwtCavR7AfT) | | JavaScript Programming - Full Course [freeCodeCamp](https://www.youtube.com/watch?v=jS4aFq5-91M) | | Learn JavaScript - Full Course for Beginners [freeCodeCamp](https://www.youtube.com/watch?v=PkZNo7MFNFg) | | 10 JavaScript Projects in 10 Hours - Coding Challenge 🔥 [Florin Pop](https://www.youtube.com/watch?v=dtKciwk_si4) | | JavaScript [James Q Quick](https://www.youtube.com/playlist?list=PLDlWc9AfQBfa8hgyh991ublbHuzXQy9J2) [CodePulse](https://www.youtube.com/playlist?list=PLZQftyCk7_Scf_WdUM2J-aFVkTm7wKC8i) | | JavaScript Array Methods Practice [James Q Quick](https://www.youtube.com/playlist?list=PLDlWc9AfQBfZGZXFb_1tcRKwtCavR7AfT) | | Tips For Using Async/Await - Write Better JavaScript! [James Q Quick](https://www.youtube.com/watch?v=_9vgd9XKlDQ) | | Javascript初步 [开发者学堂](https://www.youtube.com/playlist?list=PLGmd9-PCMLhaEQrx8pSWaAiTJdVsw2024) | | Javascript 进阶 [开发者学堂](https://www.youtube.com/playlist?list=PLGmd9-PCMLhY1wfD9aH7-S0icX6MT4EvB) | | JavaScript面向对象编程 [开发者学堂](https://www.youtube.com/playlist?list=PLGmd9-PCMLhZm-cPa-qL-u7QjVmeAz17N) | | JavaScript教程 [廖雪峰](https://www.liaoxuefeng.com/wiki/1022910821149312) | | 麦子学院-前端开发项目-一起来做秒杀活动 [Yang Liu](https://www.youtube.com/playlist?list=PLhXu26RzZZTzzRaLTCX-XQlsI3_J9_eK3) | | 🎮 Easy JavaScript Game Development with Kaboom.js (Mario, Zelda, and Space Invaders) - Full Course [freeCodeCamp](https://www.youtube.com/watch?v=4OaHB0JbJDI) | | Space Invaders (JavaScript, HTML & CSS) [Max teaches Tech](https://www.youtube.com/playlist?list=PL30AETbxgR-cTo-zb1iUxL4mwq0n9Vj_U) | | Javascript Basics [Udacity](https://www.youtube.com/playlist?list=PLAwxTw4SYaPmtf5v3hefG5seVynUtV9T8) | | JavaScript Design Patterns [Udacity](https://www.youtube.com/playlist?list=PLAwxTw4SYaPkGKjpeiLWz8ydvFEkmRkBn) | | Object Oriented JavaScript [Udacity](https://www.youtube.com/playlist?list=PLAwxTw4SYaPmRCRPu9EjK-fWSccPwTOnc) | | 30-seconds-of-code [git](https://github.com/30-seconds/30-seconds-of-code) Short JavaScript code snippets for all your development needs | | JavaScript Crash Course For Beginners [Traversy Media](https://www.youtube.com/watch?v=hdI2bqOjy3c) | | 【前端速成】JavaScript JS 快速入門｜Tiktok工程師帶你入門前端｜[布魯斯前端](https://www.youtube.com/watch?v=1pYtVwIAvhY) | | 【javascript】3小时初学者教程 [GrandmaCan -我阿嬤都會](https://www.youtube.com/watch?v=yZwlW5INhgk) | | Build and Deploy THE PERFECT Portfolio Website \| Create a Portfolio from Scratch [JavaScript Mastery](https://www.youtube.com/watch?v=OPaLnMw2i_0) | | Build a Portfolio Website & Deploy [Traversy Media](https://www.youtube.com/watch?v=r_hYR53r61M) | | Designing & Building a Personal Portfolio from SCRATCH! [DesignCourse](https://www.youtube.com/watch?v=9iUJJHEIpls) | | Let’s learn JavaScript fundamentals! #1 \[Free JS Bootcamp] [Class Central](https://www.youtube.com/watch?v=mdXonjilZew) | | 学习JavaScript函数式编程 - JSUnconf 2016 [JSConf](https://www.youtube.com/watch?v=e-5obm1G_FY) | | API 可以怎麼玩？從串接到應用該注意的事 [六角學院](https://www.youtube.com/watch?v=hJPlFWYsfJA) | | JavaScript Game Development Crash Course 2022 [Franks laboratory](https://www.youtube.com/watch?v=EvC3ge_puQk) | | 20 Award-Winning JavaScript Games – Js13kGames 2020 Winners [freeCodeCamp](https://www.youtube.com/watch?v=GKOgm5-GbUA) | | JavaScript Tutorial - Create a Card Game 🃏 [freeCodeCamp](https://www.youtube.com/watch?v=Bj6lC93JMi0) | | Deno [u](https://www.youtube.com/channel/UCqC2G2M-rg4fzg1esKFLFIw) [s](https://deno.land/) [git](https://github.com/denoland) | | Awesome Responsive Multi Step Registration Form HTML CSS & JavaScript [dotWebdesign](https://www.youtube.com/watch?v=M0O-vquFHto) | | Frontend Web Development Bootcamp Course (JavaScript, HTML, CSS) [freeCodeCamp](https://www.youtube.com/watch?v=zJSY8tbf_ys) | | How To Create Responsive Popup Chat Window \| HTML - CSS - JS [Practical Code Academy](https://www.youtube.com/watch?v=C3JKS3a4R5Y) | | JavaScript Fundamentals For Beginners [Traversy Media](https://www.youtube.com/watch?v=vEROU2XtPR8) | | JavaScript Tutorial for Beginners - Full Course in 12 Hours (2022) [Clever Programmer](https://www.youtube.com/watch?v=lI1ae4REbFM) | | Responsive Sidebar Menu in HTML CSS & JavaScript \| Dark/Light Mode [CodingLab](https://www.youtube.com/watch?v=bFvfqUMjvsA) | | Multi Step Progress Bar in HTML CSS & JavaScript [CodingLab](https://www.youtube.com/watch?v=xzaJGUtaWa0) | | JavaScript Programming Tutorial for Beginners [Telusko](https://www.youtube.com/watch?v=IC5vBKc21X8) | | Build and Deploy Your Own ChatGPT AI App in JavaScript \| OpenAI, Machine Learning [JavaScript Mastery](https://www.youtube.com/watch?v=2FeymQoKvrk) | | All The JavaScript You Need To Know For React [PedroTech](https://www.youtube.com/watch?v=m55PTVUrlnA) | | Firebase Tutorial for Beginners – Build a Mobile App with HTML, CSS, JavaScript [freeCodeCamp](https://www.youtube.com/watch?v=UFD4SP91tSM) | | JavaScript Security Vulnerabilities Tutorial – With Code Examples [freeCodeCamp](https://www.youtube.com/watch?v=ypNKKYUJE5o) | | 《前端教程140讲：HTML5、CSS3、Vue、JavaScript》[大笑脸](https://www.youtube.com/playlist?list=PLHpfx416EzLOls3csCbDYKqJrNxkwVcq3) | | JavaScript Modules Crash Course [freeCodeCamp.](https://www.youtube.com/watch?v=KeBxopnhizw) | | JavaScript教學系列 [青茶說](https://www.youtube.com/playlist?list=PLHtTSk3hVNLUob8s6XaKlzmS8y21_a672) | | JavaScript基礎 [走歪的工程師James](https://www.youtube.com/playlist?list=PLz-S_Wd1N3stoFUOQKkFRfBmL_bUyJPxi) | | | | | | | | | | JavaScript小技巧 | | -------------------------------------------------------------------------------------------------------------------------------------------------------------- | | 一鍵網頁破解右鍵封鎖及選取、修改網頁文字功能教學 \| 破解右鍵 \| 解鎖右鍵 \| 破解選取文字封鎖 \| [科技阿宅王](https://www.youtube.com/watch?v=XTc17Ndf5Is\&list=PLzAvUoSYHGY0vo1a6xvPEh5734tRtIm2Z\&index=2) | | | | | ### TypeScript | | | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | |

TypeScript是一种由微软开发的开源编程语言，它是JavaScript的超集，支持所有JavaScript的语法，但在其基础上增加了静态类型、类、接口、枚举等特性。TypeScript的目标是提高JavaScript代码的可靠性和可维护性。

TypeScript通过在编译时进行类型检查，可以在代码编写阶段发现潜在的类型错误和逻辑问题，从而提高了代码的可靠性和质量。同时，TypeScript还可以让开发人员更容易地编写和维护大型的应用程序，因为它支持模块化、命名空间和类等概念，这些概念可以帮助开发人员组织和管理复杂的代码结构。

除此之外，TypeScript还提供了强大的编辑器支持，可以帮助开发人员自动完成代码、代码重构和代码导航等操作。同时，TypeScript还支持集成开发环境（IDE）和文本编辑器，如Visual Studio Code、Sublime Text等，可以让开发人员更加高效地编写代码。

总之，TypeScript是一种非常有用的编程语言，它可以提高JavaScript应用程序的可靠性、可维护性和开发效率。

| | 【前端速成】TypeScript TS 快速入門｜Tiktok工程師帶你入門前端｜[布魯斯前端](https://www.youtube.com/watch?v=GinkGJZBHIY) | | Learning TypeScript [Simply Explained](https://www.youtube.com/playlist?list=PLzvRQMJ9HDiQyjtcrtvDkeQMJIrv5ABbm) | | TypeScript Design Patterns [Simply Explained](https://www.youtube.com/playlist?list=PLzvRQMJ9HDiSk1pnrKewLklYfCdu9Qjhy) | | Let's Learn Typescript for Javascript Developers from Scratch [CoderOne](https://www.youtube.com/playlist?list=PLvXDmnBbOF7RGTEsMFIGLbzTa4iUA9rGA) | | Learn TypeScript - Full Course for Beginners [freeCodeCamp](https://www.youtube.com/watch?v=gp5H0Vw39yw) | | AILHC/EasyGameFrameworkOpen [git](https://github.com/AILHC/EasyGameFrameworkOpen) 基于Typescript的渐进式通用游戏前端开发框架 | | Angular Tutorial for Beginners: Learn Angular & TypeScript [Programming with Mosh](https://www.youtube.com/watch?v=k5E2AVpwsko) | | Angular Course for Beginners [freeCodeCamp](https://www.youtube.com/watch?v=3qBXWUpoPHo) | | How To Create An Advanced Shopping Cart With React and TypeScript [Web Dev Simplified](https://www.youtube.com/watch?v=lATafp15HWA) | | TypeScript Crash Course [Traversy Media](https://www.youtube.com/watch?v=BCg4U1FzODs) | | Learn TypeScript – Full Tutorial [freeCodeCamp](https://www.youtube.com/watch?v=30LWjhZzg50) | | | | | ### jQuery |

jQuery是一种流行的JavaScript库，用于简化JavaScript代码的编写和操作HTML文档、处理事件、进行动画效果、以及处理Ajax交互等常见的Web开发任务。

jQuery为开发者提供了一种直观、灵活的方式来遍历和操作DOM元素，通过选择器语法可以轻松地找到页面中的元素，并且可以使用链式方法来对这些元素进行修改或者获取属性。

除此之外，jQuery还提供了一些强大的特性，如事件处理、Ajax封装、动画效果、DOM操作等，这些功能让开发者可以更加简单和高效地开发出复杂的Web应用程序。

jQuery的另一个优势在于它的跨浏览器兼容性，尤其是在早期的浏览器中，如IE6、7、8等，它提供了一致的API和行为，这使得开发者可以在不同的浏览器和操作系统中保持代码的稳定性和一致性。

总的来说，jQuery是一种非常流行的JavaScript库，它通过提供简洁的API和便捷的特性，让开发者可以更加轻松地开发出高效、易于维护的Web应用程序。

| | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | [site](https://jquery.com) | | jQuery 教程 [runoob](https://www.runoob.com/jquery/jquery-tutorial.html) [廖雪峰](https://www.liaoxuefeng.com/wiki/1022910821149312/1023022609723552) [w3s](https://www.w3schools.com/jquery/) [wiki](https://en.wikipedia.org/wiki/JQuery) | | jQuery UI([s](https://jqueryui.com), ) | | jquery入门 [开发者学堂](https://www.youtube.com/playlist?list=PLGmd9-PCMLhaiphctUcBtD9Iz-YWis29H) | | jQuery 小白入门 [china refer](https://www.youtube.com/playlist?list=PLHxM50fGnEoXj6_ZpAcntDokoc3m2PDQn) | | 弹层组件文档 - [layui.layer](https://www.layui.com/doc/modules/layer.html) 前端 UI 框架 | | Layui([s](https://www.layui.com), ) | | [layer 弹出层组件](https://layer.layui.com) | | Layer弹窗 基础参数 入门 [china refer](https://www.youtube.com/playlist?list=PLHxM50fGnEoVveXPIjcttK_9g4Md7M7Gz) | | Intro to jQuery [Udacity](https://www.youtube.com/playlist?list=PLAwxTw4SYaPkk4k42lGH3l-MlojoNFBFI) | | jQuery基礎教學 [六角學院](https://www.youtube.com/watch?v=GVWOIP-HX70) | ### KnockOut | | | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | |

Knockout是一种用于JavaScript应用程序的轻量级MVVM（Model-View-ViewModel）库。它使得创建具有复杂UI的交互式Web应用程序变得更加容易和优雅。 Knockout采用的是响应式编程模型，它自动追踪您的数据模型的状态，并更新UI以反映这些更改，从而使您能够更加专注于业务逻辑而不是管理UI状态。

Knockout基于以下几个主要概念：

  1. 视图模型（ViewModel）：这是JavaScript对象，它在Knockout中代表UI的状态和行为。视图模型将数据和操作封装在一个对象中，可以直接绑定到UI元素，从而简化UI的管理。
  2. 数据绑定（Data Binding）：Knockout使用数据绑定技术来将视图模型中的数据与UI元素绑定在一起。当数据模型中的数据发生变化时，UI将自动更新以反映这些更改。
  3. 可观察对象（Observable Objects）：Knockout通过创建可观察对象来实现响应式编程。这些对象可以自动通知UI元素其值的更改，从而实现数据的双向绑定。
  4. 计算属性（Computed Properties）：Knockout还支持计算属性，这是一种特殊的可观察对象，它的值是根据其他可观察对象的值计算而来的。计算属性使得复杂的UI行为变得更加容易实现和维护。

总之，Knockout是一种简单而强大的JavaScript库，它可以使开发人员更加专注于业务逻辑，而不必担心管理UI状态和手动更新UI元素。

| | KnockOut从入门到精通 [开发者学堂](https://www.youtube.com/playlist?list=PLGmd9-PCMLhawQIJdOMt9tRsNsLw6dGwF) | ### RequireJS | | | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | |

RequireJS.js是一个JavaScript库，它提供了一种在浏览器端异步加载JavaScript模块的机制，从而优化了Web应用程序的性能和可维护性。

使用RequireJS.js，可以将JavaScript代码拆分成多个模块，每个模块都有自己的依赖关系和功能。这些模块可以通过异步加载的方式进行加载，从而提高页面加载速度和响应性。

RequireJS.js的主要特点包括：

  1. 异步加载：RequireJS.js可以异步加载JavaScript模块，从而不会阻塞页面的渲染和交互。
  2. 模块化编程：通过将JavaScript代码拆分成多个模块，可以更好地组织和管理代码，并且可以提高代码的可维护性和复用性。
  3. 依赖管理：RequireJS.js提供了一种便捷的依赖管理机制，使得开发者可以方便地声明和管理模块之间的依赖关系。
  4. 配置灵活：RequireJS.js提供了一种灵活的配置机制，使得开发者可以方便地进行各种自定义设置，例如设置模块路径、别名、插件等。
  5. 兼容性强：RequireJS.js可以在各种浏览器和环境中运行，并且可以与其他JavaScript库和框架集成使用。

总之，RequireJS.js是一种优秀的JavaScript模块加载器和依赖管理工具，可以帮助开发者更好地组织和管理JavaScript代码，从而提高Web应用程序的性能和可维护性。

| | RequireJS 入门指南 [oschina](https://www.oschina.net/translate/getting-started-with-the-requirejs-library?print) | | RequireJS 小白入门 [china refer](https://www.youtube.com/playlist?list=PLHxM50fGnEoWqWoh-et_apVlW7fCSr8sR) | | Figma | | --------------------------------------------------------------------------------------------------------------- | | Create a Design System with Figma - Full Course [freeCodeCamp](https://www.youtube.com/watch?v=RYDiDpW2VkM) | | Figma Course - Web Design Tutorial for Beginners [freeCodeCamp](https://www.youtube.com/watch?v=D56hs0Twfco) | | Figma Tutorial for UI Design - Course for Beginners [freeCodeCamp](https://www.youtube.com/watch?v=jwCmIBJ8Jtc) | | | ### Auto.js | | | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | |

Auto.js 是一款基于 JavaScript 语言的 Android 平台自动化测试和脚本工具，它可以模拟人的操作来实现自动化操作。Auto.js 提供了一系列的 API 来模拟用户操作，比如点击、滑动、输入等等，同时也可以访问 Android 系统的原生 API，比如截屏、打开应用、发送广播等等。

使用 Auto.js，你可以编写脚本来自动控制 Android 手机，比如自动打开应用程序，自动滑动屏幕，自动点击按钮等等。除了自动化测试、自动化脚本编写、自动化任务执行等等，Auto.js 还可以用于自动化签到、自动化刷任务、自动化抢红包等日常应用场景。

Auto.js 提供了可视化编辑器，方便用户编辑脚本。另外，Auto.js 支持脚本的调试和运行日志的查看，方便用户进行调试和排错。同时，Auto.js 还提供了一些高级功能，比如多线程并发执行、定时任务、断点续传等等。

总的来说，Auto.js 是一款功能强大、易于使用的 Android 平台自动化测试和脚本工具，非常适合需要实现自动化操作的开发者和测试人员使用。

| | Ghost animal [u](https://www.youtube.com/@97peng/videos) 脚本君 [u](https://www.youtube.com/@%E8%84%9A%E6%9C%AC%E5%90%9B/videos) 云控群控远程手机脚本自动化系统 [u](https://www.youtube.com/@CloudControlPro/playlists) 米斯特姚 [u](https://www.youtube.com/playlist?list=PL5bCJplKaa03fSc9LYa-7FGj1_TVqFuXJ) | | 秒杀其他按键精灵，支持VS Code，这个JavaScript自动化软件居然还有人不知道 [s](https://developer.51cto.com/art/202010/630188.htm) | | Auto.js基础入门教程 [nanana o](https://www.youtube.com/playlist?list=PLM_cIy8WBMcigE-pywfBRYukMUnhGokmb) | | 二Autojs中级进阶教程 [nanana o](https://www.youtube.com/playlist?list=PLM_cIy8WBMcgMPC4eUaJyG-8W3GNCxl6c) | | 三Autojs综合实战教程 [nanana o](https://www.youtube.com/playlist?list=PLM_cIy8WBMcj9MZtxZXZjH310Y21dJqGK) | | Autojs基础脚本开发教程 [立体空间，科技为本！](https://www.youtube.com/playlist?list=PL7Z_iJsi_UxpEgdeFkLT0l5b3NcFtnrBe) | | Auto.Js 入门 [zhang好玩实验室](https://www.youtube.com/playlist?list=PLmiXixbIKKriQ1JuHpBZatmU3T5VAqNTA) | | Auto.js [Run time](https://www.youtube.com/playlist?list=PLTtXmzjH9-xCSG3LDxR4XRfgcBrfGp143) | | 网络验证系统 [吾爱分享](https://www.youtube.com/playlist?list=PL5RMNGjCepylZjquhHEce_hiapvcAqZG5) | | AiWork 网络验证与热更新系统对接教程 [吾爱分享](https://www.youtube.com/playlist?list=PL5RMNGjCepylRNrLewapjx5BEXcfuq3S9) | | | | | | | | | | | ### Electron.js | | | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | |

Electron.js（简称Electron）是一个开源的框架，用于构建跨平台的桌面应用程序。它最初是由GitHub开发，基于Node.js和Chromium构建。

使用Electron，开发者可以使用前端技术（如HTML、CSS和JavaScript）构建本地应用程序，这些应用程序可以在Windows、macOS和Linux等多个操作系统上运行。Electron为开发者提供了一个完整的开发生态系统，包括构建工具、调试工具和应用程序打包工具，使得开发人员能够专注于应用程序的开发。

Electron的核心是由Node.js提供的后端API，这使得开发者可以访问本地文件系统、系统级别的资源和第三方模块。同时，Electron还通过将渲染进程与主进程分离，提供了更好的安全性和可维护性。在渲染进程中，开发者可以使用常见的前端框架（如React、Angular和Vue.js）来构建用户界面。

Electron已经被许多知名应用程序使用，如VS Code、Slack、GitHub Desktop、Discord、Figma等。

| | 前端和后端的结合? (Electron.js 结构解析) [从0开始数](https://www.youtube.com/watch?v=Fih2W9kl9Ts) | | | | | ### Three.js | | | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | |

Three.js是一个基于JavaScript的3D渲染库，它可以让开发者通过JavaScript语言创建、渲染和展示三维场景，包括三维模型、纹理、光照、阴影等等。

Three.js提供了一个丰富的API，它可以让开发者很容易地创建和处理3D场景的各种元素。使用Three.js，开发者可以轻松地创建和加载3D模型、纹理和材质，设置场景的光照和阴影效果，以及添加动画和交互效果等。

Three.js还支持各种3D效果，如深度测试、抗锯齿、透明度、反射和折射等等，使得开发者可以创建出更加逼真和生动的3D场景。

Three.js是一个开源项目，可以在GitHub上找到它的源代码和文档。由于它的易用性和灵活性，Three.js已经成为了Web上最受欢迎的3D渲染库之一，被广泛应用于游戏、虚拟现实、建筑可视化、教育和艺术等领域。

| | Three.js 3D Game Tutorial: In-Depth Course for All Levels [Chris Courses](https://www.youtube.com/watch?v=sPereCgQnWQ) | | | | | Build a Mindblowing 3D Portfolio Website // Three.js Beginner’s Tutorial [Fireship](https://www.youtube.com/watch?v=Q7AOvWpIVHU) Three.js (threejs) 浏览器中的3D渲染引擎 [奇乐编程学院](https://www.youtube.com/watch?v=E4rxBWm4nhA) Build and Deploy an Amazing 3D Web Developer Portfolio in React JS | Beginner Three.js Tutorial [JavaScript Mastery](https://www.youtube.com/watch?v=0fYi8SGA20k) ### Bootstrap | | | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | |

Bootstrap是一个流行的前端开发框架，它提供了一套用于快速构建网站和应用程序的HTML、CSS和JavaScript组件。Bootstrap最初由Twitter开发，现在是一个开源项目，由全球开发者社区维护。

Bootstrap具有响应式设计，意味着它可以适应各种设备和屏幕尺寸，包括桌面电脑、平板电脑和智能手机。Bootstrap也提供了一套易于使用的排版和样式工具，使开发人员可以快速创建漂亮和一致的用户界面。

Bootstrap还包含许多常见的UI组件，例如导航栏、下拉菜单、警告框、表格、表单和按钮等。这些组件可以通过简单的HTML标记和CSS类来创建，并且具有丰富的可定制选项，开发人员可以轻松地根据自己的需求进行定制。

最后，Bootstrap还具有大量的第三方插件和扩展，例如轮播图、模态框、日期选择器等，可以帮助开发人员更快速地构建功能丰富的应用程序。

总之，Bootstrap是一个非常流行的前端开发框架，它提供了一套易于使用和灵活的组件和工具，使开发人员可以更快速、更轻松地构建漂亮和一致的用户界面。

| | Build fast, responsive sites with [Bootstrap](https://getbootstrap.com/) | | Bootstrap 5 Crash Course [Web Dev Simplified](https://www.youtube.com/watch?v=Jyvffr3aCp0) | | Complete Guide to Bootstrap Dashboard Apps - Dash Plotly [Charming Data](https://www.youtube.com/watch?v=0mfIK8zxUds) | | termux用的bootstrap? | ## Prisma | | | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | |

Prisma是一种现代数据库ORM（对象关系映射器），可以与多种数据库配合使用，例如PostgreSQL，MySQL，SQLite和Microsoft SQL Server等。它是一种类型安全的ORM，允许您使用类型安全的查询构建器和API来管理数据库。

Prisma不仅提供了ORM功能，还包括一个数据访问层和一个数据模型定义语言（Prisma Schema），它们都是使用现代的TypeScript语言编写的。

Prisma的数据模型定义语言（Prisma Schema）非常直观易懂，可以定义数据模型、关系、验证规则等。使用Prisma，您可以轻松地进行复杂的数据库操作，例如一对多关系、多对多关系、事务等。

Prisma还提供了许多强大的功能，例如自动生成迁移、类型安全的查询、实时数据库更新、数据关系的预加载等，这些功能让您的开发更加高效、快速和安全。

总之，Prisma是一个非常强大的ORM框架，可以大大简化数据库开发和管理。

| | Next-generation Node.js and TypeScript ORM | | [s](https://www.prisma.io/) [Doc](https://www.prisma.io/docs/) [Quickstart](https://www.prisma.io/docs/getting-started/quickstart) | | Learn Prisma In 60 Minutes [Web Dev Simplified](https://www.youtube.com/watch?v=RebA5J-rlwg) | | Build a RESTful API with Fastify, Prisma & TypeScript [TomDoesTech](https://www.youtube.com/watch?v=LMoMHP44-xM) | ## 用户体验 UX User Experience | | | | ------------------------------------------------------------------------------------------------------ | - | | 麦子学院-学习UX第一季-轻松入门 [Yang Liu](https://www.youtube.com/playlist?list=PLhXu26RzZZTwoSfamdorZTUfJRk4CW_kQ) | | ## UI User Interface 千锋教育 [u](https://www.youtube.com/channel/UCtlYTdQCuSRP7W5r2aOMvQw) MUI5 (Material UI) Crash Course [Laith Harb](https://www.youtube.com/watch?v=o1chMISeTC0) ### Elastic UI | | | ----------------------------------------------------------------------------------- | | elastic/[eui](https://github.com/elastic/eui) [s](https://elastic.github.io/eui/#/) | | | | | ### Figma | | | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | |

Figma是一款基于云端的设计工具，主要用于创建界面、图标、原型、图表等各种数字设计。它与传统的设计工具相比，具有更好的协作性和跨平台性，可以通过Web应用程序或桌面应用程序访问，并支持Windows、macOS和Linux等各种操作系统。

Figma的主要功能包括：

1.向量编辑：Figma提供了各种各样的向量编辑工具，可以创建和编辑矢量图形、图标、标志和其他图形元素。

2.图层和组织：Figma可以让用户创建和管理多个图层，通过分组、隐藏、锁定、重命名等方式来管理设计元素。

3.自动布局：Figma可以根据用户的设计元素自动调整布局，以便适应各种屏幕尺寸和设备类型。

4.插件和扩展：Figma提供了丰富的插件和扩展，可以增强设计工作流程，提高设计效率。

5.协作和共享：Figma可以让用户在同一设计文件中共同编辑和讨论设计，也可以轻松地共享设计文件和原型。

总的来说，Figma是一款功能强大、易于使用的设计工具，它的优势在于协作性和跨平台性，非常适合多人合作的设计项目和团队。通过Figma，用户可以更快、更高效地创建优秀的数字设计，并与团队成员进行协作和沟通。

| |

有一些类似Figma的替代品，包括以下几个：

  1. Sketch：Sketch是一款Mac电脑上运行的界面设计工具，主要用于创建移动应用、网站和数字界面设计。Sketch的功能类似于Figma，但是它是一款本地应用程序，不支持跨平台使用。
  2. Adobe XD：Adobe XD是Adobe公司推出的一款基于云端的设计工具，主要用于创建移动应用、网站和数字界面设计。Adobe XD支持多平台使用，包括Windows和MacOS。
  3. InVision Studio：InVision Studio是一款基于云端的设计工具，主要用于创建界面、原型和动画。它的功能与Figma类似，但它具有更强的动画和交互设计能力。
  4. Axure RP：Axure RP是一款适用于用户体验设计和产品原型制作的工具，主要用于创建移动应用、网站和桌面应用等。与Figma不同，Axure RP具有更强的交互和逻辑设计能力，可以创建复杂的应用程序原型。

这些工具都有各自的优点和适用场景，根据不同的需求和使用场景选择最适合自己的工具是非常重要的。

| | 就是它以黑馬之姿擄獲了全球設計師的心！超人氣 UI 設計工具 Figma 快速上手！ [PAPAYA 電腦教室](https://www.youtube.com/watch?v=P96TQwsY_VY) | | Create a UI into a 3D Perspective in Figma [DesignCode](https://www.youtube.com/watch?v=JJi5KwdxmiI) | | Neon UI Design from scratch in Figma [DesignCode](https://www.youtube.com/watch?v=lceG4iKNfEg) | | UI Design a Dark Neumorphism Tesla app in Figma from scratch [DesignCode](https://www.youtube.com/watch?v=nthq56UABI0) | | Figma Variants – Design a Scalable Mobile App \[Full Course] [freeCodeCamp](https://www.youtube.com/watch?v=stQ1IZEB2xk) | | UI / UX Design Tutorial – Wireframe, Mockup & Design in Figma [freeCodeCamp](https://www.youtube.com/watch?v=c9Wg6Cb_YlU) | | How to Design a Website – A UX Wireframe Tutorial [freeCodeCamp](https://www.youtube.com/watch?v=pN92rnO_n5U) | | AI 搭配 Figma 進行網頁設計 － 實戰提詞大公開 [六角學院](https://www.youtube.com/watch?v=DjzKQXuaUoM) | | 从Figma 到VSCode，设计做到网页切版- 完整示范 [六角学院](https://www.youtube.com/watch?v=qRZLtIcPdls) | | Figma Midjourney Animation Tutorial - Parallax effect + mp4 [Igor Vensko Tutorials](https://www.youtube.com/watch?v=doqHjSYg1Fs) | | | | | | | ## 其他 | | | | ------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------- | | ecshop独立网店二次开发 [开发者学堂](https://www.youtube.com/playlist?list=PLGmd9-PCMLhZ5p4Q98r30CjVsIYDi1iA7) | bytedance/[IconPark](https://github.com/bytedance/IconPark) 字节前端图标库 [v](https://www.douyin.com/video/7146171511613820174) |