Back to Details

nextfriday-best-practices

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

Next Friday Best Practices

Next Friday 最佳实践

Essential coding standards for Next Friday projects. This skill covers 41 rules across 7 topics.

Next Friday 项目的核心编码规范。本技能涵盖7个主题下的41条规则。

Topics

主题

Topic	Rules	Reference
Variable Naming	5	variable-naming.md
File Naming	4	file-naming.md
Code Style	13	code-style.md
Imports	3	imports.md
Types	6	types.md
React/JSX	8	react-jsx.md
Next.js	2	nextjs.md

主题	规则数量	参考文档
变量命名	5	variable-naming.md
文件命名	4	file-naming.md
代码风格	13	code-style.md
导入规则	3	imports.md
类型规范	6	types.md
React/JSX	8	react-jsx.md
Next.js	2	nextjs.md

Quick Reference

快速参考

When writing or reviewing code, ensure:

Naming

Boolean variables use prefixes:
```
is
```
,
```
has
```
,
```
should
```
,
```
can
```
,
```
did
```
,
```
will
```
Constants use SCREAMING_SNAKE_CASE
Files use kebab-case (.ts/.js), PascalCase (.tsx/.jsx), SNAKE_CASE (.md)

Code Style

Use guard clauses with early returns
Use async/await over .then() chains
Use function declarations over arrow functions in .ts files
Add blank lines after multi-line blocks and before return statements

Imports

Use absolute imports, not relative with
```
../
```
Use
```
import type
```
for type-only imports

Types

Props interfaces end with
```
Props
```
suffix
Wrap component props with
```
Readonly<>
```
Always specify explicit return types

React/JSX

Wrap lazy components in Suspense
Extract inline objects in JSX to const variables
Destructure props inside component body, not in parameters

Next.js

Use
```
NEXT_PUBLIC_
```
prefix for client-side env vars
No fallback values for env vars

编写或评审代码时，请确保：

命名规范

布尔变量使用前缀：
```
is
```
,
```
has
```
,
```
should
```
,
```
can
```
,
```
did
```
,
```
will
```
常量使用 SCREAMING_SNAKE_CASE 格式
文件命名规则：.ts/.js 文件使用 kebab-case，.tsx/.jsx 文件使用 PascalCase，.md 文件使用 SNAKE_CASE

代码风格

使用守卫语句提前返回
优先使用 async/await 而非 .then() 链式调用
在 .ts 文件中优先使用函数声明而非箭头函数
在多行代码块后和 return 语句前添加空行

导入规则

使用绝对导入，避免使用
```
../
```
相对导入
类型仅导入时使用
```
import type
```

类型规范

Props 接口以
```
Props
```
后缀结尾
使用
```
Readonly<>
```
包裹组件 Props
始终指定明确的返回类型

React/JSX

延迟加载组件需包裹在 Suspense 中
将 JSX 中的内联对象提取为 const 变量
在组件内部解构 Props，而非在参数中解构

Next.js

客户端环境变量使用
```
NEXT_PUBLIC_
```
前缀
环境变量不使用回退值