Next.js + GitHub Pages でブログを作った
タイトルのとおりです
blog starter とかもあったけど、Next.js 全然触ったことなかったのでスターターは使わずに自分で実装してみた
やったこと
わりと最低限の部分だけを仕込んだ感じ、随時改修していきたい
まだやってないこと
git の初期ブランチ名を main に変更する
GitHub デフォルトのブランチ名が main なので、それにあわせる
git config --global init.defaultBranch main
これで、ローカルで git init したときもデフォルトのブランチ名が master ではなく main になる
gitの差分をhtml形式で出力してくれる diff2html
gitの差分を、htmlページに埋め込む必要がありました。
できれば、見栄えのいいかんじ、GitHub 風に出力したく、そんなことができるツールを探していたところ、diff2html というライブラリに遭遇。
見た目はこんな感じ。GitHub風で見やすい。
つかいかた
使い方はとてもかんたんで、まずは npm install しまして
npm install -g diff2html-cli
あとはコマンドラインにて
git diff [ブランチ1] [ブランチ2] | diff2html -i stdin
とか
diff -u file1.txt file2.txt | diff2html -i stdin
とかすればよいです。差分がhtml形式で出力されます。
横並びにしたければ --style side オプションをつけてください。
その際の見た目はこんなかんじ
とりあえず試したければ
ブラウザから使えるものもこちらのサイトにあり
Demoページでサクッと試すこともできます
読んだ「成功する要求仕様 失敗する要求仕様」
「成功する要求仕様 失敗する要求仕様」アラン・M・デービス
読んだ。いわゆる要件定義・要求定義に関する本。帯に「デマルコ絶賛！」とあり、表紙の感じからも「ピープルウェア」など一連のシリーズものの扱いなのかも。2006年初版ということでけっこう古いんだけれども、自分は最近知った。
原題は “Just Enough Requirements Management” ー ちょうど十分な、要求マネジメント。「ちょうど、十分な」というところがミソっぽい。
雑感 (雑な感想)
いや、良くまとまってるなーと思った。この本では、要求を「導き出し」、「トリアージし」、「仕様化」、という流れからの「変更を管理せよ」となっている。
問題解決やビジネス成功のために大事なことは、
- ユーザー視点を理解する
- 時間やリソースに都合のつく問題にのみ、対処する
- 齟齬の無いよう、自分たちが理解した内容を記録する
- ニーズの変化に対応する、柔軟であり続ける
これらがそれぞれ、「要求の導き出し」「トリアージ」「仕様化」「変更管理」にあたるという形。
構成もわかりやすい。第1章が「はじめに」、2〜5章が前述の「導き出し」〜「変更管理」、6章が「まとめ」なんだけど、わずか7ページの「まとめ」が特に簡潔にまとまってる。一部抜粋。
「もし、自分のほうが顧客よりも要求をよく知っていると思い込んでいるのなら、あなたは解決者ではなく、問題の一部なのである。」
「もっと機能を追加しよう！という意見が通った場合、提供は遅れるものである。そんなに多くの機能は実装できない！という意見が通った場合、製品の競争力は低くなるものである。」 「顧客は、自分が抱える問題を解決したがっている。コンピュータの記法を学びたがっているわけではない。」
細かいテクニックよりも、考え方の面について勉強になるのだけど、内容は観念的ではなくデータ・グラフをもとにした具体的な記述も多い。もう少し読み込みたい。
Add to Trello の代わりになる、Trello用ブックマークレットを作った
愛用していた Trello用の Chrome拡張 "Add to Trello" が、しばらく前から使えなくなってしもうた
ので、自分でブックマークレットを作った話です
やりたいこと
現在ブラウザで開いているページを、サクッとTrelloにカードとして追加したい。
- あとで読む
- 開いた issue のページを ToDo としてカード化する
などの目的で使います。
Add to Trello
今までは、こちら Chrome拡張を愛用していました。ですが、最近使おうとすると
"Invalid return_url. Wildcard ("*") allowed origins are no longer supported. Contact the developer. See https://community.developer.atlassian.com/t/52093"
というエラーが出るようになってしまいました。
GitHub には issue も出ているようではありますが……
しばらく復旧の見込みなさそうで。
Trello 公式のブックマークレットを使う
そう、公式のブックマークレットがあった
実際こちらで、ほぼ同じことができるのでした。2クリックで、現在開いているページを Trello のカードとして保存できます。
目立った違いは、開いていたページのURLが、カードの description じゃなくて attachment として保存されること、くらい？
description として保存したい
これでほぼ解決ではあったのですが、やっぱり以前と同様、URL を description に保存して欲しかった。
ので、ちょっとブックマークレットを編集しました。こんな感じです
javascript:(function(w){w.open(`https://trello.com/ja/add-card?name=${encodeURIComponent(document.title)}&desc=${encodeURIComponent(w.location.href)}&mode=popup`,'add-trello-card',`width=500,height=600,left=${w.screenX+(w.outerWidth-500)/2},top=${w.screenY+(w.outerHeight-740)/2}`)})(window)
これで、ブックマークレットをクリックすると「ページタイトルがカードのタイトルに、URLが descriptionに」という状態でカードが作られます
以上