複雑化するとともに、JSONデータを書くのが煩雑になってきたため、Angularの勉強もかねて、ER図作成ツールを作ることにしました。初心者にもわかりやすい解説をしようと思ってます。Cloud9へAngularをインストールしましょう。(1)Cloud9■cloud9https://c9.io/アカウントを作る、またはGithubのアカウントでログイン。workspaceする。8.9.4なので、それをインストールする。5.6.0になりました。(3)Angularのインストール公式に従って、AngularCLIを使用。er-diagramルート直下にer-diagramフォルダができるが、不要なので、階層を変更します。/etc/apache2/sites-available/001-cloud9.conf・iで編集モードに移行。・終了するときは、escキーを押して、:wq!で保存終了できます。buildを実行すると、distフォルダが生成されます。distフォルダ内のindex.htmlを開いて、「Run」でプレビューしましょう。※表示されるurlは、https://***.c9users.io/dist/index.htmlで、notFoundになるため、https://***.c9users.io/を開きましょう。保存するたびに自動で更新されます。リモート設定して、pushします。0.1.0■githubhttps://github.com/dog-ears/er-diagram-tool/tree/0.1.0今回はここまで。iconの追加、ナビバーの作成を行います。モデル修正・削除機能の実装。左カラムに表示するmodel用のコンポーネントを作ります。編集機能を実装navbarからモーダルでフォームを開き、dataを編集できるようにします。前回追加した機能で出力したJSONをインポートできるようにします。今回は、dataのmodelを追加する機能を実装します。基本的には、modelとほとんど同じです。(1)schemaを登録・編集するフォームモーダルを作ります。コメントをキャンセルメールアドレスが公開されることはありません。*サイト最近の投稿とりあえずESlistとprettierでコードフォーマットしたい人へ。Codeで動く設定ファイルをさらしてみる。Expressなしで、最短でNuxt(SSR)をfirebaseで公開してみる。まとめ【初心者向け】ドラゴンボールクリッカーを作ってみた。