Skip to main content

​
Overview

HAI Build provides intelligent code generation capabilities that go beyond simple autocomplete. The AI assistant understands your codebase, follows your patterns, and generates context-aware code that integrates seamlessly with your existing architecture.

​
Code Generation Workflows

HAI Build supports multiple approaches to code generation:

Conversational Generation

Describe what you need in the chat, and HAI generates appropriate code

Context-Based Generation

Select existing code and request modifications or extensions

File-Level Generation

Request new files, components, or modules

Inline Improvements

Improve, refactor, or optimize existing code

​
Starting a Code Generation Task

1

Open HAI Chat

Press Cmd+' (Mac) or Ctrl+' (Windows/Linux) to open the HAI sidebar.
2

Describe Your Requirements

Be specific about what you want to create. Include:
  • Purpose: What the code should do
  • Context: Where it fits in your application
  • Requirements: Specific features or constraints
  • Patterns: Any coding standards or patterns to follow
The more context you provide, the better HAI’s generated code will match your needs.
3

Review the Plan

HAI analyzes your codebase and presents a plan showing:
  • Files that will be created or modified
  • Approach to implementation
  • Reasoning behind decisions
4

Accept or Refine

  • Accept: Approve the plan to proceed with code generation
  • Refine: Provide feedback to adjust the approach
5

Review Generated Code

HAI shows diffs for all changes:
  • New file contents
  • Modifications to existing files
  • Deletions or refactoring
Review carefully before accepting.

​
Example Code Generation Requests

​
Creating New Components

Create a React component for a user profile card that displays 
name, email, avatar, and a follow button. Use TypeScript and 
Tailwind CSS for styling.

​
Modifying Existing Code

1

Select Code

Highlight the code you want to modify in your editor.
2

Add to HAI

Press Cmd+' / Ctrl+' or right-click → Add to HAI
3

Request Changes

Example requests:
- "Refactor this to use async/await instead of promises"
- "Add error handling and logging to this function"
- "Convert this class component to a functional component with hooks"
- "Add TypeScript types to this JavaScript code"
- "Optimize this database query for better performance"

​
Advanced Code Generation

​
Using Experts for Domain-Specific Code

Activate experts to generate code following specific frameworks or patterns:
Generates C# code following .NET best practices:
  • Async/await patterns
  • Dependency injection
  • Entity Framework conventions
  • ASP.NET Core patterns
Learn more about configuring and creating custom experts in our Custom Experts guide.

​
Multi-File Generation

Generate complete features spanning multiple files:
Example: Full Feature Request
Create a complete user authentication system:
- User model with Prisma schema
- Registration and login API endpoints
- JWT token generation and validation middleware
- Password hashing with bcrypt
- Integration tests for all endpoints
- Follow our existing API patterns in /src/api
HAI will:
  1. Analyze your existing code structure
  2. Plan which files to create/modify
  3. Generate all necessary code
  4. Ensure consistency across files
  5. Present changes for your review

​
Test Generation

Generate comprehensive tests for your code:
1

Select Function or Component

Highlight the code you want to test.
2

Request Tests

Generate unit tests for this function covering:
- Happy path scenarios
- Edge cases
- Error conditions
- Mock any external dependencies
3

Review Test Coverage

HAI generates tests matching your testing framework and patterns.

​
Code Generation Best Practices

Include:
  • File paths where code should go
  • Related files or components
  • Coding standards or patterns to follow
  • Dependencies or libraries to use
Example:
Create a new service in src/services/notification.service.ts 
that sends email notifications. Use our existing EmailProvider 
from src/providers/email.ts and follow the pattern in 
user.service.ts.
Help HAI understand your codebase conventions:
Create a new React component for displaying orders, 
following the same pattern as src/components/ProductCard.tsx
HAI will analyze the referenced file and match its style.
Be explicit about:
  • Language and framework versions
  • Type safety requirements (TypeScript, etc.)
  • Testing expectations
  • Performance considerations
  • Security requirements
