Step 4: Front-End Development

Substeps

1. Choosing a tool to use to iterate on the front end (Cursor, v0, etc.)
2. Iterate on it until happy.

General Tips

• Version control is your best friend; once you have a version that you’re happy with, use Git to be able to revert back to it!
• Use AI-assisted prompts for generating UI ideas and designs. For example, prompt ChatGPT or Claude to create a prompt that will help Cursor create a “modern dark mode UI”.
• This is the most difficult part to use AI. AI seems to struggle the most with UI (vs. API calls, database integrations, etc.). The v0 and other frontend UI tools were difficult to use since they rarely preserve the backend functionality, or integrate well with your repository.
• For creating plots and visualizations, make sure you specify which libraries to use, otherwise it will continue flip-flopping between a bunch of different ones.
• Do incremental UI changes to avoid breaking entire functionalities.
• Consider frameworks that integrate well with your back-end (e.g., avoid unnecessary complexity like mixing Python back-end with Next.js if simpler solutions like Flask would suffice).