Fairly new vibe coder here, been dabbling with it for a while now and attending a couple of builder events.
Basically there are many ways to do it, but if your question is on building mobile apps (not PWAs), then you can follow the approach that I use.
1. Design
I used to use Figma for design. But now I use generative AI tools like Lovable and Bolt.new. Personally I like Bolt.new a lot more mainly because their AI seems to be better at understanding natural language. Their designs seem better too. This is entirely up to you, I've heard of people using Figma and translating it over to Bolt/Lovable.
2. Initial build
As mentioned above, I will build the initial functional UI using Lovable/Bolt. I will key in everything I want the app to do, and then use the prompt editor to refine the prompt. I mention explicitly that it has to be a React Native app.
I generally do not do backend stuff using these AI software because they just can't seem to do it right.
Once it's built, I will test it briefly on the browser just to see if the UI functionality is working correctly.
If all is well, I will export the app.
3. Enhancement
Once exported, I will move over to cursor to do detailed enhancements on each page / tab. I will also use Cursor to do Git repository saving (locally) before pushing it to the cloud. You can do all this through prompts too.
Most of the testing on the local device will be done using Expo Go.
Simply type this in the Cursor terminal to get the QR code to scan and load it on your phone (you also need to download the Expo Go app):
npx expo start
Once the app is enhanced to a level I'm satisfied, I'll export it and push it to the store.
Hope this helps and happy coding!
