CodeXunNext.js 项目中 i18n 多语言实现详解
在现代 Web 开发中，国际化（i18n）已成为构建全球化应用不可或缺的一部分。 Next.js 相关架构下，一般可以基于 next-intl 的国际化实现方式，本文将从代码结构、配置方式到实际使用场景，全面介绍 i18n的使用，包括语言配置、翻译消息加载、路由支持、组件使用等核心知识点。 一、i18n 实现基础 1.
前端
分类
前端
共 12 篇文章
使用 Content Collections 高效管理和渲染文档、博客文章等结构化内容
Content Collections 是一个用于管理内容的模块化工具，常用于从 content/ 目录中提取和处理 .mdx 和 .json 文件，并将其转换为结构化的数据集合。 它非常适合用于文档、博客文章、静态页面等内容驱动型模块的数据建模。 一、安装依赖 确保你已经安装了必要的依赖包，如： pnpm add @
前端
通过llms.txt文件让AI更容易的收录你的网站内容
llms.txt 是一个专为大型语言模型（Large Language Models，简称 LLMs）设计的文本文件，类似于 robots.txt，但目的不同。robots.txt 告诉搜索引擎爬虫哪些页面可以爬取，而 llms.txt 则是为 AI 工具提供网站内容的结构化信息，帮助 AI 更好地理解和索引网站内容。
前端
Next.js 系列之的SSG、SSR、ISR、CSR 的详细介绍和区别
Next.js 提供了多种渲染策略（SSG、SSR、ISR、CSR），每种策略适用于不同的场景。以下是它们的核心区别、实现方式及最佳实践： 1. SSG（Static Site Generation，静态生成） 核心特点 生成时机：在构建时（next build）生成静态 HTML。 数据获取：通过 getStatic
前端
Next.js 系列之 app router 和 page router 的区别
Next.js 中的 App Router（应用路由）和 Page Router（页面路由）是两种不同的路由架构，主要区别在于 目录结构、功能特性、数据加载方式及布局管理。以下是详细对比： 1. 目录结构与路由定义 特性 App Router (Next.js 13+) Page Router (Next.js 12
前端
Next.js 系列之Serverless（无服务器架构）介绍
Serverless（无服务器架构）是一种云计算模型，其核心思想是开发者无需关注底层服务器的运维、扩容和资源分配，只需专注于编写业务代码。云服务商（如 AWS、腾讯云、阿里云）会动态管理计算资源的分配，按需执行代码并自动伸缩。在前端开发中，Serverless 主要用于解决后端服务部署、API 管理和静态资源托管等问题
前端
Next.js 系列之客户端组件（Client Components）和服务端组件（Server Components）的区别
Next.js 中客户端组件（Client Components）和服务端组件（Server Components）的核心区别在于运行环境、功能特性及适用场景，以下是详细对比： 1. 运行环境与渲染方式 服务端组件 • 环境：仅在服务器端运行，生成静态 HTML 发送到客户端。 • 渲染：支持静态渲染（默认）、动态渲染
前端
为博客集成utterances 评论组件
utterances 是一个轻量级的评论插件 Utterances，基于 GitHub Issues 构建，无广告、无跟踪、开源且永久免费。它通过 GitHub OAuth 流程授权用户发表评论，所有数据存储在 GitHub 中，支持多种页面与 Issue 的映射方式，并提供多种主题自定义选项。 1、utterance
前端
Notion：配合使用 Next.js 搭建低成本博客
之前搭建过不少类型的博客，但是总有不少的麻烦之处。 比如 hugo、hexo 搭建的静态博客，需要提交新的 markdown 内容到项目仓库，然后将 build 的内容提交才能更新博客；内容中的图片存储可以使用一些第三方的图片存储服务，不过处理起来也稍显麻烦。 而类似 wordpress 的一些博客方案，需要有自己的服
前端
添加Google Analytics到Astro 网站
1、设置 Google Analytics 访问**Google Analytics**帐户，为自己的网站创建Google Analytics追踪代码。 最终会得到类似如下的代码 <!-- Google tag (gtag.js) --> <script async src="https://www.googletag
前端
前端跨域问题梳理
1、浏览器的同源策略 1.1 同源策略概述**#** 同源策略是浏览器为确保资源安全，而遵循的一种策略，该策略对访问资源进行了一些限制。 W3C 上对同源策略的说明：Same origin policy。 1.2 什么是源（origin）？****# 源的组成部分 下面表格中，只有最后一行的两个源是同源。 源 1 源
前端
前端项目上线的几种方式
前端项目上线可通过打包、部署本地服务器、使用nginx等方式实现，需解决页面刷新404和请求无法发送的问题，建议使用hash模式或配置服务器返回index.html来处理路由问题，并通过http-proxy-middleware设置代理。云服务器部署流程与本地类似。
前端