Skip to main content

Build your first app

Let's build something real together — a task management app in about 5 minutes. No coding experience needed.

Before you start​

What we'll build​

A simple but complete task app where you can:

  • Add new tasks
  • Mark tasks as complete
  • Delete tasks
  • Filter by status (All, Active, Completed)

Step 1: Create a project​

Go to appifex.ai, sign in, and select Web as the platform.

Step 2: Describe what you want​

Copy and paste this prompt:

"Build a task management app with:
- Add new tasks with a text input and button
- Display tasks in a list with checkboxes
- Click checkbox to mark complete (strikethrough text)
- Delete button on each task
- Filter tabs: All, Active, Completed
- Show task count for each filter
- Clean minimal design with white background and blue accent"

Click Send and watch it build.

Step 3: Try it out​

Watch the progress log. When it finishes, click the preview URL.

Try adding a few tasks, completing them, switching between filter tabs. Does it work as expected?

Step 4: Add a new feature​

Let's add something new. Send another prompt:

"Add a 'Clear completed' button that removes all completed tasks"

Appifex updates your existing code and refreshes the preview. Notice you didn't need to describe the whole app again — it remembers the context.

Step 5: Edit the code yourself​

Click the Code tab to see the generated files. Let's change the accent color:

Find the CSS and try changing:

--accent-color: #3b82f6;  /* change to any color you like */

Click Save to commit your change, then Publish to see it live.

Step 6: Add a backend (optional)​

Right now, tasks disappear when you refresh. Let's fix that:

"Add a backend with a database to store tasks.
Include user authentication so each user has their own tasks."

This adds a complete backend — database, auth system, and API endpoints — all connected to your existing frontend.

What you learned​

  • How to create a project and write a prompt
  • How to iterate with follow-up prompts
  • How to make manual code edits
  • How to add a backend to an existing frontend

Where to go next​

Writing effective promptsGet better results from the AI
Build a mobile appCreate an iOS/Android version
Builder vs Coder modeTwo ways to work