Hello World
Create your first native component in Rust.
This guide walks you through creating a native Rust component that renders on a physical device with hot-reload.
1. Create a Rust file
Create native/hello.rs in your project root:
use nativ_core::prelude::*;
#[component]
pub struct HelloRust {
text: String,
r: f64,
g: f64,
b: f64,
}
impl NativeView for HelloRust {
fn mount(&mut self, view: NativeViewHandle) {
view.set_background_color(self.r, self.g, self.b, 1.0);
view.add_label(&self.text, 0.5, 1.0, 0.0);
}
}2. Use it from JavaScript
import { NativContainer } from '@react-native-native/nativ-fabric';
export default function App() {
return (
<NativContainer
componentId="HelloRust"
text="Hello from Rust!"
r={0.2}
g={0.4}
b={0.8}
style={{ flex: 1 }}
/>
);
}3. Run it
npx expo run:ios --deviceEdit hello.rs, save, and watch it hot-reload on your device.
What just happened?
- Metro detected the
.rsfile change - Compiled it to a dynamic library (
.dylibon iOS,.soon Android) - Code-signed it automatically
- Served it over the Metro dev server
- The device loaded the new library and re-rendered the component
All in under a second.