Ignite
Simplified Cross-Platform Mobile Development

Transform React Native development with declarative .ignite syntax. Write custom DSL files, get automatic compilation, navigation, and state management.

npm install -g the-ignite

Why Choose Ignite?

Experience the power of declarative syntax with the flexibility of React Native and Expo

Declarative .ignite Syntax

Write UI components using familiar XML-like tags in custom .ignite files with automatic compilation to React Native.

Automatic State Management

Smart state inference and generation with proper TypeScript types, useState hooks, and setter functions.

Built-in Navigation

Automatic React Navigation setup with tab bars, stack navigation, and route generation from file structure.

CLI Development Tools

Powerful command-line interface for creating, developing, and building apps with platform-specific options.

Hot Reloading & Watching

Real-time compilation during development with file watching, instant feedback, and comprehensive error handling.

Package Integration

Seamless integration with any npm package including Firebase, Expo, and third-party libraries.

Powerful CLI Commands

Complete toolkit for creating, developing, and building your apps

ignite create <name>

Create a new Ignite app with Expo setup

• Downloads starter .ignite files• Sets up assets and dependencies• Configures React Navigation
ignite dev

Start development server with compilation

• Compiles .ignite files• Starts file watcher• Launches Expo dev server
ignite dev --android

Start development server for Android

• Includes Android-specific setup• Runs on Android emulator/device
ignite dev --ios

Start development server for iOS

• Includes iOS-specific setup• Runs on iOS simulator/device
ignite build

Build app for production

• Compiles .ignite files• Prepares for distribution
ignite -v

Check version information

• Shows CLI version• Displays framework info

Write Less, Build More

See how Ignite simplifies React Native development with .ignite files

.ignite File (app/Home/index.ignite)

import { LinearGradient } from 'expo-linear-gradient'
import firebase from 'firebase'

screen title="Home" isTabScreen="true" tabOrder="1" tabIcon="home"

state user=null
state loading=false
state email=""
state password=""

async handleLogin() {
  setLoading(true)
  try {
    const result = await firebase.auth()
      .signInWithEmailAndPassword(email, password)
    setUser(result.user)
    go('/profile')
  } catch (error) {
    console.log('Login failed:', error)
  }
  setLoading(false)
}

<View style="container">
  <LinearGradient colors={['#ff6b6b', '#4ecdc4']} style="gradient">
    <Text style="title">Welcome to Ignite</Text>
    <Input 
      bind="email" 
      placeholder="Email" 
      keyboardType="email-address"
    />
    <Input 
      bind="password" 
      placeholder="Password" 
      secureTextEntry={true}
    />
    <Button 
      onPress="handleLogin()" 
      disabled={loading}
    >
      {loading ? 'Logging in...' : 'Login'}
    </Button>
  </LinearGradient>
</View>

const styles = StyleSheet.create({
  container: {
    flex: 1,
    padding: 20,
  },
  title: {
    fontSize: 24,
    fontWeight: 'bold',
    color: 'white',
    textAlign: 'center',
    marginBottom: 20,
  },
  gradient: {
    flex: 1,
    borderRadius: 10,
    padding: 20,
  },
});

Auto-Generated Features

✅React Native component with TypeScript
✅Automatic state management with useState
✅Navigation setup with React Navigation
✅Tab bar configuration
✅Import handling and optimization
✅Function generation and binding
✅Hot reloading support

Development Commands

$ ignite create my-app
$ cd my-app
$ ignite dev
Automatic compilation, file watching, and Expo dev server

How It Works

Understanding the Ignite compilation and development process

Write .ignite Files

Create declarative UI components with built-in state management and navigation in your app/ directory.

Automatic Compilation

Ignite parser processes your files and generates optimized React Native components with TypeScript support.

Live Development

File watcher detects changes, recompiles automatically, and hot reloads in Expo for instant feedback.

Ready to Ignite Your Development?

Join developers building faster with declarative mobile development