Quick Start Guide
Get up and running with Juliet in less than 5 minutes.
Written By Samir Patel
Last updated 3 months ago
Step 1: Access Juliet - Open your web browser (Chrome, Firefox, Safari, or Edge), navigate to Juliet's homepage. You'll see "Say Hi To Juliet" message. No installation required, everything runs in your browser.
Step 2: Describe Your Project - Start exploring without signing up. Look for chat input at bottom of homepage and type what you want to build in plain English. Examples: "Build a simple todo app with React", "Create a landing page for a fitness app", "Make a weather dashboard", "Build a calculator app with modern design". Optional: Attach up to 5 images (design mockups, screenshots, wireframes) up to 5MB total.
Step 3: Sign In - When you press Enter: redirected to login page. New user? Click "Sign Up" to create account. Existing user? Enter email and password. Sign Up Process: enter email, create password, verify email (check inbox), automatically assigned Free plan.
Step 4: Watch AI Work - Phase 1 Planning: AI analyzes request, creates implementation plan, shows planned approach. You can Accept, Edit, or Respond with feedback. Phase 2 Implementing: AI generates code files, creates project structure, writes components and logic. You'll see files being created in real-time. Phase 3 Executing: AI installs dependencies, runs commands, starts development server, prepares live preview. Phase 4 Completed: Project ready, preview is live and running, you can iterate and make changes.
Step 5: Explore Your Project - Left Panel File Tree: Browse all project files, click any file to open it, see folder structure, create/edit/delete files. Center Panel Code Editor or Chat: Editor Tab to view and edit code, Chat Tab to continue conversation with AI, switch between tabs easily, make manual edits anytime. Right Panel Live Preview or Terminal: Preview Tab shows app running live, Terminal Tab shows command output, test different device sizes, interact with application. Top Controls: Project Name (click to rename), Save All, Download (export as ZIP), Settings (project options).
Step 6: Make Changes - Continue building by chatting with AI. Examples: "Add a dark mode toggle", "Make buttons blue instead of green", "Add user authentication", "Create mobile-responsive navbar", "Fix layout on small screens". AI will understand request, make necessary code changes, show what changed, update live preview automatically.
Step 7: Preview & Test - Use Preview panel to test your application: interact with your app (click buttons, fill forms, navigate), test responsiveness (switch device sizes: Mobile, Tablet, Laptop, Desktop), take screenshots to capture your work, open in new tab for fullscreen view.
Step 8: Save & Share - Download Your Project: Click Download button, entire project downloads as ZIP file, extract and run locally if needed. Add Collaborators (Optional): Settings β Collaborators, enter team member emails, assign roles (Viewer, Editor, Admin), send invitations. Return Anytime: All projects saved automatically, access from Dashboard β Projects, resume work from any device.
Quick Tips for Success: Writing Good Prompts: Be specific with exact features. Include details ("Create todo app with add, delete, mark complete features"). Reference visuals ("Create this design" + attach mockup). Avoid vague requests ("Make an app").
Working with AI: Review plans before approving, provide feedback if something isn't right, iterate incrementally (small changes work better), use terminal to check for errors.
Managing Workspace: Keep file names descriptive, organize files into folders, save regularly (or use auto-save), check terminal for build errors.
Common Questions: Q: Do I need to know how to code? A: No! Describe what you want, AI handles coding. However, coding knowledge helps with manual edits. Q: What can I build? A: Web applications, landing pages, dashboards, APIs, UI components, documentation sites, and more. Q: How much does it cost? A: Start with Free plan (no credit card required). Upgrade for more projects and features. Q: Can I export my code? A: Yes! Download as ZIP anytime. It's your code. Q: What happens if I close browser? A: Projects saved automatically. Return to Dashboard to continue working.