• 技術が集うTECH GUILD

    【Vue.js入門】ユーザ管理画面をVuetify.jsのData tablesで作る

    ユーザ管理画面のUIをVeutifyのData tableを使って作ってみました。 ほとんどは公式のリファレンスを参考にしました。 https://vuetifyjs.com/ja/component …

    続きを読む


    【Vue.js入門】Vuetifyの導入

    Vue.jsで簡単なユーザ管理アプリを作ろうとしています。 UIコンポートネントは、Vuetifyというものを使用してみます。 Vuetifyの利用 まず、Vuetifyの公式ドキュメントを見てみまし …

    続きを読む


    【Vue.js入門】VueのHelloWorldを解説 (Vue Routerあり)

    概要 前回記事でVue RouterなしのHelloWorld、「vue_app_norouter」を作成し、記述内容を整理しました。 Vueはシンプルで学習コストが低いと紹介されていることが多いので …

    続きを読む


    【Vue.js入門】VueのHelloWorldを解説 (Vue Routerなし)

    Vue.jsで、vue init webpackしたときに生成されるindex.html/main.js/App.vue/HelloWorld.vueがどのような構造になっているか整理しました。 Vu …

    続きを読む


    【Railsサンプルアプリ】Rails – VueアプリのCORS対応

    前回記事のRailsバージョンをVueで表示する際、 http://localhost:8080からhttp://localhost:3000がクロスドメイン通信になっており、CORSへの対応が必要で …

    続きを読む


    【Railsサンプルアプリ】RailsのバージョンをVueで表示

    サンプルアプリとしてRailsのバージョンをVueで表示してみます。 Rails側は、バージョンを返すWebAPIを作成し、Vue側でWebAPIを呼び出す方式とします。 概要 Rails側 Rail …

    続きを読む


    Vue CLI環境構築

    Vue CLIをインストールしました。 概要 nodebrewのインストール node.jsのインストール npmでvue-cliをインストール npmでyarnをインストール Vueでプロジェクトを …

    続きを読む


    Vue.js 入門 フォーム部品のサンプル

    Vue.jsで主なフォーム部品のサンプルを表示してみました。 概要 以下のフォーム部品を試しています。 input type=”text” 1行テキスト textarea 複数 …

    続きを読む


    Vue.jsの入門 お手軽サンプルを試してみる

    Vue.jsを試してみます。 Vue CLIを導入する前に、まずは簡単に試せるVue.jsのサンプルを動かしてみます。 Vue.jsのサンプル 以下をhtmlファイルとして保存し、Webブラウザで開き …

    続きを読む