React Nativeによって、例えばサーバサイドをnodeで書けばアプリもサーバサイドも、さらにWebブラウザまで全てJavaScriptで書けるようになります。まさにlearn once, write anywhereの考えです。 しかしそのためにサーバサイドをnodeに書き換える、はたまた覚えるのは面倒と思う人もいるかも知れません。そこでReact NativeをRubyで実装してしまうのがOpal Nativeです。

Opal Nativeの使い方

OpalはRubyの文法でJavaScriptを書くことができるソフトウェアになります。それを使ってReact Nativeを記述するということです。例えばこんな感じになります。

require "opal"
require "react"
require "react/native"


class App
  include React::NativeComponent
    
  before_mount do
    puts "Hello!"
  end
  
  def render
    styles = React::StyleSheet.new({
      container: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: '#F5FCFF',
      },
      welcome: {
        fontSize: 20,
        textAlign: 'center',
        margin: 10,
      },
      instructions: {
        textAlign: 'center',
        color: '#333333',
        marginBottom: 5,
      },
    })
    
    present(View, {style: styles.container}) do
       present(Text, {style: styles.welcome}) { "Welcome to React Native!