Building My First Mobile App with AI and React Native (Week 03)

Last week, I finished designing the MVP for my little brother’s learning app, and this week, I finally started building it with React Native. 🚀

As I mentioned in Week 01, I’ve never built a mobile app before. I only have a small background in ReactJS from a few web projects, and I haven’t really coded for almost two years. Still, because React Native is close to ReactJS, I decided to give it a shot, and learn while building.

To get started, I watched a 3-hour YouTube tutorial. It’s not enough to make me good at React Native, but it gave me a solid foundation, just enough to understand the code, debug small issues, and keep learning as I go.

For the IDE, I chose Cursor AI. Honestly, I didn’t have a deep reason, I just kept seeing people recommend it for “vibe coding.” Plus, its interface looks almost identical to VS Code, which I used before, so it felt familiar.

My first try (and first fail)

My initial plan was simple:
share the design screenshots, the Figma link, and a clear description of what I wanted, and let Cursor generate the full app structure.

Well… it didn’t work. 😅

The app didn’t even run, and I spent a whole day debugging with no success. Since I’m still new to React Native, I didn’t want to waste more time stuck in setup hell. So the next day, I decided to follow the YouTube tutorial step-by-step just to manually initialize the project.

This time, it worked! 🎉

Now that I had a working project, I went back to Cursor, but with a different approach. Instead of asking it to build everything at once, I started small. I divided the UI into small components and built them one by one with AI.

Cursor wrote 90% of the code, and I handled the small edits, reading through it, testing, and debugging when things broke. That rhythm worked really well, I felt in control and could understand what was actually happening behind the scenes.

From free to pro

I was using Cursor’s free plan at first, but I hit the token limit fast, so I upgraded to Cursor Pro ($20/month). You can hit the token cap before the month ends, but it’s still affordable compared to hiring a developer or using no-code platforms.

In just six days, I managed to build around 40% of the MVP.

Seeing it come to life

When I finally saw the first version working, I won’t lie, it felt powerful.
For two years, this idea lived only in my head. I tried to bring it to life through no-code tools, but they were always limiting and expensive. Once you stop paying, you lose your app. You never truly own it.

With Cursor AI, it’s different. It’s flexible, cheaper, and I own every line of the code. Even if I stop paying, the project is still mine. That’s a huge difference for indie builders like me.

The biggest challenge: Arabic RTL

Of course, it wasn’t all smooth. Since the app is in Arabic, I had to make everything display right-to-left (RTL). That was honestly a headache. Cursor didn’t seem fully optimized for RTL, so I had to fix a lot of things manually. It took time, but I got it working in the end.

Progress so far

Right now, the learning path, bottom navigation, and header are done.
It’s not the full MVP yet, but it’s a solid start. My original plan was to finish it in one week, but as I got deeper into development, I realized it’s a bit more complex than I thought (which is fine).

Still, I’m happy with how much progress I’ve made and how much I’ve learned in just a short time.

Next week, I’ll be focusing on building the lesson screens and improving the overall experience. I’m hoping to finish the full MVP by then, but no matter how it goes, I’m excited for what’s coming next.

Thank you for reading, see you next Tuesday! 🚀