除了Markdown文件之外，JAMStack的静态数据源还可以是其它的东西，例如我们后面说到的Gatsby（JAMStack的一种实现）就允许通过插件的方式使用SQL直接读取数据库的内容来生成静态页面...接着我们可以看一下Gatsby打包会生成哪些文件： 由上图可以看出，Gatsby会为每一个pages文件夹底下的文件生成一个对应的html文件，以及为每一个blogs文件夹底下的博客生成一个静态的HTML...这其实是Gatsby应用的一个很大的亮点，那就是：Gatsby打包的应用在浏览器首次请求获得提前生成的静态HTML文件后，会演变成一个React SPA应用，接下来的用户交互就和一般的SPA应用没有任何差别了...对于后端来说由于我们已经将前后端彻底分离了，所以后端可以使用一些廉价的Baas或者Serverless服务，例如可以使用Auth0作为我们的用户鉴权服务，使用Firebase作为我们的接口服务等等。...答案是否定的，由于JAMStack需要我们将网站的静态部分和动态部分区分开来，静态部分的内容会在构建的时候就生成而动态的内容会在浏览器进行渲染，这个特点就注定了它不适合于构建以下类型的应用： 掘金，知乎这种主要由第三方用户创建内容的应用
Gatsby.js (可以说)是目前最好的开源静态站点生成器，所以让我们来看看它。 Gatsby.js是一个基于response .js的用于生成静态网站的开源框架。...一个重要的插件是Gatsby -source-filesystem，它允许Gatsby从存储在本地文件系统中的文件中提取数据。...gatsby-transformer-sharp和gatsby-transformer-remark也是重要的插件。它们可以自动将markdown 文件转换为可用于web格式。...其他的插件不太重要，就不介绍了。 gatsby-node.js 此文件用于实现api。这些api可以使用GraphQL从数据层中获取数据。在处理程序化页面生成时，我们将更深入地研究这个文件的内容。...主要的一点是，我们使用前面设置的参数，添加一些可以填充的属性，使用自然语言处理使文本更易于模型处理，然后使用Grover模型生成文章。
作者 | Iain Bean 译者 | 王强 策划 | 小智 今年年初，我终于决定将自己的网站从基于 PHP 的 CMS 移植到基于 JavaScript 的静态网站生成器（SSG）了。...从网站 /Web 应用的大致区别来看，React 是用于构建 Web 应用的，这种应用需要有响应用户输入或实时获取数据的交互式 UI；而博客只是一个网站而已。...如果你想用更激进的方法，可以使用一个插件来从你的 Gatsby 网站删除所有 Gatsby JavaScript。...相比之下，Gatsby 中出色的 gatsby-image 插件可以生成延迟加载和响应式的图片元素，并能在加载全分辨率文件后在低分辨率或 SVG 版本的图像间平滑切换。...我选择使用 Eleventy 来构建自己的网站，但我知道这种方法并不适合所有人——完全按照自己的意愿来构建某些东西可能是很麻烦的事情。
Gatsby还支持GraphQL，这意味着数据查询变得更加容易。由于有了GraphQL, Gatsby可以生成能够访问和利用来自不同来源的数据的站点。...您将在使用Gatsby时看到，生成的站点是进步的Web应用程序。PWAs提供了很好的用户体验，它们是web和移动应用程序的完美结合——从两方面挑选特性。...大量的插件都是可用的——谈谈庞大的用户社区的好处吧。 解释性教程不难找到，文档也很棒。 缺点 使用Gatsby需要大量的JavaScript、React和GraphQL知识。...虽然这听起来好得令人难以置信，但Hugo消除了所有配置或依赖的麻烦，使其使用起来很愉快。 由于其速度快和各种内置功能，您会发现Hugo被用于生成博客和文档。它得到了广泛的应用，并继续得到改善。...与Hugo一样，Jekyll也附带一个HTTP服务器，通常用于生成博客。它也经常用于生成投资组合。 虽然Jekyll对页面内容使用Markdown，但它也使用液体模板语言来处理页面。
速度快：网站所需数据在编译期就获取、压缩、优化完成，无需在打开网页时再花费时间从第三方获取数据，所以网站的访问速度非常快。 完善的插件库生态：2500多个插件可免费使用，极大缩短网站开发周期。...使用场景 如果你有一堆用 Markdown 编辑的文章，想要发布到网上，又不想浪费时间在编辑排版上，那么用 Gatsby 生成一个博客网站，是一个非常不错的解决方案。...--- 二、Gatsby 简介 1、图解系统结构 数据统一：从 不同数据源(下图中 CMS、Private API 等) 获取数据，形成统一的数据结构（ GraphQL Data Layer） 数据查询...--- 4、网站的三种生成方式 纯静态网站； 延迟生成的静态网站； 纯服务端动态生成。 详情，看这里！...--- 4、head HTML中head部分的数据对于 SEO 极其重要，用 bolog 模板生成的 Gatsby 项目，已经生成了SEO组件(src/components/seo.js)，直接使用，完成页面
Gatsby 的 CLI包含了许多常见的开发特性，比如 gatsby build (构建一个生产、静态生成的项目版本)、 gatsby develop(启动一个热加载的web开发服务器)等等。...功能插件 功能插件用来实现某些功能（离线支持，生成一个站点地图等等）或者他们扩展了 Gatsby 的 webpack 配置，增加了对 Typescript、Sass 等的支持。...我们将只使用一个 transformer 插件(用于 Markdown )，所以让我们安装它。...我们定义的每个键都可以被注入到查询中。 现在，我们已经安装了一堆插件来从磁盘加载文件，将 Markdown 转换为HTML。我们有一个单独的 Markdown 文件，它将作为一个博客发布。...CLI，用于在预定义的 Gatsby 结构和 frontmatter、日期、路径等方面搭建一个博客帖子。
会自动从源数据中下载图片，并转换为数据层中图片节点，下面详解 图片文件 -> 数据层图片节点 的过程。...1、原理说明： 本地文件通过 gatsby-source-filesystem 插件，转为数据层节点 allFile； 数据层节点 allFile 中的图像节点， 通过 gatsby-transformer-sharp...插件，转为数据层节点 ImageSharp； 使用 Graphql 查询 ImageSharp 节点数据，传递给 gatsby-plugin-image 插件提供的组件 GatsbyImage...【备注】：gatsby-transformer-sharp 插件会为所有数据层节点的image属性增加 ImageSharp 图片节点。...譬如 gatsby-source-strapi 插件从strapi 获取数据生成 allStrapiArticles 节点，gatsby-transformer-sharp 也会为其 image 属性自动生成图片节点
就像 React 这边的 Gatsby 和 NextJS 一样，Vue.js 这边支持静态网站生成的框架也有不少。但考虑到它们提供的众多功能，想要挑一个合适的并不容易。...因此在本文中，我会向大家介绍用于静态站点生成的四大 Vue.js 框架，并对它们做详细对比，帮助找到适合你用例的选项。 1. Nuxt.js ?...根据他们的官方文档，VuePress 包含两个主要部分： 带有基于 Vue.js 主题系统的静态站点生成器。 插件 API，用于添加全局级别的功能，还有一个针对文档优化的默认主题。...与 React 中的 Gatsby 相似，Gridsome 是一个数据驱动的框架。Gridsome 使用一个 GraphQL 层从各种源中获取内容，然后从中动态生成页面。...同样，你可以使用 gridsome build 来构建你的网站，它将生成可用于生产环境的优化版 HTML 文件。
第二，它是团队协作的理想选择，因为它创建的应用程序可以明确划分为组件 - 业务逻辑和前端。这是可能的，因为开发环境是基于MVVM（模型－视图－视图－模型）模式下的。...与 Jekyll，Hugo 或 Hexo 等流行解决方案不同，这个静态生成器不使用模板，而是信赖于 Webpack 和 React 组件（注意 React 官网本身也是在 Gatsby 的帮助下编写的）...从1.0版本开始，Gatsby 使用了上面提到的 GraphQL。因此，在构建过程，它可以从多个 GraphQL API 中获得数据，然后使用它们创建一个完全静态的 React 客户端应用程序。...现在，让我们从枯燥的特征列表转移到真正的问题，看看 Gatsby 是否适合你。 Web 开发者使用现成的引擎并不总是那么容易。...除了我们上面描述的明显的优势外，这种页面有一个重要的缺点 —— 它的内容不容易被编辑。静态网站生成器专门用于解决此问题，Gatsby 是其中最好的，感谢 GraphQL。
所以这次主要是添加了一些功能，更新了基础技术依赖等，更新点包括： •添加了DocSearch文档搜索功能•添加了gittalk评论功能•调整与美化了对Markdown的显示•从Gatsby V2升级最新...其中Gatsby是基于React的静态网站生成框架，而 Cockpit cms则是存储网站内容的headless cms。 在最初的技术选型时，有考虑过hexo以及Wordpress两个选项。...从Gatsby V2升级最新V4稳定版 2021年元旦期间做这个网站时，当初Gatsby还是V2版本，现在Gatsby已经更新到了V4版本，添加了许多新的功能，优化了网站构建速度等。...生产打包添加gzip支持，优化网站请求大小 基于Gatsby提供的压缩插件，将官网的打包形态换成了gzip模式，这样网页更小，加载速度就会更快了。...而Gatsby的优点在于它有非常多的插件。几乎你想要什么，都要现成的插件来帮你处理。而且有相当一部分是官方的插件。
老项目迁移会存在一定成本，可以参考我之前的文章《将 React 应用迁移至 Vite》 四：Gatsby Gatsby 不仅仅是一个静态网站生成器，它更是一个渐进式 Web 应用生成器。...的优势： ✅ 页面渲染性能优秀 ✅ 对 SEO 友好 ✅ 对打包文件进行了优化 ✅ 轻松部署到 CDN（基于出色的扩展功能） ✅ 丰富的插件系统 Gatsby 的劣势： ⛔️ 使用起来相较于 CRA...更为复杂 ⛔️ 需要了解 GraphQL 和 Node.Js 的相关知识 ⛔️ 配置繁重 ⛔️ 构建时间会随着内容的增加而变长 ⛔️ 云服务需要付费 值得强调的是，丰富的插件系统是选择 Gatsby 的重要原因...，比如 Gatsby 提供许多博客主题插件，其他例如谷歌分析、图片压缩、预加载插件等等。...ISR – 增量静态再生，可以再次从 API 获取数据，并且生成静态页面，最适合常见的资讯类、新闻类网站。
因此，我们将其总结为：一大一中一微三模型，提供全面 AI 辅助编码： 高质量大模型：32B~。用于代码重构、需求生成、自然语言代码搜索与解释等场景。 高响应速度中模型：6B~。...用于代码补全、单元测试生成、文档生成、代码审查等场景。 向量化微模型：~100M。用于在 IDE 中进行向量化，诸如：代码相似度、代码相关度等。...首先，我们可以用官方提供的模板生成： IDEA 插件模板 VSCode 插件生成 然后，再往上添加功能（是不是很简单），当然不是。...而从结果来看，如何保持高质量的数据是最大的挑战。...在 IDE 插件中，直接通过 Velocity 模板引擎、基于 Chocolate Factory 来实现指令的生成。 数据集成。在 Unit Eval 中，生成适用于模板的数据集。 结果评估。
这是一个网站，为您提供从git到JavaScript的所有内容的示例和快速文档。您可以从终端请求文档，所有内容都包含大量示例。 ?...如今制作网站的酷炫方式是React和Node。这就是Gatsby的用武之地。它是一个使用React，Webpack和GraphQL构建静态网站的生成器。它有适用于不同数据源的插件，并且速度很快。 ?...它具有流行的iOS移动应用程序的截图集，因此您可以从最好的专业人士那里学习如何设计。 ?...https://mobbin.design/ Shotsnapp Shotsnapp是一个网络应用程序，可以帮助您为您的项目制作漂亮的手机模型。...然后“伟大的吊带”是给你的。它是一个chrome扩展程序，用于挂起非活动选项卡。
它因其生成静态网站和提供优化性能的能力而在 Web 开发社区中获得了巨大的关注。多年来，Gatsby 不断发展和扩展其功能，成为构建现代高性能网站的首选。...优点 卓越的性能：Gatsby 生成静态 HTML 文件，从而加快加载时间并提高网站性能。它利用代码分割、延迟加载和其他优化技术来提供最佳的用户体验。...开发人员体验：Gatsby 凭借其全面的插件生态系统和入门模板提供无缝的开发体验。它简化了常见任务，例如处理图像、优化资产和管理数据源，从而节省了开发人员宝贵的时间和精力。...丰富的插件生态系统：Gatsby 拥有庞大的插件生态系统，可扩展其功能。开发人员可以轻松地将 CMS 平台、无头 CMS、分析和部署服务等流行工具集成到他们的 Gatsby 项目中。...自推出以来，Three.js 已获得广泛采用，并已成为基于 Web 的 3D 图形的首选。 用法 Three.js 可用于各种应用程序，从交互式数据可视化到沉浸式虚拟现实体验。
3.Gatsby：如果你是在构建面向内容的静态网站 Gatsby.js 是基于 React 构建的、速度非常快的、现代化网站生成器。...用于在服务端渲染 React 应用程序。...6.Neutrino：创建和构建零初始配置的现代JavaScript应用程序 7.Yeoman： Yeoman提供generator系统，一个generator是一个插件，在我们在一个完整的项目上使用‘...Yeoman提供了负责开始项目开发的一切，没有任何让人头痛的手动配置。 采用模块化结构，Yeoman利用从几个开源社区网站学习到的成功和教训，以确保栈开发人员越来越智能的进行开发。...你可以将它简单的理解为一个专注性能的类 next.js 前端框架，并通过约定、自动生成和解析代码等方式来辅助开发，减少我们开发者的代码量。
在上一篇文章中我们大致讲述了一下如何通过词嵌入向量的方式为大语言模型增加长期记忆，用于落地在私域场景的问题。...其中涉及到使用openai的接口进行词嵌入向量的生成以及chat模型的调用。 使用ML.Net轻松接入AI模型！...Visual Studio 的 Model Builder 训练和使用模型，包括选择模型类型、训练环境、数据源、评估结果和生成代码的步骤。...Windows Copilot 必应聊天插件支持 用于跨平台人工智能开发和新芯片支持的混合人工智能循环 开发主页 仪表板 开发驱动 新的 WinGet 配置 适用于 Windows 终端的 GitHub...C# 更新 改进的构建工具窗口 适用于 MAUI 的 XAML 热重载 新 UI 中的窗口着色 改进的源代码生成器 骑手的特征训练器 设置同步插件 其他改进和错误修复 【英文】Visual Studio
它的功能非常强大，你可以编辑表格，UML图和图表等。 TOAST UI Editor的Markdown模式的特点有： ● 所见即所得。你在编辑Markdown的同时，可以预览生成的HTML页面。...由一个核心模块和其它用于选择、操作、上传等功能的插件组成。...在浏览器中手动完成的大多数事情都可以通过使用 Puppeteer 完成，如生成屏幕截图和 PDF 页面、检索 SPA 并生成预渲染内容（即“SSR”）、从网站上爬取内容等 九、静态网站建站工具 Docusaurus...十五、Gatsby https://github.com/gatsbyjs/gatsby Star 18245 ? Gatsby 可以使用 React.js 把纯文本转换到动态博客或者网站上。...目标如下： ● 无需重载页面转换 ● 热重载编辑 ● 为构建静态网站创建 React.js 组件模型和生态系统 ● 直观的基于目录的 URLs ● 支持 "Starters"
/my-module.js"; 在某些情况下，您可能需要导出从另一个模块导入的对象。方便的export语法可能会对您有所帮助，如下所示： export {value} from "..../my-module.js"; 从开发人员的经验来看，导入和导出语句之间的这种对称性很方便。但是，在这些新规范之前不支持特定情况： import * as MyModule from "....当然，这种解决方法不适用于第二种情况。 新的BigInt数据类型旨在解决这些问题。...BigIntBigInt() 用于正则表达式的matchAll（）方法 您可以通过多种方式获取给定正则表达式的所有匹配项。...city; 您还可以将可选的链接运算符应用于动态属性，如以下示例所示： const userName = user?.
Showcase 基于 Serverless 架构的 moform 的最大特色是自动扩展、无需注册即可使用。从理论上来说，你不用担心系统的并发问题，FaaS 服务本身就是高可用、自动扩展。...moform 创建示例 如上，拖拉一些相应的字段，就可以生成表单了。提交完，会生成一个相应的表单 URL，如下： ?...忘说了，无需注册的原因是——到目前为止，比较成熟的在线授权服务只有 Auth0，然而它只支持微博和人人。...技术及架构 所用到的前端技术栈有： formBuilder，用于创建表单和生成表单 Bootstrap，你懂的 UI 框架 jQuery，对，我还在用 jQuery dataTables，用于展示数据，...AWS Route 53，用于为服务分配域名 底层依然是 Serverless Framework，同时还用到了几个相关的插件： serverless-domain-manager，用于管理、分配域名
本文将要推荐的静态网站生成器（Static Site Generator, SSG），它做的事情就是把你的文档、内容（通常为 Markdown 文件）生成可发布成网站（html）的工具，这样你就可以专心创作...它有数以百计的主题和插件，支持 GFM（GitHub Flavored Markdown），只需要一条命令也能将 Hexo 网站部署到 GitHub Pages、Heroku 等平台上。...Gatsby GitHub 仓库：https://github.com/gatsbyjs/gatsby Stars 数量：42.5k 官方网站：https://www.gatsbyjs.org/ Gatsby...可以从任何地方加载数据。 6....它有将近四百种主题和两百多个插件，光这两项就足以证明它的优秀。 ---- 最后提醒一下大家，写博客最重要的是内容，所以你选好一个生成器、挑一个喜欢的主题之后，不要过度折腾、美化，内容才是最重要的。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
即时通信 IM
ICP备案
对象存储
实时音视频
