Remix an App
Learn how to create a Remix as a starting point for your app. A Remix is a Replit App started from a publicly shared Replit App.
Create your Remix
⏰ Estimated time: 1 minute
Follow the steps in this guide to create a Remix of the following solar system visualization:
Remix the app
Open the Solar System Visualization Replit App in your browser and select Remix Template:
Complete the app details
In the Remix App dialog, select Remix App to continue. You can edit these details later.
Start the app
Select Run to start the app:
Navigate to the Webview tab to confirm the app displays animated planets.
Interact with the app
You now have a fully functioning Remix that you can interact with and iteratively improve.
To interact with the visualization, try the following controls in the Webview tab:
- Drag to rotate the view
- Scroll to zoom in and out
- Click a planet to select it
- Select Planet info while a planet is selected to view information about it
- Select Pause Rotation or Start Rotation to toggle the animation
Select Earth and then select Planet Info to read facts about it.
Explore
Try the tasks in the following sections to learn how Agent and Assistant, Replit’s AI-powered tools can help you build your app.
Agent specializes in building projects from scratch and making complex changes to a Replit App. Assistant specializes in smaller changes and describing the app’s code.
Assistant and Agent, which rely on popular AI models, occasionally produce results that don’t fulfill your request. If you encounter issues, follow up with a prompt that describes the error messages or the incorrect behavior. Alternatively, you can use the Rollback feature to restore your Replit App to a previously known working state.
The following sections show examples of using them to enhance this Remix.
Add a feature using Agent
When building from a Remix, Agent is available only if it performed the initial setup for that Remix.
Follow these steps to add a complex feature to your Remix using Agent:
Craft a prompt
Navigate to the Agent tab.
Enter the following prompt in the text area:
After you submit the prompt, Agent might pause and ask for clarification or confirmation. Respond in the text area.
Test the feature
Navigate to the Webview tab to see Agent’s updates to the visualization.
Try toggling the added autopilot button.
Since the initial prompt excluded information such as speed and position of the flyby, the result might not match your expectations.
Refine the feature
If the feature differs from your expectations, continue the conversation by entering the following prompt in the Agent text area:
After Agent completes the feature, the Webview might resemble the following image:
To undo these changes, select Rollback to here in the Checkpoint created immediately after starting the plan for the change in the Agent tab.
Add a feature using Assistant
Follow these steps to add a quick enhancement to your Remix using Assistant:
Craft a prompt
Navigate to the Assistant tab and enter the following prompt:
After you submit the prompt, Assistant describes the changes it wants to make and lets you review the code changes before proceeding. Select Preview code changes to view a comparison of the current code and the updates.
Test the feature
Select Apply all and approve any following confirmations to continue.
Navigate to the Webview tab to check the result.
After Assistant completes the feature, the Webview might resemble the following image:
To undo these changes, select Undo these changes in the Assistant tab.
Continue your journey
Now that you’ve completed this tutorial, you’re ready to explore more possibilities with your Replit App. Try the following next steps to enhance your skills:
- Ask Agent to implement a new complex feature or to check the code for bugs.
- Ask Assistant to explain how the code works or to generate user instructions.
- View and edit the Replit App source code and configuration in the Files tab.
- Share your Replit App for others to remix. To learn more, see Make your Replit App Public.
Was this page helpful?