electronベースのreact用IDEエディタ Reactide


2018.12.16 wrote

Reactide

Reactide

Reactide is the first dedicated IDE for React web application development. It’s a cross-platform desktop application that offers a custom simulator, making build-tool and server configuration unnecessary. Developers can render a project in the browser instantly with just a click of a button by opening a single file.

While React is still in active development, we’re keeping a weather eye on what they do have available. An integrated Node server and custom browser simulator eliminates the need for server config and build-tools. All projects developed in Reactide are build-tool agnostic. Reactide also offers a visual editing solution with a live-representation of the project’s architecture. There’s also a bunch of straightforward GUI controls that make it easier than ever to get immediate feedback in the browser simulation.

More information about Reactide is available here. Reactide is free and open source.

ビルド

git clone https://github.com/reactide/reactide.git

git checkout 2.0-release
npm install
npm run webpack
npm run electron-packager

実行

/release-builds/Reactide-darwin-x64/ に実行ファイルが出来ているのでReactideを実行する。
初期状態が起動すれば成功です。

File → NerProject で作成してみます。

作成と同時にcreate-react-appが走り新しいReactプロジェクトが作成されました。

src/index.jsを開いてみます。
右上にボタンが現れるので真ん中のボタンを押してみるとシミュレータが起動します。

ソースを変更するとリアルタイムにシミュレータに反映されます。