Nextron

ElectronというJavaScriptでWebアプリを作る感覚で、クロスプラットホームのスタンドアローンアプリを作ることができるフレームワークがありますが、Nextronは、Next.jsを利用できるようにしたものです。

Next.jsによるベージ遷移やMaterial UI などが使え、Electronから環境を揃えること考えるとかなり便利です。

MUIサンプルのインスール

npx create-nextron-app my-app –example with-material-ui
cd my-app
npm install

　
実行

npm run dev

　
port 8888 でサーバサイドが、WebSocket でDevToolsが立ち上がります。クライアントはchromiumというオープンソースブラウザが使われます。
　

ビルド

npm run build

　
distフォルダにアプリの実行ファイルが作成されます。
　

サンプルのままでは、芸がないのでプロセス間通信を試しました。

ipcMain.on('message', async (event, arg) => { 
　//
  event.reply('message', users)
})

ipcMain.on('message', async (event, arg) => {

event.reply('message', users)

})

すでに上記 background.ts には通信を受ける定義がされていますが、リクエストを投げて受ける部分を作りました。(home.tsx)

useEffect(()=>{
  window.ipc.on('message', (v:data_t[])=>{
     console.log(v)
    }
  )
  window.ipc.send('message', 'Hello')
})

useEffect(()=>{

window.ipc.on('message', (v:data_t[])=>{

console.log(v)

}

)

window.ipc.send('message', 'Hello')

})

WebアプリはTypeScriptを使うケースが多いため、実質TypeScriptだけでスタンドアローンアプリをかくことができます。
最強のプログラム言語になってきました。

Category: 未分類