-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
1 changed file
with
40 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,40 @@ | ||
= GitHub を利用した新しいコメントシステムを実装しました | ||
:page-category: Tech | ||
:page-tags: [JavaScript, Blog] | ||
|
||
GitHub って特定のコミットに対してコメントする機能があるじゃないですか. | ||
これを技術ブログのコメントに流用したら,どのバージョンに対するコメントなのかがはっきりしてめっちゃ便利なんじゃないかと思いました.ので,このブログのコメント機能として実装してみました. | ||
|
||
== どんなもんよ | ||
この記事を一番下までスクロールするとそこにあります. | ||
テスト代わりに書き込んでみてもいいですよ. | ||
気に入ったら真似してくださっても結構です. | ||
|
||
== システム概要 | ||
仕組みとしては単純で,GitHub の2つの API を組み合わせただけです. | ||
|
||
- https://docs.github.com/en/rest/reference/repos#list-commits[List commits] | ||
- https://docs.github.com/en/rest/reference/repos#list-commit-comments-for-a-repository[List commit comments for a repository] | ||
|
||
前者は特定のリポジトリのコミット履歴を一覧で取得するものですが,パラメタで指定すると,特定のファイルへの変更を含むものだけを抽出できます. | ||
後者は特定のリポジトリに存在するコミットコメントを一覧で取得できます. | ||
|
||
この2つを組み合わせることで,ウェブサイトを管理するリポジトリのコミットコメントのうち,閲覧中の記事に関連するもののみを一覧で取得することができます. | ||
|
||
|
||
== 開発四方山話 | ||
私は JavaScript に対する忌避感が強くて,いくらでもヤバい書き方ができてしまう闇黒な言語だと思っていました. | ||
|
||
モダンで明確な書き方もできるだろうとは思っていましたが,初学者の私にはどれが良い書き方でどれがヤバい書き方なのか区別できる自信がなかったので,信頼できる良い教材が見つかれば勉強してみようかなあくらいの気持ちでずっと過ごしてきました. | ||
友人の https://github.com/kirisaki[@kirisaki] さんに https://jsprimer.net/[JavaScript Primer] を教えてもらったので,重い腰を上げてちょっと勉強してみたら,案外簡単に書けました. | ||
|
||
これからは JavaScript とも適度な距離感を保ちながら仲良くして行こうと思います. | ||
私は JavaScript とかよりも Julia とか Rust とかがやりたいんだよなあ. | ||
|
||
|
||
== 課題 | ||
2 種類の API のうちどちらも,一回のリクエストでは同時に 100 件のコミットコメントなりコミットなりしか取得できません. | ||
|
||
まあひとつの記事を 100 回も書き直すことはまずないのでコミットの方はどうでもいいんですが,コミットコメントの方はリポジトリ全体で 100 件が限界なので,このブログへの累計コメント数が 100 件に達する前にページネーションを実装する必要があります. | ||
|
||
そのうちやる気が出たらやります.でもその前に CSS のヤバさをなんとかしないといけない…… |
b325e88
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
adocで記事って書けるんだ、勉強になります(コメントテストもかねて)
b325e88
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@sevenc-nanashi asciidoc は表現力が高くて技術ブログとかに向いている印象があります。
Jekyll だといわゆる Frontmatter を書かなくてもいけるので、ブログ記事を直接そのまま asciidoctor が解釈できて特にいい感じですね。
このへん Hugo は下手くそなのであまりおすすめできません。(その辺の話はこの記事にまとめました)
今気づいたんですが、コメントへの返信がメールで通知されるのも嬉しいですね
b325e88
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Hello World
b325e88
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
でかめ
b325e88
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
android, vivaldiからテスト
b325e88
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@sizumita めんしょんてすと
b325e88
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
なおった?
https://user-images.githubusercontent.com/33555487/119999184-69acb980-c00c-11eb-9468-f2863e00464a.mp4
b325e88
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
#5, #6 の問題を #7 で修正しました!
動作確認を手伝ってくれた @peacock0803sz に感謝 🙏
b325e88
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
試しに来ました。凄いです。
そういえばpythonjpに貼られたリンクだとtechが抜けてて404になってました
b325e88
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@Khiroka ありがとうございます!
c9ffc09 で SEO 対策と一緒に permalink を変更したのですが,それで以前の記事のリンクが切れてしまいました.
Jekyll の側では以前のリンクを有効にすることはできないっぽいんですよね.Netlify の側でリダイレクトを設定して対応しようかな……
追記: ff0e6a6 で対応しました
b325e88
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
これすごいですね、、、
僕もこれを使いたくなってきました、、、