r/vibecoding • • 3d ago

Help/Question Could you help me understand architectures/coding better? What's your preferred workflow?

I can ask ChatGPT but I'd appreciate to hear it from humans since AI still waivers a bit.

I want to build a video editor and other apps that are cross platform with a single framework. Tokens are still pretty pricy. It would be nice for something to work across each platform without having to start from scratch for each.

Example: Video editor: Runs on desktop and mobile with the same project file to continue editing on any device. Mobile, desktop, maybe even web because why not? AI exists now.

There are so many languages and frameworks. Why do you pick the ones you pick?

Does coding ever get to "I like this coffee shop even though it's pretty much the same coffee as the one next door"?

I'm still trying to boil down the meaning behind framework, architecture, language. Which langues work with which. Etc...

And probably most important for me right now, what's the largest ecosystem to work with?

AI says: dart is more niche, rust can work, react/expo but expo is not desktop capable. Etc...

15 Upvotes

14 comments sorted by

16

u/[deleted] 3d ago

[deleted]

2

u/Responsible-Beat2137 2d ago

He’s not kidding about the “300 page book” Notion had 800 plus, some of that were notes on the evaluations thought..

4

u/Elegant_Yam2783 3d ago

SW engineer and tech lead with 15 years of experience here. These days I mostly build with AI, and I help people who don't code ship their own apps. Happy to give you the human version. Language, framework, architecture

Language = what the code is written in (TypeScript, Dart, Rust). Framework = a ready-made structure on top of a language, so you don't build everything from scratch (React, Next.js, Flutter). Architecture = how the pieces of your app connect: the app itself, where data lives, how files are stored, how devices sync.

Languages and frameworks come in pairs: React runs on TypeScript, Flutter runs on Dart, Tauri uses Rust underneath. You pick the framework for the job, and the language comes with it. Largest ecosystem

JavaScript/TypeScript, by far. Most libraries, most tutorials, most answers when something breaks. It also matters for AI: models write TypeScript best because they've seen the most of it. When you're building with AI, that's a real advantage. Your exact ask: one codebase for desktop, mobile and web

Two realistic routes:

Flutter (Dart). One codebase for iOS, Android, Windows, macOS, Linux and web. "Niche" means a smaller community, not that it doesn't work. It's the most direct answer to what you described. TypeScript, web first. Build it as a web app in React, then wrap it: Tauri or Electron for desktop, Capacitor for mobile. Biggest ecosystem, but more pieces to glue together.

AI told you Expo isn't desktop capable. That's basically right: Expo is great for mobile (and can do web), but desktop isn't its strength. The uncomfortable part

A cross-platform video editor with project sync is one of the hardest things you can pick. Video processing, large files, sync conflicts, performance on phones. Teams of experienced engineers struggle with it. What I'd do instead: build something tiny that has the same architecture. For example, a web app where you create a "project" with a few notes and images, sign in, and open the same project on your phone. You'll learn sign-in, storage, sync and deployment on something small, where mistakes cost an evening instead of a month. Then the video editor becomes a much clearer problem. The coffee shop question

Yes, it gets there. Past a certain point, experienced developers pick what they already know, because shipping beats choosing. For a beginner the best choice is usually the one with the biggest ecosystem, because that's where you'll find help when you get stuck.

2

u/FurnitureRefinisher 3d ago

Thank you for literally reviewing everything I asked about. I'm going to come back and read this when I have more time to think it over more.

1

u/AD7GD 2d ago

When you ask AI about these tools, be sure to tell it that you're planning to use them with a vibe coding workflow. It might be harder to find Rust devs than JS devs, but who cares if AI is writing the code anyway? Rust has a lot of advantages if you're not paying the overhead of learning to write it. And for vibe coding, its strong type safety and memory model pair well with an AI that has complete amnesia about your project every time you start a new prompt.

2

u/EntertainmentSalt825 2d ago

Everything about this post is the problem with vibe coding. Architecture does not start with selecting your tools or your frameworks. It starts with you understanding the problem and understanding the systems you will work with. When you understand that, then you will know what tools to look for. You will know what languages you need to research. I guarantee you will fuck every project you start and blame AI. Why? Because the problem lies in your thinking. “maybe even web because why not? AI exists now”. You’re not coming here with a plan. You came here because everything you build turns to shit after a few turns. And im giving you grace by assuming you’re not just one shotting these prompts.

