Build your first app

Let's create your first application with vly.ai. This guide will walk you through the entire process from idea to deployed application.

Getting started

1. Navigate to the home project creation page
2. Start typing your idea in the input field

Example: Creating a simple todo app

Let's build a todo application as your first project.

Step 1: Describe your project

In the input field, type:

Create a simple todo app where users can add, complete, and delete tasks. Include a clean interface with the ability to filter between all tasks, active tasks, and completed tasks.

Step 2: Watch the AI work

Once you submit your request:

• The AI agent instance starts immediately
• You'll see a processing loader indicating the agent is working
• Code generation happens in real-time
• Progress updates show what the agent is building

Step 3: Interact during development

While the agent is working, you can:

• Send follow-up requests to modify functionality
• Interrupt the agent to provide additional requirements
• Upload images for design references
• Ask questions about the implementation

Step 4: Review and iterate

After the initial generation:

• Preview your app in the built-in preview pane
• Test functionality to ensure it works as expected
• Request modifications using natural language
• Add new features incrementally

Common first-time requests

Here are some popular starter projects:

E-commerce site

Build an e-commerce site for selling handmade jewelry with product listings, shopping cart, and checkout functionality

Minecraft clone

Create a 3D multiplayer block game similar to Minecraft with basic building and movement mechanics

Realtime co-founder matching

Build a platform where entrepreneurs can find co-founders based on skills, location, and project interests with real-time messaging

Working with your project

Making changes

To modify your application:

1. Describe the change you want to make
2. Be specific about which components or features to modify
3. Reference existing elements when possible
4. Test changes in the preview before deploying

Example modification requests:

• "Change the primary color to blue and make the buttons more rounded"
• "Add user authentication with login and signup forms"
• "Include a dark mode toggle in the navigation"

Adding assets

To include images, documents, or other files:

1. Go to the Assets tab
2. Upload files (max 15MB each)
3. Reference assets in chat using @filename
4. Assets are automatically placed in public/assets/

Next steps

Now that you've built your first app, learn more about:

• Working in Vly to understand the interface
• Best practices for effective prompting

Your first app is just the beginning. vly.ai can handle complex, multi-feature applications just as easily as simple ones.