Step6.フロントエンドサンプル

フロントエンドの TODO サンプルアプリケーションを使って、Hexabase にアクセスしましょう。

TODOサンプル

企業システムやビジネスサービスで、利用者が操作するフロントエンドは、用途によって様々な要望があります。そのため、Hexabaseではフロントエンドをスクラッチで開発できます。

フロントエンドアプリは、ReactやVue.jsなどのフロントエンド開発フレームワークにより開発できます。また、効率よく開発を進めるため、サンプルコードをOSS(MITライセンス)として提供しています。

デモ動画

１． Github からサンプルコードを取得する

または、

git clone [email protected]:b-eee/hexa-vue-example1.git

２．実行に必要なパッケージを取得する

npm install

.env ファイルを次のように設定します。

VUE_APP_HEXACLOUD_URL="https://api.hexabase.com"
VUE_APP_HEXACLOUD_PATH="/api/v0"
VUE_APP_APPLICATION_ID="APP-todo1"
VUE_APP_DATASTORE_ID="Db-todo1"

npm run serve

これで、ToDoサンプルをローカルで起動できました。

TODOサンプルのフロントエンドアプリを利用する場合は、管理画面で、TODOサンプルを含んだワークスペースを選択した状態にしておいてください。
現在、TODOサンプルのフロントエンドアプリは、ワークスペースを選択する機能を持っていません。そのため、複数のワークスペースを持つアカウントで利用する場合、管理画面で、TODOサンプルを含んだワークスペースを選択していないと、タスク一覧が表示されません。