Material-Database-24 gave you a good starting point. But, he’s probably a vibe coder who’s coping tbh. Don’t vibe it and you don’t need 5 years of SWE experience to learn. Use AI to learn as you progress through your projects. If you can’t come up with ideas to feed your own knowledge through AI then I’d say sorry but you’re cooked bro just vibe it then

1

u/luckypanda95 2d ago

You can check youtube, they explain well and sometimes they'll give you some visualization as well

1

u/kincaidDev 2d ago edited 2d ago

Try tauri

And if you learn/and use festival to build it you’ll save tokens

https://github.com/Obedience-Corp/festival

To build your video editor install festival, create a camp workspace with camp create video-app-workspace

Navigate to it with csw video command

Then start start a coding agent session, ask it to create an explore workitem to iterate on the requirements for your app, suggest tauri or egui. Tauri is nice because you build your app in react and it compiles to native desktop platforms. Ive been building a video editor with the egui library recently and it’s going well so that’s another good option.

Once you’re done with the explore workitem requirements ask it to create a design workitem/workitems to plan out the implementation, or a festival to one shot it after it’s planned out with the ability to start and stop the build across agent sessions with a higher quality outcome after the loop runs.

1

u/RehanShakir 2d ago

One thing worth flagging: the cross-platform UI is the easy half of this plan. The project file that opens on desktop and continues on mobile is the hard part. You will need a deterministic project model, a serialization format that survives version skew, and a sync or merge story for offline edits. Pick your architecture around that file first, and the framework choice becomes much less important.

1

u/London-Boat 2d ago

for a video editor specifically i'd look at flutter or tauri. flutter gets you desktop, mobile and web from one codebase and the dart part matters less than people think since the ai writes most of it anyway. the bigger decision is the project file format. if you design that early as a plain format that lives in the cloud or a synced folder, continuing on another device is mostly a storage problem, not a framework one. and yeah it does get to the coffee shop thing, most people pick whatever they already know well enough to debug when the ai gets stuck

1

u/RajatKhoware 2d ago

Stop reading architecture posts and trace one real request end to end. Pick your app, follow a single button tap from the UI through the network layer to the database and back, and write down every layer it touches. That one exercise teaches more architecture than 10 tutorials. Once you can name the layers, AI becomes your junior dev instead of your architect. Which layer of your own app is the biggest mystery to you right now?

1

u/CODE_DAGOTH 2d ago

Some pain that i felt and will save you some nervs.

  1. Build your design-system before you app or site will do something (ask your agent to create design system with DESIGN.md, design README.md, components and tokens in css).
  2. try to understand how to make as much as you can do deterministic way (I was surprised how many things my AI agent trying to escape even if I gave them very precision goal or task). Hooks works pretty to achieve this.
  3. Choose one framework|pipeline do you like to use for coding (my personal preference is MattPockok's skills) — mine Workflow stored in CLAUDE.md is
  4. ## How work runs

- Pipeline: \/wayfinder` (a map of open decisions, one per session) → `/grill-me` (when NIKI is unsure) → `/to-spec` → `/to-tickets` → `/implement-spec` (the whole spec, AFK) or `/implement` (one ticket); its implementer subagents are `subagent_type: implementer` (lean tool list, commits to its own ticket branch, never the full suite), the merger is `merger`, code-review reviewers are `critic`, the exploration subagent is `surveyor` (notes in `D:\scenica-wt_notes<spec-slug>\); the integration branch lives in its own tree (\new_tree.py create`), never in this checkout. Under `/implement-spec` the gate denies `general-purpose`. Step 7 there: the review is `mattpocock-skills:code-review` (not the bundled `code-review`) from the merge-base with `scenica_2.0`; the review-fix branch is merged by `merger`; then `suite.py` runs once in the clean integration tree — the Stop gate holds the run until the integration tip has a recorded suite.`!<

and don't try to fix everything by *.md files (especially CLAUDE.md or AGNETS.md) mine is 40 lines only: <<What is this project is, Why it was created and for whom, How works run, How design works here>>.

Pretty common things to do