This project had its fair share of surprises and tricky moments.

One of the earliest challenges was getting the React frontend and FastAPI backend to talk smoothly — especially when dealing with file uploads. For a long time, uploading an image just wasn’t working. The UI looked fine, but the backend never received the file. After hours of debugging, we realized the problem was with how multipart form data was being handled and fixed it by restructuring the request payload.

Then came the infamous [object Object] bug — the live preview was just displaying that instead of actual UI. Turns out we were sending the entire code dictionary to the frontend instead of extracting the specific HTML or JSX string. Once we fixed the data structure and used data.code.html or data.code.jsx, the preview worked perfectly.

We also wanted to support multiple output formats (HTML, JSX, Shopify) while keeping the UI editable. That meant storing both the original code and the user's modified version, and making sure switching between formats didn’t overwrite any edits. Managing these states without breaking the preview or download functionality required some careful refactoring.

Another challenge was UX polish. We didn’t want just a working tool — it had to feel clean and intuitive. So we added custom button animations, subtle hover effects, transitions, and a gradient background to make the app look professional. Ensuring the Tailwind-generated UIs looked good inside an iframe preview was another small but important design fix.

Finally, time was a constant pressure. There was always one more feature we wanted to add, but we had to keep things stable and focus on submission quality. All in all, the learning curve was steep — but incredibly rewarding.