File Management

As your app grows, managing your screens and flows becomes just as important as creating them. The File Name Edit & Delete feature helps you stay organized by letting you rename screens and remove the ones you no longer need.

This keeps your canvas clear, your project structure tidy, and your exported code easy to follow.

Why it matters

• Clarity in large projects → meaningful screen names make it easier for you (and your team) to navigate
• Clean code exports → renamed screens reflect in your downloaded React Native project structure
• Less clutter → deleting unused or test screens keeps your canvas focused on the actual flow

How to use File Name Edit / Delete

1. On the canvas → select the screen you want to manage.
2. Edit name → rename it directly in the project sidebar or screen properties.
   • Example: change “Screen1” to “LoginScreen”.
3. Delete → remove a screen you no longer need with one click.
4. Home screen note → the home screen is always labeled “/” as a standard. This cannot be renamed, since it represents the entry point of your app.
5. Exported project → your file names update automatically in the generated React Native code.

Example workflow

• You start with a prompt: “App with login, dashboard, and profile”.
• Screens are generated as Screen1, Screen2, Screen3.
• Rename them to LoginScreen.js, DashboardScreen.js, ProfileScreen.js for clarity.
• Later, if you decide you don’t need the profile screen → delete it, keeping your canvas clean and codebase lean.

Collaboration note

Consistent naming is even more important when you’re working in teams:

• Clear file names reduce confusion during handoffs between PMs, designers, and developers
• For agencies and enterprises, organized projects make multi-seat collaboration smoother
• When exporting, teammates see the same structure they worked on in the canvas — no translation gaps