# React & Framework Apps

> Build settings, routing and asset paths for framework projects that have to run from a file:// origin.

- **Applies to:** AppMint and Appwright
- **Source:** the Integration Guide shipped inside the app; this page is generated from it.
- **HTML:** https://freewebtoapk.com/docs/react-and-framework-apps

Convert React, Next.js, Astro & Vue Projects

### 1. ✅ Supported Frameworks

You can convert apps built with these popular frameworks:

- React (Vite) - Most popular, recommended
- Next.js - React-based, pages & app router
- Astro - Fast static sites with React components
- Vue.js (Vite) - Vue single-page apps

All of these work automatically - just upload your project ZIP!

### 2. 📦 Two Ways to Upload

Option A - Upload Source Code (Easiest):  
Just zip your project folder as-is and upload it. Our cloud will build it for you automatically.

Option B - Upload Pre-Built Files:  
Run 'npm run build' on your computer first, then zip the output folder (dist/, build/, or out/) and upload that.

💡 Option A is recommended for most users - no terminal or coding needed!

### 3. 📁 How to Prepare Your ZIP

1. Open your project folder on your computer
2. Select ALL files inside (including package.json, src/, public/, etc.)
3. Right-click → 'Compress' or 'Send to ZIP'

⚠️ Make sure package.json is at the root of the ZIP, not inside a subfolder.

You can also download your project from GitHub as a ZIP directly.

### 4. 🚀 Generate Your APK

1. Select 'Offline ZIP' mode in Step 1
2. Choose your project ZIP file
3. The app will detect your framework automatically
4. Fill in App Name, Icon, Splash Screen, etc.
5. Click 'Generate APK' - done!

📶 Internet is required during generation for source code projects.

### 5. 🎯 Tips for Best Results

- Keep your app a single-page app (SPA) - it works best
- If your app uses a backend/API, keep the backend hosted online
- Images and assets in the 'public/' folder are included automatically
- Test your app in a browser first to make sure it works

### 6. ❌ What Won't Work

- Server-side features (database queries, server APIs built into the app)
- Apps that need Node.js or a server to run
- WordPress, Shopify, or CMS-based websites
- Svelte and Angular projects (coming soon!)

If your app works in a browser without a server, it will work as an APK!

### 7. 📥 Download Sample Projects

Try these ready-made sample projects to test the feature. Download any ZIP below, then use it in Step 1 with 'Offline ZIP' mode to generate an APK instantly!

[⬇️ React (Vite) Sample](https://freewebtoapk.com/samples/vite-react-test-app.zip)

### 8. 📥 Next.js Sample

A multi-page Next.js app with routing - great for testing page navigation in your generated APK.

[⬇️ Next.js Sample](https://freewebtoapk.com/samples/nextjs-test-app.zip)

### 9. 📥 Astro Sample

A fast static site built with Astro and React components - perfect for content-heavy apps.

[⬇️ Astro Sample](https://freewebtoapk.com/samples/astro-test-app.zip)

### 10. 📥 Single HTML Sample

Minimal single-file offline test (just index.html). Great for quick sanity checks when troubleshooting blank screens.

[⬇️ Single HTML Sample](https://freewebtoapk.com/samples/single-html-test.zip)

### 11. 📥 HTML + CSS Sample

Simple two-file offline test (index.html + style.css) to verify external CSS loading in generated apps.

[⬇️ HTML + CSS Sample](https://freewebtoapk.com/samples/html-css-test.zip)