# Codebase rules
- params should be awaited before using its properties
- Always escape square brackets and parentheses in commit messages
- Always escape characters with " “ ” ' ‘ ’ "
- Always use the correct HTML entities for special characters
# Project Structure Rules
root_dir: ./
src_dir: ./src
app_dir: ./app
public_dir: ./public
# File Naming Conventions
naming:
components: PascalCase
pages: kebab-case
utils: camelCase
constants: kebab-case
types: PascalCase
# Component Structure
component_rules:
- client_components_must_use_directive: "'use client'"
- export_default_for_page_components: true
- props_interface_naming: "Props"
- shared_components_location: "src/components/shared"
- ui_components_location: "src/components/ui"
# Styling Conventions
styling:
framework: "tailwindcss"
custom_utilities_file: "app/globals.css"
color_scheme:
primary: "purple-600"
secondary: "gray-800"
accent: "purple-500"
background: "gray-900"
text: "gray-100"
typography:
font_family: WorkSans
# TypeScript Configurations
typescript:
strict: true
base_path: "@/*"
file_extensions: [".ts", ".tsx"]
type_imports: "type"
# Animation Conventions
animation:
library: "framer-motion"
default_duration: 0.5
default_easing: "ease-in-out"
# State Management
state:
prefer_hooks: true
local_state: "useState"
refs: "useRef"
effects: "useEffect"
# Image Handling
images:
use_next_image: true
default_quality: 75
formats: ["jpg", "png", "svg", "mp4"]
assets_directory: "/public/assets"
# Code Organization
imports:
order:
- react
- next
- external_libraries
- components
- utils
- constants
- types
- styles
# Performance
performance:
use_memo_for_expensive_calculations: true
use_callback_for_handlers: true
lazy_load_images: true
optimize_fonts: true
# Accessibility
accessibility:
require_aria_labels: true
require_semantic_html: true
require_alt_text: true
# Commit Structure Rules
## Commit Types
commit_types:
- feat: A new feature
- fix: A bug fix
- refactor: Code change that neither fixes a bug nor adds a feature
- style: Changes that do not affect the meaning of the code
- docs: Documentation only changes
- test: Adding missing tests or correcting existing tests
- chore: Changes to the build process or auxiliary tools
- perf: A code change that improves performance
- update: Updates to existing features/docs/dependencies
## Commit Format
commit_format: "<type>(<scope>): <description>"
example: "refactor(hero): standardize hero sections across pages"
## Commit Guidelines
commit_rules:
- make_atomic_commits: true # One logical change per commit
- use_imperative_mood: true # "add feature" not "added feature"
- max_subject_length: 72
- capitalize_subject: false
- no_dot_at_end: true
- separate_changes: true # Different types of changes should be in different commits
## Scopes
scopes:
- hero: Changes to hero sections
- sections: Changes to page sections
- components: Changes to UI components
- pages: Changes to page layouts
- styles: Changes to styling
- config: Changes to configuration
- deps: Changes to dependencies
- docs: Changes to documentation
## Process
commit_process:
1. Check status: "git status" to see all changes
2. Group changes: Group related files for atomic commits
3. Add files: "git add <files>" for each group
4. Commit: Use semantic commit message format
5. Verify: "git status" to ensure all changes are committed
## Special Characters
special_chars:
- Escape square brackets: \[ \]
- Escape parentheses: \( \)
- Use quotes for commit messages with special characters
## Examples
good_commits:
- "feat(auth): add login functionality"
- "fix(api): resolve undefined user data"
- "refactor(hero): standardize section styling"
- "update(docs): revise API documentation"
- "style(components): align text elements"
bad_commits:
- "fixed stuff" # Too vague
- "many changes" # Not atomic
- "Updated several components." # Not specific enough
- "feat:add login" # Missing space after coloncss
golang
javascript
react
tailwindcss
typescript
First Time Repository
TypeScript
Languages:
CSS: 2.1KB
JavaScript: 0.5KB
TypeScript: 226.7KB
Created: 12/21/2024
Updated: 1/16/2025