2019 - inokawablog

【随時更新】vue.jsでよく使うフィルター

vue.jsには便利なフィルターという機能がある。   以下のような形で書かれ、“パイプ(‘|’)” 記号を使用する <!– mustaches –> {{ message | capitalize }} <!– v-bind –> <div v-bind:id=”rawId | formatId”></div>   コン….
続きを読む

ブログのデザインを変えようかと思う話。

タイトルの通りだが、ブログのデザインを変えようかと思っている。   このinokawablog、やはり少しダサい。 個人的にはシンプルなものが大好きで、シンプルであればあるほど良いと思っている。 noteやmediumなどはとてもシンプルで、読み手がストレスなく読めることを追求している感じがとてもよく伝わる。書いていても無駄な機能を省いており、文字間も適度に空いており、書いていても気持ち….
続きを読む

【Service Worker】Laravel + vue のSPAサイトをPWA化させてWebPushまで実装

  簡単なサンプルと、NativeとPWAでできることの説明などはこちらが綺麗にまとまっています。 Androidは大抵の機能が使えるのですが、iOS は全然ダメです。肝心のWebPushが使えないです。 アイコンのバッジとWebPushがiOSで対応したら一気に広まるとは思うのですが、今の所は機能面ではNativeに軍配が上がります。   PWA化させるだけなら Localh….
続きを読む

SPAでのOGP設定と表示方法

facebookやtwitterなどで画像を表示させたいけど、SPAでは表示されないということがあり、ずっと悩んでいました。 ただOGPを設定するだけならVue headなどを使って設定はできるのですが、twitter,facebookではogpが読み込まれませんでした。 SSRなどをして対処している記事もありましたが、複雑になるのであまりやりたくはありませんでした。   そこでふと思い….
続きを読む

vue.jsで画像をレンガ状に並べる【brick layout】

    このようなgoogle imagesや500pxのように画像をレンガ状に並べるレイアウトをvue.jsで実装していきます。 レンガ状のレイアウトを brick layout というらしいです。これとは別にPinterestのようなレイアウトは water fall と呼ばれています。   こちらのissuesを参考にして作りました。とっても素晴らしい内容でした….
続きを読む

個人的にいいなと思うwebデザイン5選

国内外問わず、個人的にいいなと思うwebデザインを厳選して5つ紹介したいと思います。 私は結構シンプルなサイトで使うやすいものが好きなので、すごいデザイナーさんが作るぐにゃぐにゃしてるサイトとかは多分紹介しないと思います。     治一郎 こちらは私の故郷の静岡にあるお菓子屋さんの治一郎のwebサイトです。バームクーヘンならびに他のお菓子はどれも美味しく絶品。お土産に持って行く….
続きを読む

【随時更新】今までで買ってよかったもの

今までで買ってよかったものランキングです。基準は、「今までで買ってよかったものを頭の中で思い浮かべて」と言われて思い浮かぶものです。それで出てこなかったものは正直いらないものだと思います。これを言われて、本当に気に入ってる場合は別ですが、2ヶ月前に買った服とか思い浮かべる人はあんまりいませんよね?   ランキングではないので順位はつけません。高いものから安物まで様々なものを紹介します。よ….
続きを読む