結果 ブログ 目標：月 12 回（週 3 回）更新 結果：月 15 回 更新 読書 目標：月 1 冊 結果：月 2 冊 反省点など 学習のアウトプット（主にVue.js）に関して、今月から技術本の写経ではなく、自分の作りたいものをゼロベースで実装してみる形に変えてみた。 …

やること 前回のファイルを引き継いで Vue Router を使用して新しいページ（ /about/ ）を作成する。 ページごとにファイルを分ける /src/router/index.js import Vue from 'vue' import Router from 'vue-router' import top from '@/components/top' impor…

やること ポートフォリオページ のコンテンツのエンドポイントを WP REST API を用いて作成 カテゴリー絞り込みを実装する WordPress側（functions.php）でのAPIへのフィールド追加 display という自前のデータを v-show: を使って判定させるため下記をfunct…

やること ポートフォリオページ のコンテンツのエンドポイントを WP REST API を用いて作成 記事タイトルやサムネイル、ACF で登録している値を Vue.js で描画 画面読み込み時に methods のfunctionをレンダリングする ... created: function(){ this.reques…

今年はブログ書いたりアウトプットを習慣にしようと思っていたので、Amazon で評価の良かったこの本を読みました。 学びを結果に変えるアウトプット大全 (Sanctuary books)作者: 樺沢紫苑出版社/メーカー: サンクチュアリ出版発売日: 2018/08/03メディア: 単…

やること 前回の続き WordPress の記事一覧を WP REST API を用いてエンドポイントを作成 Vue.js で、カテゴリー一覧、記事タイトルの一覧を表示させる Vue.js で、カテゴリーごとの投稿一覧を表示する GitHub App.vue <template> <div id="app"> <header> <h1>blog.yuheijotaki.com</h1> <nav> <ul class="category_list"> <li v-for="cat in categories" :key="cat.name.rendered"> </li></ul></nav></header></div></template>

やること WordPress の記事一覧を WP REST API を用いてエンドポイントを作成 Vue.js で、カテゴリー一覧、記事タイトルの一覧を表示させる Vue.js で、カテゴリーごとの投稿一覧を表示する セットアップ 前回と同じ Vue.js 側の処理 クリックした <a> 要素の d</a>…

AMP サイトでアニメーションを実装する機会がありましたが、amp-animation だったり、amp-fx-collection や amp-story というコンポーネントまであり、こんがらがったのでまとめをしておきます。 amp-animation とは Web Animations APIに依存した、JSON で…

例えば、 <div class="object object_01"><amp-img src=""></amp-img></div> <div class="object object_02"><amp-img src=""></amp-img></div> <div class="object object_03"><amp-img src=""></amp-img></div> <div class="object object_04"><amp-img src=""></amp-img></div> <div class="object object_05"></div>

やること WordPress の記事一覧を WP REST API を用いてエンドポイントを作成 Vue.js で記事タイトルの一覧を表示させる セットアップ Vue CLI を使用。前回と同じ工程。 エンドポイント こちらも前回と同様に WordPress の wp-json を使用します。 REST API…

7 Vuex によるデータフローの設計・状態管理 もスキップ。ざっくり読みましたが、データをどう持たせて処理するのが良いのかの参考になりました。 8 中規模・大規模向けのアプリケーション開発 ① 開発環境のセットアップ ② 設計 ③ 実装 を実際に手を動かさず…

最近 WordPress で詰まったこと、使ったことをメモしておきます。 page.php で pre_get_posts のクエリ書き換えがうまくいかない 固定ページである投稿タイプの一覧出して、ページ送りも実装して、としたかったのですが、仕様的に難しそう。 pre_get_posts …

5.3 カスタムディレクティブ 5.4 描画関数 5.5 ミックスイン はスキップ。もう少し基礎的な部分を理解したらもう一度読み直そうと思います。。 6 単一コンポーネントによる開発 6.2 単一コンポーネントとは Vue.js では、上記のような単一ファイルコンポーネ…

5 Vue.js の高度な機能 5.1 トランジションアニメーション 5.1.1 transition ラッパーコンポーネント transition コンポーネントは、自身が囲んでいるコンポーネントあるいは要素が出入り（enter/leave）する際にトランジションを追加します。出入りは、以下…

4 Vue Router を活用したアプリケーション開発 4.2 ルーティングの基礎 4.2.2 ルーティング設計 ルート と ルーターコンストラクタ を用います。 <div id="app"> <router-link to="/top">トップページ</router-link> <router-link to="/users">ユーザー一覧ページ</router-link> <router-view></router-view> </div> <script src="https://unpkg.com/vue@2.5.17"></script>

毎月のまとめとして月次の振り返りをしようと思います。 結果 ブログ 目標：月 12 回（週 3 回）更新 結果：月 22 回 更新 読書 目標：月 1 冊 結果：月 2 冊 反省点など Vue.js は本を何冊かやっているが、実際の案件で用いるところまでは踏み込めてない印…