jtk

WordPress + Nuxt.js でポートフォリオサイトを作る その5

WordPressサイト(http://works.yuheijotaki.com/)の REST API と Nuxt.js でポートフォリオサイトを作成する。その5 GitHub: https://github.com/yuheijotaki/works-nuxt Netlify: https://works-yuheijotaki.netlify.com/ Pug と Nuxt.js(Vue.js) はじめ…

【読書メモ】UX(ユーザー・エクスペリエンス)虎の巻-ユーザー満足度を向上する設計開発テクニック

会社の課題でUXに関する本を読む目標を立てていたので、入門書的な標題の本を読みました。 UX(ユーザー・エクスペリエンス)虎の巻-ユーザー満足度を向上する設計開発テクニック-作者:坂東 大輔出版社/メーカー: 日刊工業新聞社発売日: 2017/09/26メディア: …

WordPress + Nuxt.js でポートフォリオサイトを作る その4

WordPressサイト(http://works.yuheijotaki.com/)の REST API と Nuxt.js でポートフォリオサイトを作成する。その4 GitHub: https://github.com/yuheijotaki/works-nuxt Netlify: https://works-yuheijotaki.netlify.com/ Netlify にデプロイ Netlifyのサ…

WordPress + Nuxt.js でポートフォリオサイトを作る その3

WordPressサイト(http://works.yuheijotaki.com/)の REST API と Nuxt.js でポートフォリオサイトを作成する。その3 GitHub: https://github.com/yuheijotaki/works-nuxt 作業フォルダを src/階層にまとめる nuxt.config.js に export default { ... srcDi…

WordPress + Nuxt.js でポートフォリオサイトを作る その2

WordPressサイト(http://works.yuheijotaki.com/)の REST API と Nuxt.js でポートフォリオサイトを作成する。その2 GitHub: https://github.com/yuheijotaki/works-nuxt クリックイベントと $emit / props コンポーネント名を Filter.vue にしようと思っ…

WordPress + Nuxt.js でポートフォリオサイトを作る その1

WordPressサイト(http://works.yuheijotaki.com/)の REST API と Nuxt.js でポートフォリオサイトを作成する。その1 GitHub: https://github.com/yuheijotaki/works-nuxt サイト構成 下記のシンプルな構成で行う トップページ (/) Works一覧(クリックで詳…

JAMstack と Headless CMS

Headless CMS について調べる用事があったのですが、関わりが深そうな JAMstack についても調べてみました。 JAMstack とは? JAMstackはテクノロジーではなく、JAMstackはWebサイトやアプリを構築する新しい方法です。クライアントサイドに基づいた最新のWe…

【読書メモ】この1冊で合格! AWS認定ソリューションアーキテクト - アソシエイト テキスト&問題集

ソリューションアーキテクト アソシエイトの試験を受けるにあたり、勉強段階の終盤のほうで読みました。 この1冊で合格! AWS認定ソリューションアーキテクト - アソシエイト テキスト&問題集作者:アクセンチュア株式会社,青柳 雅之,飯田 敏樹,柿沼 力,門畑 …

2019年12月 振り返り

結果 ブログ 目標:月 12 回(週 3 回)更新 結果:月 16 回 更新 読書 目標:月 1 冊 結果:月 2 冊 反省点など フロントエンドの技術的な所に関して何かしらの向上ができなかった。 ブログはまとめ系が多かったですがアウトプットできてよかった。 来月に…

AWSソリューションアーキテクト アソシエイト 受験記

AWS

これまで・今回の結果 2019年6月 プラクティショナー合格 830点( https://jtk.hatenablog.com/entry/2019/06/12/223000 ) 2019年7月 SAA 不合格 630点 ( https://jtk.hatenablog.com/entry/2019/07/09/100106 ) 2020年1月 SAA 合格 771点 ※今回 受験理由…

2020年やりたいこと

サービス/ツール/キーワード いろいろありますが追っておいてマスターしておきたいものたち フロントエンド 表示速度・パフォーマンス HTML/CSS AMP PWA セマンティックなマークアップ JavaScript Vanilla JS Vue.js Nuxt.js WordPress ブロックエディタ Hea…

Webサイト高速化/最適化のためにやったこと

概要 最近作っていたWebサイト( https://atelier24b.com/ )で、Chorme の Audits 使ってパフォーマンス計測しながらやってみたのでその結果 サイトの作り的には WordPress カスタム投稿で一覧/詳細ページ 固定ページあり webpack使って html/css/js コンパ…

2019年 / 2020年

ちょっと早いですが今年の振り返りと来年へ向けてのことを考えました。 2019年 インプット 技術の知識に関しては普段の業務や読書、RSS経由でWebメディアを見ながらという感じ。 基本はフロントエンド(HTML/CSS/JavaScript/Vue.js)、デザイン(UI/UX/Webギ…

【読書メモ】AWSクラウドの基本と仕組み

ソリューションアーキテクトの試験を7月に不合格になってからAWS関連の勉強してこなかったのですが、もう一度受けてもいいかなと思いつつ、よさそうな本がでていたのでリハビリも兼ねて読んでみました。 AWSクラウドの基本と仕組み作者:亀田 治伸,山田 裕進…

copy-webpack-plugin でファイルを別階層にコピーする

copy-webpack-plugin の設定でちょっとはまったのでメモ webpack-contrib/copy-webpack-plugin: Copy files and directories with webpack やりたいこと src/ 以下の特定階層ファイル( src/library/*.js )を app/ 以下の階層にコピーしたい webpack.config…

2019年後期のWebサイト

2019年後期のWebサイト 2019年後期で気になったWebサイトをまとめておきます。 前期 同様、デザイン/実装ともに好みのものです。 「IDOLY PRIDE」ティザーサイト だいたい画像文字なのですが、このくらい生かしてるサイトもなかなか見なくなってきた https:…

今年読んだ本

フロントエンド Webフロントエンド ハイパフォーマンス チューニング 改訂新版JavaScript本格入門 ~モダンスタイルによる基礎から現場での応用まで JavaScript コードレシピ集 リーダブルコード ―より良いコードを書くためのシンプルで実践的なテクニック (T…

Vue.js・Nuxt.js を使用したサイトまとめ

Vue.js or Nuxt.js を使ったサイト、日本のまとめあまりないのでまとめておきます。 デザインギャラリーサイト経由で見つけた多いのでWebアプリではなくサイトが多め。 採用サイトで結構使われているのは技術採用しやすいからかなと思いました。 Webアプリも…

WordPress に Vue.js を スモールスタートで入れてみる その7

とあるサイトでVue.jsで作っていて、公開してからもろもろやったことまとめ その7 最後は細かいテクニック的なところについて ローディング API から投稿データ取得するまでローディング、取得後に解除する DOM更新後にローディング解除したいので $nextTick…

WordPress に Vue.js を スモールスタートで入れてみる その6

とあるサイトでVue.jsで作っていて、公開してからもろもろやったことまとめ その6 今回はPhotoSwipeのvueモジュールについて v-photoswipe バニラJSのフォトギャラリープラグイン PhotoSwipe スワイプなど、スマホの各アクションにも対応しているのでlightbo…

WordPress に Vue.js を スモールスタートで入れてみる その5

とあるサイトでVue.jsで作っていて、公開してからもろもろやったことまとめ その5 今回はモジュールについて Isotope レンガ式のレイアウトをするためにnpmモジュールがいろいろあります。 vue-masonry を最初使ってましたが、実行タイミングが早かったり、v…

WordPress に Vue.js を スモールスタートで入れてみる その4

とあるサイトでVue.jsで作っていて、公開してからもろもろやったことまとめ その4 今回は記事ページでの情報取得について 詳細ページで記事情報のAPIにアクセス テンプレートファイル側(.php)で投稿IDを取得して変数 POST_ID に格納しておく SAMPLE-POSTTY…

WordPress に Vue.js を スモールスタートで入れてみる その3

とあるサイトでVue.jsで作っていて、公開してからもろもろやったことまとめ その3 今回はACFオプションページのリピーターフィールドについて ACF オプションページ リピーターフィールドの取得・出力 カスタムフィールドは、 sample_field(繰り返しフィー…

WordPress に Vue.js を スモールスタートで入れてみる その2

とあるサイトでVue.jsで作っていて、公開してからもろもろやったことまとめ その2 基本構造 WordPress の各テンプレートファイルからVue.jsを呼び込む トップページの場合、 homeGallery.vue には Vue ( <template> と <script> ) を書いていく感じ。 ▼ app.js import Vue from</template>…

WordPress に Vue.js を スモールスタートで入れてみる その1

とあるサイトでVue.jsで作っていて、公開してからもろもろやったことをまとめようと思ったのですが、年内公開も怪しくなってきたので今の段階でメモしておこうとおもいます。 概要 WordPress を使った既存サイトがあり、リニューアル版は WordPress を残しつ…

【読書メモ】インタフェースデザインのお約束 ―優れたUXを実現するための101のルール

インタフェースデザインのお約束 ―優れたUXを実現するための101のルール作者: Will Grant,武舎広幸,武舎るみ出版社/メーカー: オライリージャパン発売日: 2019/11/09メディア: 単行本(ソフトカバー)この商品を含むブログを見る 本屋に寄って見つけた イン…

2019年11月 振り返り

結果 ブログ 目標:月 12 回(週 3 回)更新 結果:月 5 回 更新 読書 目標:月 1 冊 結果:月 1 冊 反省点など 11月中に読んだUI GRAPHICSと、次のを読んでいるので読書週間は少しずつ回復 ブログを書くネタがないわけではないですが、日頃からネタ帳作って…

Shifter をさわってみた

WordPress の静的ホスティングサービス Shifter を検証で触ったのでメモしておきます。 今回採用には至らず、無料プランで試した範囲の内容です。 概要 WordPress の静的ホスティングサービスってなんだろと思ってましたがざっくり Shifter の特長として認識…

【読書メモ】UI GRAPHICS 成功事例と思想から学ぶ、これからのインターフェイスデザインとUX

【新版】UI GRAPHICS 成功事例と思想から学ぶ、これからのインターフェイスデザインとUX作者: 安藤剛,水野勝仁,萩原俊矢,ドミニク・チェン,菅俊一,鹿野護,有馬トモユキ,渡邊恵太,須齋佑紀/津?将氏,庄野祐輔,藤田夏海,塚田有那,増川草介??栂木一徳出版社/メー…

Docker で WordPress ローカル環境構築

だいぶ前に作られた環境を触った経験はある気がしますが、Dockerを入れると環境構築が楽だということでやってみました。 まだまだ理解ができていない細かいことありますが、結構便利だなと 複数人でも同じローカル環境つくれるのいいですね。 インストール D…