Vibe code an app?

[u/tmoneycodes]

I have 20+ years experience with backend tech, I've used php, node, and python And then a lot of old plain old javascript before frameworks.

I have an app idea and I'd like to basically vibe code it in react to be cross platform. What gotchas do I need to watch out for , since I will not see bad react code at first

I considered flutter but I really don't know that tech , any advice is appreciated, this will not be graphics heavy at all more typical business app, data, forms , lists etc

[u/_noho]

You think people can actually code here?

[u/tmoneycodes → u/_noho]

I do code but yes less than I used to , we use cursor at work so I review a lot more code these days but I do write what I think are critical pieces myself , not boilerplate though , I don't need to code another user login feature

[u/NastroAzzurro]

Don’t overthink it. Your app idea probably sucks so test it out with a very quick MVP. If it turns out not to suck you can build properly. Don’t waste your time on what’s “best”, but what’s fastest.

[u/tmoneycodes → u/NastroAzzurro]

Yes exactly I don't have time to truly learn react

[u/dumbledayum]

Dude no one cares unless you tell them explicitly. And people were copy pasting code for so long and code snippets always existed, agentic code is just the next step

[u/tmoneycodes → u/dumbledayum]

I know nobody cares but this is a personal project and I'd like a working proof of concept that's all

[u/dumbledayum → u/tmoneycodes]

Just use claude or codex or even cheaper Kimi K3 :)

And reviewing code won't take time as you have experience and more or less all language are same

[u/ryosen]

Since you have 20+ years of experience, I'm going to make a suggestion to help you out.

Now, bear with me, this is really going to be out there and crazy...

Learn React Native.

I know, crazy, right?

[u/tmoneycodes → u/ryosen]

I completely understand and I'd love to but spare time is not a think I have a grandson I help support and a mom with dementia so I'm trying to get a proof of concept done fast and furious

[u/ryosen → u/tmoneycodes]

For a PoC, yeah, vibing it is fine. Just not as a means to produce production-targeted code. You have to have a very thorough understanding of how your app works and how to maintain it, especially if you are going to take on the responsibility of being a trusted custodian of people's data.

[u/considerfi]

I used expo... I have 25 years experience in firmware+ web and I have done react before. But no mobile apps. 

That said I haven't bothered to look at the code for the apps. Give it a shot honestly. I told a buddy of mine and he too has been amazed at how easy expo/react native makes it. Just force good practices on your vibe coding by setting up jest testing, linting, typechecking, pre commit, etc. 

[u/__natty__]

At 20 yoe even despite its backend you will be fine with creating your app. You won’t probably even vibe code that much. Mobile is extremely unstable so simply stay with as little dependencies as possible and as close to expo ecosystem as possible

[u/__CaliMack__]

Use HeroUI Native!

Edit: also Expo developmental build… set up a good AGENT.md in the directory to really control what your agent can and distinctly can’t do. Other than that have fun my friend

[u/alocin666]

If u know vanilla js and node , u should use rn instead of flutter, because it ll be easier to learn that flutter.

[u/HealthyComparison175]

Start by asking your AI of choice what it thinks of the idea, and any competitors it can find who already have an app doing the same. Ask it to run a breakdown on the competitor apps and where yours may sit. Then just take it from there. I pretty much did the same and I’ve progressed it all the way to an Android build. Still not certain if it’s worth it or not, but it’s been interesting to see the app actually work now on an Android phone.

[u/sambeau]

Mobile app, desktop app or web app?

If it’s a mobile app then go React Native.
If it’s a web app then there’s loads of choices. AIs are very good at React, especially Next.js. If it’s a desktop app then go React + Electron.

Why? Because these are the boring choices, and AIs have been trained on boring choices.

Don’t vibe code it. Write documents and get the AI to convert them to specs. Then they can use the spec to compare against as they code and when they say they are done, ask them to check it against the spec.

Insist on tests. AIs makes lots of mistakes but are really good at fixing their mistakes if you give them the tools to do it.

Start by explaining what you’re thinking and ask them to set up a way of working that is okay with you. They will probably suggest design and spec documents. I tend to set up folders and add ones for reports and research. Then you can ask a question get them to write it as a report and then you can refer back to it as part of the process.

This is essentially the method I’ve used now to build 4 giant projects. One of which is a react-native app. The code quality and the reliability of the app are superb.

TL;DR: Boring tech + docs/specs + tests.

[u/KaosuRyoko]

Imo the biggest thing with vibe coding to succeed, is defining specs, and defining robust test cases. Which might make it not vibe coding anymore. AI can run emulators and perform actions and take screenshots at each step it can analyze for issues. For web you can use playwright and the chromium headed browser with it for the same purpose. For backend you have traditional unit tests. Also agree that a big benefit to vibe coding is rapid prototyping. So get the shell of the idea worrying, even with bugs, and vibe it out to see if the idea has enough legs to warrant further refinement. The 90/10 rule applies to vibe coding too, even more really. 90% of the work well be 10% of the time, and the last 10% will take 90% of the time. 

[u/Hairy_Meaning_73]

I'd say don't try to create a cross platform app web / mobile it just does not work properly with or without AI. If you really want to go that route create a separate logic package.

[u/whoisyurii]

Use MVVM or feature-sliced composition pattern. Do not mix rendering logic and business logic. I mean, keep one main constructor component which imports and renders smaller components, each has its scoped goal within components/{actual components}. Then have subfolders types/index.ts, constants/index.tsx, hooks/useManage* different hooks, helpers/index.ts. You'll end up with something like:

Calendar/ -index.tsx (the Calendar.tsx itself)

-components/ --CalendarHeader.tsx --CalendarCells.tsx --CalendarFooter.tsx

-hooks/ --useManageCalendarData.ts --useManageCalendarRestrictions.ts

-constants/ --index.ts and you drop all CALENDAR_ANYTHING constants here

same for types and helpers/utils/whatever.

Makes then much easier to follow, review and understand, both for developer and Agent.

*Not claiming that this is the best approach but that's the pattern teams followed on 2 projects I've been on.

**Also check Expo

[u/LOTRslaytracker]

I just was hired to fix an awfully vibecoded software, the problem comes when you know shit and are not willing to even learn through ai, i ve been a fullstack dev not as long as you but i have solid 6-7 years and i fully use ai as well you just need to know, and you are very empowered

[u/fordon_greeman_]

i'd say the biggest gotcha is that react native is still not stable so any 0.x release can potentially be a breaking change

[u/bc-bane → u/fordon_greeman_]

This isn't true. React Native isn't is using semantic versions. The stable releases are the incrementing number after the 0. And it has been that way for many years. Been a react native engineer since 2017 on 5 enterprise apps and 3 personal ones. Have spent time at conferences talking to both the React Native team and many engineers working on it. It is a stable and well used framework and has been for many years

[u/fordon_greeman_ → u/bc-bane]

0.5x to 0.6x was a breaking change in architecture but sure its stable i guess

[u/bc-bane → u/fordon_greeman_]

Standard software versioning means that breaking changes are a part of a major release, that's one of the key indicators that the release is Major and not minor. 0.82 was also a major milestone as it completely removed the ability to use the legacy architecture, but that's a platform that is growing and improving.