Introduction to Vly

Why use Vly?

Vly is designed to make web development accessible and collaborative. Whether you're a seasoned developer or just starting out, vly.ai provides the tools to bring your ideas to life quickly and efficiently.

Core concepts

AI Agent

The AI agent is your development partner that:

• Understands natural language descriptions
• Generates production-ready code
• Handles complex architectural decisions
• Learns from your feedback and iterations

Projects

Each project in vly.ai includes:

• Codebase: Full React + Vite + Convex application
• Database: Real-time Convex database with dev/prod environments
• Assets: File storage with @-mention functionality
• Collaboration: Real-time editing with team members
• Deployment: Automatic hosting with custom domain support

Checkpoints

Every significant change creates a checkpoint using git versioning:

• Automatic backups of your progress
• Revert capabilities to any previous state
• Branch management for different features
• History tracking of all changes

Key features

Real-time collaboration

• Live editing with multiple team members
• Cursor tracking to see where others are working
• Instant synchronization across all devices
• Project member management with role-based permissions

Asset management

• File uploads up to 15MB per file
• @-mention functionality to reference assets in chat
• Automatic optimization for web delivery
• Asset library with search and organization

Theme customization

Customize your project's appearance with:

• Color schemes: Primary, accent, secondary, and semantic colors
• Typography: Font family selection and letter spacing
• Component styling: Consistent design system
• CSS variables: OKLCH color format support

Environment management

• Development environment for testing and iteration
• Production environment for live applications
• Environment variables management
• Database access for both environments

Next steps

Now that you understand the basics, let's build your first app to see vly.ai in action.