Example:
Create a TypeScript function that validates user input. 
It must:
- Sanitize against XSS attacks
- Validate email format with regex
- Return typed validation errors
- Include JSDoc comments
- Have >90% test coverage
Don’t expect perfection on the first try:
  1. Review generated code
  2. Provide specific feedback
  3. Request adjustments
  4. Test the implementation
  5. Refine as needed
Example iteration:
The validation logic looks good, but can you:
- Extract the email regex to a constant
- Add a custom error message for invalid formats
- Make the function more testable by accepting validation rules as a parameter
Always review generated code for:
  • Correctness: Does it do what you asked?
  • Style: Does it match your codebase conventions?
  • Performance: Are there obvious inefficiencies?
  • Security: Are there potential vulnerabilities?
  • Maintainability: Is it readable and well-documented?

​
Common Code Generation Scenarios

​
Scaffolding New Features

Request
Scaffold a new feature for user notifications:
- React components (NotificationList, NotificationItem)
- Redux slice for state management
- API service for fetching notifications
- WebSocket listener for real-time updates
- TypeScript types for all data structures

​
Refactoring Legacy Code

Request
Refactor this legacy JavaScript code to modern TypeScript:
- Convert var to const/let
- Add proper type annotations
- Replace callbacks with async/await
- Extract magic numbers to named constants
- Add JSDoc documentation
- Maintain existing functionality

​
Adding Integrations

Request
Add Stripe payment integration:
- Create a payment service using Stripe SDK
- Add webhook handler for payment events
- Create database models for payments and subscriptions
- Add API endpoints for creating and managing subscriptions
- Include error handling and retry logic
- Follow our service pattern in src/services/

​
Documentation Generation

Request
Generate comprehensive documentation for this module:
- JSDoc comments for all public functions
- README.md with usage examples
- Type definitions and interfaces
- Example code snippets
- Common troubleshooting scenarios

​
Working with Generated Code

​
Accepting Changes

1

Review Diffs

HAI presents changes in a diff view showing:
  • Lines added (green)
  • Lines removed (red)
  • Lines modified (yellow)
2

Accept or Reject

  • Accept: Apply changes to your files
  • Reject: Discard and provide different instructions
  • Modify: Request specific adjustments
3

Test Changes

After accepting:
  1. Run your test suite
  2. Test functionality manually
  3. Check for type errors
  4. Verify integration with existing code

​
Using Checkpoints

HAI Build creates automatic checkpoints:
  • Before major changes: Revert if needed
  • After task completion: Jump back to working states
  • On request: Create manual checkpoints
Use checkpoints to experiment fearlessly. You can always revert.

​
Code Quality and Standards

Ensure generated code meets your standards:

​
Type Safety

Request for TypeScript
Generate this with full TypeScript type safety:
- Strict mode enabled
- No 'any' types
- Proper generics where applicable
- Discriminated unions for variants

​
Testing

Request with Tests
Create this service and include:
- Unit tests with >80% coverage
- Integration tests for API calls
- Mock external dependencies
- Test edge cases and error scenarios

​
Documentation

Request with Docs
Generate this utility with:
- JSDoc comments for all exports
- Usage examples in comments
- README.md with API documentation
- Inline comments for complex logic

​
Troubleshooting Code Generation

Issue: Generated code doesn’t follow your conventionsSolutions:
  1. Reference specific files that exemplify your patterns
  2. Provide style guide or coding standards
  3. Create a custom expert with your conventions
  4. Iterate with specific feedback

​
Next Steps

Git Integration

Generate commit messages for your code changes

Custom Experts

Create experts for your specific frameworks

Inline Editing

Quick AI-assisted code modifications

MCP Integration

Extend code generation with external tools
Pro Tip: The more you use HAI Build, the better it understands your codebase patterns. Over time, generated code will increasingly match your style.

Build docs developers (and LLMs) love

Get started for freeTalk to us