我的作品集
寻味城市：巷弄里的美食记忆
8 min
•
882 次浏览

寻味城市：巷弄里的美食记忆

记录一次探索城市隐藏美食的经历，分享那些值得一试的街边小店。

美食探店生活城市
阅读更多
TypeScript 高级模式与实践
15 min
•
164 次浏览

TypeScript 高级模式与实践

探索 TypeScript 的高级类型系统、设计模式和性能优化技巧。

TypeScript设计模式类型系统
阅读更多
新手养植指南：让家充满绿意
6 min
•
215 次浏览

新手养植指南：让家充满绿意

详细介绍适合室内种植的植物，以及养护要点和常见问题解决方案。

植物家居生活园艺
阅读更多
摄影作品集

摄影作品集

展示个人摄影作品的画廊网站

651
•
59
PhotographyGalleryArt
typescript27 行代码
1import { useState, useEffect } from 'react';
2
3interface WindowSize {
4  width: number;
5  height: number;
6}
7
8export function useWindowSize(): WindowSize {
9  const [size, setSize] = useState<WindowSize>({
10    width: window.innerWidth,
11    height: window.innerHeight,
12  });
13
14  useEffect(() => {
15    const handleResize = () => {
16      setSize({
17        width: window.innerWidth,
18        height: window.innerHeight,
19      });
20    };
21
22    window.addEventListener('resize', handleResize);
23    return () => window.removeEventListener('resize', handleResize);
24  }, []);
25
26  return size;
27}

自定义 React Hooks

一个用于处理窗口大小变化的自定义 React Hook

•
505
•
83
ReactHooksTypeScript响应式
查看源码
你好，世界！
5 min
•
493 次浏览

你好，世界！

这是我的第一篇博客文章，包含了多种 Markdown 语法示例和测试用例。

介绍博客Markdown测试
阅读更多
我的咖啡之旅：从小白到咖啡控
8 min
•
858 次浏览

我的咖啡之旅：从小白到咖啡控

记录我探索咖啡世界的心得，分享如何在家冲出一杯好咖啡。

咖啡生活手冲美食
阅读更多
寻味城市：巷弄里的美食记忆
10 min
•
508 次浏览

寻味城市：巷弄里的美食记忆

记录一次探索城市隐藏美食的经历，分享那些值得一试的街边小店。

美食探店生活城市
阅读更多
产品演示视频
3:45

产品演示视频

新产品功能介绍和使用教程

194
•
76
•
1.0 GB
产品演示教程视频制作
查看原视频
tsx13 行代码
1export function LoadingSpinner() {
2  return (
3    <div className="flex items-center justify-center">
4      <div className="relative h-10 w-10">
5        <div className="absolute inset-0 animate-ping rounded-full 
6             bg-primary/30"></div>
7        <div className="absolute inset-2 animate-spin rounded-full 
8             border-2 border-transparent 
9             border-t-primary"></div>
10      </div>
11    </div>
12  );
13}

Tailwind CSS 动画组件

一个使用 Tailwind CSS 实现的优雅加载动画

•
823
•
56
ReactTailwind CSS动画组件
查看源码
深入理解 React Server Components
10 min
•
1081 次浏览

深入理解 React Server Components

详细探讨 React Server Components 的工作原理、优势和实践经验。

ReactRSC性能优化Web开发
阅读更多
城市漫步：我眼中的老街记忆
7 min
•
539 次浏览

城市漫步：我眼中的老街记忆

记录一次老城区的街巷探索，感受城市的人文气息与历史变迁。

城市摄影生活随笔
阅读更多
在线协作平台
ReactWebSocketNode.jsMongoDB

在线协作平台

实时多人协作的文档编辑平台

协作工具实时编辑在线文档
280 次预览
访问网站

技术白皮书

区块链技术应用研究报告

PDF
•
885
•2 B
研究区块链技术文档
下载文件
在线预览
typescript23 行代码
1import { NextResponse } from 'next/server';
2import type { NextRequest } from 'next/server';
3
4export async function GET(request: NextRequest) {
5  const { searchParams } = new URL(request.url);
6  const id = searchParams.get('id');
7
8  try {
9    const data = await db.users.findUnique({
10      where: { id },
11    });
12    
13    return NextResponse.json(
14      { data },
15      { status: 200 }
16    );
17  } catch (error) {
18    return NextResponse.json(
19      { error: 'Failed to fetch user' },
20      { status: 500 }
21    );
22  }
23}

Next.js API 路由示例

使用 Next.js API 路由实现的简单 CRUD 接口

•
973
•
57
Next.jsAPITypeScript后端
查看源码