このブログは @nuxt/content で運用しており、執筆環境としては非常に快適に利用できている一方で、Markdown ベースの宿命として、Markdown 記法で画像を貼り付けている限り Layout Shift が発生するという課題が存在していました。暫定的な対処としてしばらく <img> で置き換えてきましたが、根本的に対処するために rehype-plugin-auto-resolve-layout-shift を開発したのでその報告と紹介をしたいと思います。
最近仕事で SpeakerDeck の埋め込みを実装する機会があり、 SpeakerDeck のスライド URL から埋め込みコードを生成することになった。SpeakerDeck には埋め込みコードを取得できる機能があるが、利便性およびユーザーから提供される任意の HTML をそのまま表示したくないという理由から URL から自動的に生成するほうが都合が良いという結論に至り、実装を進めた。
iPhone に辞書の一括インポート機能がないので、 iCloud Drive を経由する形で Mac から辞書登録をしようとしたところ、Google 日本語入力で一般に用いられている辞書データの形式(txt)が、Mac や iPhone と互換性がない(こちらは plist)ことがわかった。
Nuxt.js の Sitemap Module について、何故か Generate による Static Page / Full Static でしか利用できないと思いこんでいたのでメモ。
@nuxtjs/amp に投げていたパッチが無事マージ・リリースされたので、 @nuxt/content を利用した静的 Web サイトを AMP 対応させる方法について紹介したいと思います。
2020 年は一般的なソフトウェアエンジニア。というよりは少し経路が違う仕事を主にやっていたので、良い機会なのでまとめようと思います。
先日、「”地上最強”のエンジニア向け情報サービス」を謳うTechFeed Proが新規アップデート。様々な機能追加がなされ、更に多くの情報収集が可能となりました。今回はそんな TechFeed のアップデートで追加された URL 共有機能の導線として、 techfeed-share-button パッケージを OSS として公開した記録を紹介します。
今年はフルリモートを契機に、東京都心から郊外や関東4県へ引っ越すケースを TL や職場でよく見る一年でした。「家賃は下がる上に静かだし部屋も広くなった」みたいな話を聞くたびにそれも良いなと思いつつも、冷静に考えると私は都心以外で生活できる場所はかなり限定されるなと思うので、その辺りについて改めて残しておこうと思います。
年の瀬なので、私自身が今年利用した技術をベースに技術スタックをまとめてみようと思います。とはいえ Web Standard といった広い対象から、フレームワークやライブラリまで、粒度の違うものを全て言及するのは無理があるというもの。特に強く言及できるものは個別で説明しつつ、最後に利用する機会がなかったものも最後に記載する形で。
11/09 に開催された Front-End Study #1 について、Forkwellとの共催で運営・企画並びに司会に携わりました。参加登録者2,552人、同時視聴者も1,500人を超えるバケモンとしか言えないイベントになったわけですが、無事終わって何よりというところで一筆。
LitElement を利用した Custom Element の開発をしていて、 enzyme や vue-test-utils のようなコンポーネントのテストを記述したい。
サーバーサイドのテンプレートエンジンと Vue.js が混在しているプロジェクトを経験したことがある人には馴染み深い(?) Vue の delimiters オプションですが、Vue 3 になってからコンポーネント単位で設定できるようになっていました。仕事で Nuxt.js の app.html の仕様の説明ついでに、 mustache 記法について説明を行った際に書いた Vue 3 サンプルで初めて気づいたので、メモ程度に残しておきます。
今や有効活用している人はかなりすくなったように思えるメールボックス。ログインのための Identifier とそれに関する通知システムとしてのみ使っている人も多いかと思います。
この間の連休で生産的な活動をやったので、その分の休憩としてここ一週間ほど仕事以外の時間をポケモンに捧げていた。一ヶ月あるポケモンのシーズンの中で、9月期に3桁を目標としていたが、結果としては1,300位。惜しいところまではいったが、もう一歩頑張りたいところではあった。
9/25(金)に Moment.js の送別会を YouTube Live / Discord で行いました。フロントエンドから卒業することになった Moment.js の思い出と、今使っている時刻操作ライブラリなどについて語る会となります。当日のYouTube Liveアーカイブ
かなり濃い連休を過ごせた気がするので、できたこと・できなかったことをふりかえってみる。
最近 zenn.dev がソーシャルで流行っている。サービスコンセプトであったりアプリケーションの品質だったりといろいろな観点で各々が言及しているけれど。個人的には情報を発信した人に対して金銭的なインセンティブがある点がかなり面白いなと。
昨日、拙作の Nuxt.js プラグインである @nuxtjs/dayjs の v1.2.0 をリリースしたので、改めてなぜ Day.js を利用しているのかを書こうと思います。
Conventional Commits にも参照がある chore や doc 形式のコミットメッセージが、standard-version でリリースノートに含まれないことが不満に思っていたけれど、昨日ようやくカスタマイズ方法を知ったので残しておきます。
9/2 に書いた記事で紹介した、 nuxt/content で Markdown 内の画像に Native Lazy-Loading をつけるコードに需要がありそうだったので、rehype plugin としてそのまま切り出しました。
会社で Stencil で作られた Web Component の NPM パッケージが OSS として公開されていて、Vue.js のアプリケーションではこれまでも利用していたけれど、React でも利用したくなった。が、やってみるとドキュメント以上の工夫が必要だったのでメモ。
つい最近 NPM パッケージ版が出たばかりの LIFF(LINE Front-end Framework)ですが、まだ NPM パッケージ版は Stable ではなく、現場によっては CDN 版を継続して使っているところも多い印象です。
久々に Node.js 環境の axios で multipart/form-data を扱ってたら Gyazo API のレスポンスの謎さも相まって辛かったという話です。
昔は cron といえば Heroku と Heroku Scheduler だったけれど、Heroku Scheduler が
ブログや技術メモを書くとき、お手軽な画像ホスティングとして Gyazo を使うけれど、 Gyazo のリンクコピーをそのままやると画像でサイトが重くなるので lazy loading を追加した話。
JSON-LD、結構書くの面倒ですよね。細かな仕様を都度 https://schema.org/ に見に行ったり
自明だと思っていたけれど、割と見かけるので。Factory 関数やそれに相当するようなものは、得てして作成時点、あるいは将来的にかなりのオプションを取る可能性があります。
先日の v-tokyo #11 の懇親会で質問されたので、Native TSX Support される Vue 3 でなぜ tsc だけで TSX が動作しないのかを聞かれたのでメモとして残して置こうと思います。
