DEV Community

Amey Kurade
Amey Kurade

Posted on

🚀Convert Next.js to React Native with a Single CLI Command — Meet `ntrn`

Hey devs! 👋

Ever wished you could take your Next.js project and turn it into a working React Native Expo app without starting from scratch?

Well, I did too — so I built ntrn ✨

A developer-friendly CLI that transforms your Next.js App Router project into a complete mobile app.

💡 What is ntrn?

ntrn is an open-source CLI that:

  • 🔁 Converts app/ directory routes from Next.js into screens/ for React Native
  • 🧠 Transforms layout.tsx into a clean App.tsx root for RN
  • 🪄 Uses the Gemini API to rewrite your JSX into React Native components
  • 🎨 Supports Tailwind to NativeWind automatically
  • 📦 Detects required packages and exports them into a requirements.txt for quick setup

It’s like giving your web app a passport to the mobile world 🌍📱

🛠️ How it Works 

npx ntrn convert
Enter fullscreen mode Exit fullscreen mode

This command:

  1. Creates a new Expo React Native app
  2. Copies & converts your Next.js pages into RN screens
  3. Transforms layout into an App.tsx entry point
  4. Keeps external component imports (@/components etc.)
  5. Outputs necessary dependencies

The goal? Make it feel like a native project you wrote by hand — with minimal lift.

✨ Why I Built This

As a web developer, I love building in Next.js. But when I wanted to reuse the same structure for a mobile app, there wasn’t an easy way — it felt like starting from zero.

So I thought:

Why not automate the conversion from Next.js to React Native?

ntrn was born from that idea — a tool for:

  • Fullstack devs who want to go cross-platform
  • Indie hackers launching MVPs on both web and mobile
  • Anyone tired of copy-pasting JSX and rewriting layouts

📦 Try it Out 

npx ntrn convert
Enter fullscreen mode Exit fullscreen mode

Or clone it from GitHub:

👉 https://github.com/AmeyKuradeAK/ntrn

📸 (Optional) Demo GIF or Screenshot

Include a quick GIF showing the CLI in action, if you have one

🙏 Looking for Feedback & Contributors

Would love to hear your thoughts:

  • Is this useful for your workflow?
  • What’s missing or confusing?
  • Want to contribute?

The repo is open to issues, PRs, and stars ⭐️

Every bit of support means a lot!

Thanks for reading! If this helped or inspired you, feel free to drop a ❤️ or share it with someone building fullstack apps!

Let’s build cool stuff,

~ Amey Kurade

Top comments (1)

Collapse
 
annaspies profile image
Anna •

Am I understanding the codebase correctly, in that it's not a traditional converter, but rather it's utilizing AI agents to do the conversion for you? If that's the case, I would be more explicit about that.