- 博客(350)
- 资源 (4)
- 收藏
- 关注
原创 Go语言第二章(小无相功)
本文系统讲解 Go 八大核心数据类型,涵盖字符串拼接、各类整数与浮点数取值范围、布尔值用途;对比固定数组与可变切片差异,介绍 map 键值增删查判操作,讲解结构体封装实体、接口实现多态的核心逻辑,配套完整示例与实操作业,适合新手系统掌握 Go 基础数据结构。
2026-07-03 17:53:30
204
原创 Go语言第一章(入门)
摘要:Go语言是Google开发的静态编译型语言,以简洁高效著称。其特点包括原生轻量级并发(goroutine)、自动内存管理、快速编译和跨平台支持。安装Go只需下载官方安装包并配置环境变量,推荐使用VS Code编辑器。学习Go语言优势明显:就业需求大(云原生/区块链方向)、薪资竞争力强、语法简洁易学,适合转行后端或全栈开发。入门示例展示了基础结构:package main定义入口,import导入依赖包,func main()为程序入口函数。通过修改"Hello World"示例可快速验证环境配置。该语
2026-07-02 11:31:40
268
原创 我在高德 AI 发布会现场,看见了“空间智能”真正落地的一次尝试
高德开放平台发布空间智能战略,推动导航服务从"响应式"升级为"预见式"。通过构建"空间感知-智能决策-场景服务"体系,高德解决了AI应用中数据不可信、流程不可控、结果难验证三大痛点。其核心创新包括:数据溯源系统确保信息可靠性,任务流拆解实现流程可视化,以及建立结果验证机制。同时推出的SKILL体系为开发者提供"空间智能应用商店",并与AR设备厂商合作实现"视野直达"导航。此次升级标志着高德正从地图服务商转型为空间智能基础设施提供商,致力于将AI能力真正落地到商业场景中。
2026-05-18 11:47:34
539
原创 Next.js部署(Vercel)
Vercel部署Next.js应用指南 Vercel是与Next.js同源的云部署平台,提供边缘网络加速、自动HTTPS、Git集成等特性。部署流程包括:1)登录Vercel官网;2)全局安装Vercel CLI;3)连接项目并创建PostgreSQL数据库;4)配置环境变量;5)执行Prisma迁移和生成命令;6)运行部署命令完成上线。注意免费套餐每月100GB流量限制,且国内访问可能需要代理。部署成功后可通过vercel.app子域名访问测试。
2026-05-13 12:52:15
473
原创 Next.js身份验证(better-auth)
Better Auth 是一个开箱即用的身份认证解决方案,支持多种认证方式和第三方登录(如邮箱、OAuth、JWT等),兼容主流数据库和框架(如Next.js、React等)。集成步骤包括:安装依赖、配置环境变量、创建Prisma客户端、生成数据表、设置路由处理程序和客户端实例。通过简单的API调用即可实现邮箱密码登录等功能,开发者只需专注于业务逻辑。官网地址:https://better-auth.com/docs/adapters/mongo
2026-05-09 08:19:24
499
原创 Next.js精通SEO第四章(JSON-LD + web vitals)
本文介绍了两种提升网页SEO和用户体验的技术方案: JSON-LD结构化数据 用于帮助搜索引擎理解页面内容实体(商品、文章等) 在Next.js中通过<script type="application/ld+json">标签注入 包含基础结构说明、安全处理和类型检查建议 推荐使用schema.org标准并验证数据有效性 Web Vitals性能指标 Google提出的核心用户体验指标:LCP、INP、CLS 分别衡量加载速度、交互响应和视觉稳定性 提供各指标的性能阈值和评估方
2026-05-05 06:33:03
736
原创 Next.js精通SEO第三章(TDK + OG)
SEO元数据配置指南 本文介绍了TDK(Title、Description、Keywords)在Next.js中的配置方法及其SEO优化作用。重点内容包括: TDK核心作用: Title直接影响点击率,需简洁准确 Description作为搜索结果摘要,应概括页面价值 Keywords权重虽低但仍需规范填写 Next.js配置方式: 通过metadata对象静态配置 使用generateMetadata函数实现动态配置 支持层级继承和覆盖机制 进阶应用: Open Graph协议配置社交媒体分享效果 动态路
2026-04-27 03:21:11
515
1
原创 Next.js精通SEO第二章(robots.txt + sitemap.xml)
文章摘要: robots.txt和sitemap.xml是网站SEO优化的两个重要工具。robots.txt通过User-agent、Disallow等参数控制搜索引擎爬虫的访问权限,可以指定允许/禁止抓取的页面路径和抓取频率。sitemap.xml则主动向搜索引擎提供希望被索引的页面URL,帮助爬虫发现网站内容,尤其适合新站或深层级页面。两者配合使用能有效管理搜索引擎对网站的抓取行为。在Next.js中可通过robots.ts和sitemap.ts文件轻松配置这两个功能。
2026-04-20 19:18:07
604
原创 Next.js精通SEO第一章(引言)
SEO(Search Engine Optimization),即搜索引擎优化,是一种通过优化网站结构和内容,提高网站在搜索引擎中的排名,从而吸引更多流量和用户的策略。
2026-04-15 17:00:57
555
原创 Next.js第二十五章(CSS方案)
Next.js CSS方案摘要 Next.js提供多种CSS方案选择:1) Tailwind CSS(推荐)通过原子类快速开发;2) CSS Modules实现模块化样式;3) 内置Sass支持(需安装依赖);4) 全局CSS通过globals.css文件;5) 内联Style样式;6) CSS-in-JS如styled-components(需额外配置)。Tailwind CSS可通过npx create-next-app初始化或后续安装集成,提供自动补全工具类。CSS Modules通过.module.
2026-02-02 06:01:43
872
原创 Next.js第二十四章(Prisma)
ORM框架与Prisma实践 摘要: ORM框架简化了数据库操作,将面向对象代码转换为SQL语句。本文介绍了Prisma ORM框架(7.3.0版本)与PostgreSQL数据库的集成方案。内容包括: PostgreSQL安装方式(官网下载/Docker部署) Prisma环境配置步骤 Schema文件定义模型关系 数据库迁移与客户端生成 基本CRUD操作实现 重点说明了模型关联(@relation)、约束条件(@unique)等注解的使用,以及如何配置PostgreSQL连接。Prisma提供了类型安全且
2026-01-29 08:42:32
1092
原创 Next.js第二十三章(Next配置文件)
本文介绍了Next.js配置文件中常用的一些配置项。主要内容包括:根据不同环境(开发/生产)进行差异化配置的方法;如何设置端口号和静态导出站点;配置远程图片加载和图片优化选项;自定义HTTP响应头(如CORS);设置静态资源CDN前缀和应用基础路径。这些配置涵盖了Next.js项目中50%以上的常见需求,通过next.config.js文件可以灵活控制应用的行为和特性。文中提供了详细代码示例和官方文档参考链接,帮助开发者快速掌握核心配置技巧。
2026-01-25 06:14:48
822
原创 Next.js第二十二章(国际化)
本文介绍了Next.js的国际化(i18n)实现方案。i18n名称来源于"internationalization"中18个字母的缩写。文章详细解释了语言(language)和地区(territory)的ISO标准表示方法(如en-US、zh-CN),并提供了相关速查表链接。实现原理是通过解析HTTP头中的Accept-Language字段,使用negotiator和intl-localematcher库匹配最佳语言。文中包含完整的代理函数代码示例,展示了如何根据用户语言偏好进行路由重定
2026-01-19 05:33:18
855
原创 Next.js第二十一章(环境变量)
本文介绍了环境变量的基本概念、查询和设置方法,以及在不同操作系统下的使用差异。重点讲解了如何在项目中应用环境变量,包括通过npm脚本设置、使用cross-env解决跨平台问题,以及最佳实践中的.env文件管理方案。通过Next.js示例展示了如何根据开发和生产环境自动加载不同配置,实现环境变量的高效管理。这些方法能帮助开发者灵活处理不同环境下的配置需求,提升项目部署效率。
2026-01-12 21:01:21
871
原创 Next.js第二十章(MDX)
MDX:Markdown与React的完美结合 MDX是一种融合Markdown语法和React组件的技术,让技术文档和博客编写更加灵活高效。文章详细介绍了MDX的配置与使用方法: 安装配置:通过npm安装必要依赖,配置next.config.js启用MDX支持 基础使用:支持标准Markdown语法、React组件和HTML标签混合编写 高级功能: 引入自定义React组件实现复杂交互 通过mdx-components.tsx全局修改样式 支持远程加载MDX文件内容 MDX特别适合Next.js项目,结合
2026-01-05 18:04:51
415
原创 Next.js第十九章(服务器函数)
服务器函数(Server Actions)简化了表单处理流程,无需手动编写API接口即可直接操作数据库。通过扩展HTML表单的action属性绑定服务器函数,自动接收FormData数据。使用bind方法可传递额外参数,结合Zod库实现数据验证,并通过useActionState管理状态。相比传统方式(需前端发起请求→API路由处理→数据库操作),服务器函数直接在服务端完成数据处理,大幅简化开发流程。示例展示了登录表单的实现,包括参数传递、数据验证和状态反馈功能。
2026-01-01 11:13:58
991
原创 2025年终总结
核心聚焦在代码编写与技术学习,每日保持8小时的高强度学习,涵盖前沿框架(如Hono.js)及SEO全栈知识(黑帽/白帽优化、Google工具链)。未来将重点转向Go语言,结合对混合型人才趋势的判断,计划完成当前Next.js项目后系统化学习Go。同步探索Godot引擎,目标一年内开发独立游戏并上架Steam。筹备短剧拍摄小号,策划《程序员真实故事》等系列,运用蒙太奇和希区柯克变焦等影视手法。坚持“传递知识很酷”的理念,通过视频与教程输出技术见解。
2025-12-31 17:04:47
825
3
原创 Next.js第十八章(静态导出SSG)
Next.js静态导出(SSG)功能详解:本文介绍了Next.js中静态站点生成(SSG)的配置方法,包括如何设置静态导出(output: 'export')、处理动态路由(generateStaticParams)、解决页面跳转问题(trailingSlash)以及图片优化方案。文章还列出了SSG模式下不支持的Next.js功能,如动态路由、Cookies、重定向等。通过示例代码展示了如何配置next.config.js、使用自定义图片loader实现图床托管,帮助开发者快速构建高性能静态站点。
2025-12-29 17:07:16
728
原创 Next.js第十七章(Script脚本)
Next.js的Script组件提供了灵活的脚本加载方案,支持局部/全局引入、多种加载策略和内联脚本。通过strategy属性可控制加载时机(beforeInteractive/afterInteractive/lazyOnload/worker),并支持onLoad/onReady/onError事件监听。组件会自动优化脚本加载,实现缓存和按需加载,同时支持直接编写或dangerouslySetInnerHTML方式的内联脚本。注意客户端组件需使用'use client'声明。
2025-12-27 06:10:06
581
原创 Next.js第十六章(font)
Next.js的font模块优化字体加载,包含Google字体和本地字体两种方式。Google字体在构建时下载到本地,支持可变字体调整粗细和样式;本地字体通过src属性指定文件路径。模块提供多种显示策略(swap/fallback等)防止布局偏移,并支持配置字体粗细、样式等属性。使用时只需引入对应字体并设置className即可应用优化后的字体。
2025-12-27 06:07:31
813
原创 Next.js第十五章(Image)
Next.js的Image组件是优化图片显示的内置解决方案,具有尺寸优化、视觉稳定性、懒加载和灵活性等特点。支持本地图片(通过public目录或import引入)和远程图片(需配置next.config.js)。对于LCP图片需设置loading="eager"或preload属性以避免性能警告。支持自动选择最佳图片格式(如AVIF/WebP),并可通过deviceSizes和imageSizes配置适配不同设备。该组件通过生成srcset属性实现响应式图片加载,区分小尺寸图片(如头像)
2025-12-22 10:19:48
945
原创 Next.js第十四章(缓存策略)
本文介绍了Next.js中的缓存策略,主要分为未启用和启用缓存组件两种情况。未启用缓存时,默认会缓存静态内容,可通过四种方案禁用缓存:1) 使用revalidate设置缓存时间;2) 设置dynamic为force-dynamic;3) fetch时设置cache为no-store;4) 使用动态API。启用缓存组件后,所有组件默认为动态内容,无需额外配置。文章通过代码示例和构建符号说明(○静态、ƒ动态、◐部分预渲染)展示了不同缓存策略的效果,帮助开发者根据需求选择合适的缓存方案。
2025-12-18 08:36:43
625
原创 Next.js第十三章(缓存组件)
Next.js缓存组件(Cache Components)技术解析 摘要:Next.js 16引入的Cache Components机制实现了静态内容、动态内容和缓存内容的混合编排。静态内容在构建时预渲染成HTML实现快速加载;动态内容通过Suspense实现按需渲染,并配合Partial Prerendering技术,先返回静态外壳再流式传输动态内容;缓存内容则将动态数据缓存后纳入静态外壳。这种方案既保留了静态页面的加载速度,又具备动态渲染的灵活性,解决了传统方案中静态内容无法实时更新和动态页面加载慢的问
2025-12-14 18:30:14
1159
原创 Next.js第十二章(RSC/服务端组件/客户端组件)
React Server Components (RSC) 是React19引入的新型组件架构,结合了服务器端和客户端渲染的优势。RSC将组件分为服务器组件(处理静态内容)和客户端组件(处理交互功能),通过流式传输JSON格式的RSC Payload实现高效渲染。服务器组件可直接访问Node.js API和数据库,提高安全性并减小bundle体积;客户端组件则支持浏览器交互功能。这种架构支持局部水合、流式加载,显著提升了FCP性能,同时实现了全栈开发能力,但服务器组件无法使用hooks和浏览器API。
2025-12-02 21:52:55
980
原创 Next.js第十一章(渲染基础概念)
本文介绍了三种网页渲染方式:CSR(客户端渲染)、SSR(服务端渲染)和SSG(静态站点生成)。CSR适合交互性强的应用但首屏加载慢,SSR提升首屏速度和SEO但服务器压力大,SSG则适合静态内容实现极快加载。还解释了Hydration(水合)过程,即JS赋予静态HTML交互能力的关键环节。不同渲染方式各具特点,开发者应根据项目需求(如SEO、加载速度、交互性等)选择合适方案。
2025-11-26 01:52:40
1040
原创 Next.js第十章(Proxy)
Next.js 16将中间件(Middleware)更名为代理(Proxy),功能保持不变。升级可通过命令行工具转换代码。Proxy代理可用于处理跨域请求、接口转发、限流和鉴权等场景,通过配置文件可指定匹配路径。文章详细介绍了基本用法、配置选项(包括简单和复杂匹配规则),并提供了处理跨域请求的实战案例代码。Proxy会拦截所有请求,但可通过config.matcher精确控制拦截范围。
2025-11-23 21:04:14
784
原创 Next.js第九章(AI)
本文介绍了如何在Next.js中集成AI功能。通过Vercel的AI SDK,可以快速实现AI对话功能。主要内容包括:1) 安装AI-SDK及相关模型(如deepseek);2) 获取API Key;3) 编写后端API接口处理流式响应;4) 前端使用useChat组件实现对话交互,包含消息发送、自动滚动等功能的实现。文章提供了完整的代码示例,展示了如何构建一个简单的AI智能助手应用。
2025-11-21 21:59:16
1055
原创 Next.js第八章(路由处理程序)
Next.js路由处理程序(Route Handlers)简介: 概述:Next.js的路由处理程序允许开发者创建API接口,并与前端组件交互,实现前后端分离开发。 主要功能: 通过route.ts文件定义API接口 支持RESTful规范,可定义GET/POST/PUT/DELETE等方法 支持动态路由参数 内置cookie操作 使用方式: API接口放在api目录下 前后端代码需分开存储 可使用REST Client测试接口 应用场景: 实现用户登录/注册接口 处理表单数据 管理用户会话(cookie)
2025-11-19 20:42:33
1192
原创 Next.js第七章(路由组)
路由组是一种基于文件夹的路由组织方式,使用(groupName)包裹文件夹名即可创建(如(shop)),不影响实际URL路径。它适合按功能或团队模块化路由管理。对于大型项目(如同时包含后台管理系统和门户网站),可通过删除根目录的layout.tsx,在各组目录下单独创建layout.tsx(需包含html和body标签)来实现多根布局,从而隔离不同系统的UI结构。这种方法既能保持项目统一,又能实现逻辑分离。
2025-11-18 13:31:21
576
原创 Next.js第六章(平行路由)
平行路由是Next.js中一种类似Vue路由视图的功能,允许在同一个布局中同时渲染多个页面(如@team、@analytics)。通过文件夹命名约定实现,不影响URL路径。平行路由支持独立加载和错误处理组件,还可嵌套子路由(如@team/setting)。但需注意硬导航刷新可能导致404,需通过default.tsx文件进行兜底处理。平行路由通过props将对应页面注入布局组件,实现多视图同时渲染的效果。
2025-11-18 13:29:43
695
原创 Next.js第五章(动态路由)
动态路由通过方括号[]定义可变路径参数,支持多种灵活配置方式。基本形式如[id]可匹配单个参数(如/shop/123);[...slug]可捕获多个片段(如/shop/123/456);[[...slug]]为可选形式,参数可有可无。通过useParams钩子获取参数对象,适用于商品详情等需要动态内容的场景。这些方案使得路由既能处理固定路径,也能灵活适应不同参数组合的需求。
2025-11-17 01:05:43
592
原创 Next.js第四章(路由导航)
Next.js提供四种路由导航方式:1)Link组件,支持预获取和保持滚动位置等功能;2)useRouter Hook用于客户端逻辑跳转;3)redirect函数实现服务端重定向(307状态码);4)permanentRedirect实现永久重定向(308状态码)。Link适用于常规跳转,useRouter适合编程式导航,redirect/permanentRedirect用于权限验证等场景。注意在Server Actions中默认使用push模式,其他情况下默认replace模式。本文介绍了基本用法和注意
2025-11-12 13:54:21
981
原创 Next.js第三章(App Router)
Next.js采用基于文件系统的路由机制,通过文件和文件夹结构自动生成应用路由。核心路由组件包括page(页面)、layout(布局,保留状态)、template(模板,不保留状态)以及特殊功能组件如loading(加载状态)、error(错误边界)和not-found(404页面)。布局和模板可嵌套使用,其中根布局必须存在。路由文件结构直接映射为URL路径,如app/blog/page.tsx对应/blog路径。开发者只需遵循约定式文件组织规则,Next.js会自动处理路由管理,无需额外配置。该机制简化了
2025-11-11 17:03:17
1428
原创 Next.js第二章(项目搭建)
摘要 本文介绍了Next.js 16.0.2版本的快速搭建指南,包括项目创建流程、目录结构说明和核心特性解析。通过npx create-next-app命令可快速初始化项目,支持TypeScript、Tailwind CSS等现代技术栈。重点讲解了Turbopack增量打包器的高效原理、React Compiler的自动优化功能,以及新旧路由系统(App Router与Pages Router)的对比。文章还提供了开发命令参考和常见问题解答,帮助开发者快速上手Next.js项目开发
2025-11-11 16:57:28
2298
原创 Next.js第一章(入门)
Next.js 入门指南:16.0.2版本快速上手 摘要:Next.js是一个功能强大的React全栈框架,支持SSR服务端渲染和SSG静态生成,适合构建高性能网站。学习前需掌握HTML/CSS/JavaScript基础及React/TypeScript知识。该框架优势包括SEO优化、AI集成、丰富社区和便捷部署。目前Next.js在npm下载量远超同类框架(Nuxt/Astro/SvelteKit)。环境要求Node.js 20.9+版本,推荐使用专业代码编辑器。
2025-11-11 16:53:28
1126
原创 小满的五年心得体会(程序人生)
《从程序员到知识分享者:我的成长与思考》讲述了作者小满的职业转变与人生感悟。从工厂工人到月入过万的IT从业者,他经历了报复性消费后的抑郁焦虑,最终通过录制编程教学视频找到人生意义。他提出技术广度和表达能力是获得高薪的关键,并建议程序员提前规划副业应对35岁危机。文章分享了多位转型成功的案例,包括摄影、旅游、创业等方向。作者通过知识分享找到了充实快乐的生活方式,实现了从单纯编码到价值创造的人生跨越。
2025-07-21 13:38:59
2815
3
原创 React(useImmer) 补充篇
useImmer 是一个基于 immer 的 React Hook,它简化了不可变数据的操作。核心特性包括简化状态更新、类型安全和性能优化。安装方式为 npm install immer use-immer。 主要 API 为 useImmer,接受初始状态并返回当前状态和更新函数。特别适合处理嵌套对象和数组操作,使代码更直观。对于基本类型,其行为与 useState 相同。此外,useImmerReducer 结合了 useReducer 和 immer 的优势,让 reducer 函数更简洁。典型应用场
2025-07-21 11:26:26
1195
原创 小满的年中总结
目标与计划: 2024年粉丝目标20万(当前13.8万)。计划开设新账号做短剧,优先更新React Native免费教程(感谢粉丝借用Mac)。技术更新优先级: 根据需求,技术教程重点:React Native > Electron > Next.js。后续将集中更新RN教程,并计划开发付费课程(2024.9-2025.6)。主要工作: 1-6月编写Node.js书籍、接私活、录制React教程;7月起转React Native新教程。日常涵盖视频、答疑、商单等。
2025-07-01 04:01:03
1584
9
原创 React HOC(高阶组件-补充篇)
HOC(高阶组件)是一种React组件设计模式,通过接收组件并返回新组件来实现逻辑复用。文章介绍了HOC的基本概念和使用场景,虽然hooks减少了HOC的使用,但在面试和特定场景中仍需掌握。入门示例展示了基于权限判断的HOC实现,进阶用法则演示了封装通用的埋点统计HOC,包括组件挂载/卸载跟踪和自定义事件上报。文章强调HOC应遵循命名规范(with前缀)、避免过度嵌套,并提供了完整的代码示例和埋点数据格式展示。
2025-06-26 15:10:10
863
原创 Zustand 第五章(订阅)
Zustand 状态管理库的订阅功能可以监听状态变化。通过 store.subscribe 方法,可以在组件内外部订阅状态变更,组件内订阅需放入 useEffect 避免重复订阅。使用 subscribeWithSelector 中间件可以精确订阅单个状态(如年龄变化),减少不必要的组件渲染。订阅方法返回取消订阅函数,还支持配置比较函数和立即触发选项。这种方式比直接使用选择器更高效,特别适合需要响应状态变化但不希望频繁重渲染的场景。
2025-06-14 02:36:22
1061
Vue3最新源码分享。
2022-02-03
project.zip
2021-09-20
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