Coding

Claude Development Guidelines

- **Always write unit tests first** before building logic

promptBeginner5 min to valuemarkdown

0 views

Jan 23, 2026

Development Rules

Always write unit tests first before building logic
Tests should be placed in
```
__tests__
```
directories alongside the code they test
Use Vitest for all testing
Ensure tests cover edge cases and error conditions

Black and white (dark mode) with greyscale only
Primary background:
```
#000000
```
(pure black)
Primary text:
```
#ffffff
```
(pure white)
Secondary/borders: greyscale values (
```
#1a1a1a
```
,
```
#333333
```
,
```
#666666
```
, etc.)
Exceptions (only when there is a strong need):
- Syntax highlighting in code editors
- Line differentiation in charts/graphs
- Data visualization colors
Normal UI elements (buttons, inputs, borders, etc.) should always be greyscale

Build small, discrete, testable, and highly maintainable components
Prefer many smaller components with smaller files over large monolithic components
Each component should have a single responsibility
Extract reusable logic into custom hooks
Keep component files under 150 lines when possible
Name components clearly to describe their purpose

Use Ant Design's native responsive features as much as possible
Use
```
Grid.useBreakpoint()
```
hook for responsive logic in components
Prefer antd's responsive props (e.g.,
```
Space wrap
```
,
```
maxTagCount="responsive"
```
) over custom CSS
Avoid duplicating code for mobile - one responsive version is always better
Only use CSS media queries in
```
globals.css
```
for layout adjustments that can't be handled by antd
Breakpoint reference:
```
xs
```
(<576px),
```
sm
```
(≥576px),
```
md
```
(≥768px),
```
lg
```
(≥992px),
```
xl
```
(≥1200px)
Use
```
!screens.md
```
to detect mobile devices (screens smaller than 768px)

component/
├── ComponentName.tsx           # Main component file
├── __tests__/
│   └── ComponentName.test.tsx  # Tests for component

Before committing, ensure:

Agent skill for markdown-converter

Agent skill for nano-banana-pro

Agent skill for 1password