Zenn
🗽

職業プログラマでない私がeasy-notion-blogをカスタムして楽しんでいるうちにContributorになれちゃった

2022/05/15に公開
Notion
プログラミング学習
非エンジニア
Notion Blog
contoributor
idea

Notionを使い込めば込むほど「Notionで〇〇できたらいいのに」っていう野望。

私の場合は「Notionでブログができたらいいのに」でした。

easy-notion-blogに出会った経緯

「Notionでブログができたらいいのに」

そんなことを思うようになったのはNotionを使い始めて半年を過ぎた頃の2021/12/01。

当時ネットで『Notion ブログ』で検索すると.......
有料で手軽に始められるSuperやWraptasがありました。

でも.....

「プログラミングの勉強も兼ねて取り組みたい！！」

という願望があり、GitHubのリポジトリで探してみました。

すると、３つのリポジトリを発見。

Forkさせていただくことにしました。

英語を読めない非エンジニアには辛かった

まずnotion-blogのデプロイに苦戦しました(´ﾟдﾟ｀)

よくよく見てみると非公式APIなようで、知識のない私は原因究明困難の沼にハマってしまい断念。

公式APIで作られているnotion-blog-nextjsに望みをかけデプロイに挑戦してたものの.....
デプロイ後にどういった使い方をしたらいいのかで迷子になりました。

使い方ブログがREADMEに掲載されているのですが、
英語.....英語.....で涙目になり断念。

https://samuelkraft.com/blog/building-a-notion-blog-with-public-api

せめて読みやすい英語だったら.....

ということでreact-notion-xに挑戦。

READMEに細かく手順があり、
表や絵文字もあるのでなんとか読み進めながらset upを済ませることが出来ました。

Notionのデザインと類似しているデザインも気に入りました。

が、

「これをこうしたい.....」

と思ってカスタムしようにもできない。

コードが高度すぎて非エンジニアの私は何を意味した記述なのかを解読することができませんでした。
何を消して、何を追加すればいいのかが全く検討も付かない....といった状態です。

【Notionでブログをする】＋【プログラミングの勉強もしたい】

日本語READMEを用意したeasy-notion-blog

半ば諦めていた時、日本の方でNotionをブログにするリポジトリを公開している記事を発見しました。

https://zenn.dev/otoyo/articles/38e4092927f7c1

Notion Blog が簡単に始められる easy-notion-blog の紹介

やっぱ日本語ってありがたいです。

リポジトリの公開だけではなく、開発者の個人ブログにもカスタマイズに関する記事が投稿されている部分にすごく惹かれました。

easy-notion-blogのリポジトリへ行くと、丁寧に説明されたクイックスタートがあり感動。

こんなに充実したREADMEは珍しいなと思い「このリポジトリを信じて進めよう！」と心に決めました。

https://github.com/otoyo/easy-notion-blog/blob/main/README.ja.md#クイックスタート
easy-notion-blog README #クイックスタート

Notion上に用意するデータベースの列名に対する説明もあり、何のための列なのかといった部分も理解でき助かりました。

https://github.com/otoyo/easy-notion-blog/blob/main/README.ja.md#データベースプロパティ
easy-notion-blog README #データベースプロパティ

Twitterを通してeasy-notion-blogが楽しさ倍増

開発者(otoyo)さんの進捗状況を追うべくTwitterをフォローさせていただきました。

2021/12月時点では公式API機能があまり充実しておらず、

「いつになったら公式APIに追加されるんだろう....」
「easy-notion-blogに追加されたらすぐに取り込みたい！！」

といった願望からフォローは必須でした。

他愛のない私の格闘ツイートに開発者(otoyo)さんからイイネが付くようになり、
気づけばTwitter上でやりとりさせていただくようになっていました。

困っているとコメントくださったり、
解決するために必要な公式ドキュメントのリンクを送ってくださったりととっても親切にしていただきました。

Twitterを通して【孤独に格闘する】から開放されました。

実際に会ったことも、話したこともないのにそばで見守ってくれる感じがして

「あれもやってみよう」
「これもやってみたい！！」

といった挑戦をする基盤になりました。

(大丈夫っていう安心感)

Twitterコミュニティから始まる世界

2022/02/26にできたeasy-notion-blogのコミュニティ。

easy-notion-blogコミュニティ

同じリポジトリを使ってる仲間や興味のある方が参加しています。

「同じリポジトリを使っている」という共通点で不思議な愛着が生まれ、

ブログのデザインはもちろんのこと、
投稿される記事の内容も興味深く拝見させていただいています。

個性って素敵だなと思います。

少しずつ増えてきたメンバーですが、
このゆったり感がたまらなく好きです。

コミュニティから派生してフォローするようになったり、
他の活動ツイートに反応し合ったりと

プログラミングの勉強を続けるモチベーションにも繋げられています。

▼ 実はこれ、Twitterコミュニティができる前のツイートですが、

妄想から現実になってきて最近大興奮ですwww

easy-notion-blogで学んだこと

Notionで勉強ノートを取り、
その勉強ノートをもとに、Notionでブログとして投稿する....。

ノートが教科書になっていくにつれて理解が深まりました。
https://herohoro.com/blog/2months_kpt-review
easy-notio-blogを2ヶ月使い続けて分かった３つのメリット_体験・効率・学習環境

ブログの見た目をカスタマイズすることから始まり、
今では公式APIリファレンスを解読しながら取り入れたい情報を簡単に表示させるまでになりました。

プログラミングの学習経験としては、HTML・CSS・GAS・Pythonくらい。

実務経験はゼロなのでほぼ初心者状態から始まったeasy-notion-blogのカスタマイズですが、

  • Next.js
  • React
  • JavaScript

自分のブログを改造しながら、失敗や成功を繰り返すことで力が付きました。

最近では「もっとeasy-notion-blogのことを知りたい！」と思い、
Next.jsセットアップ画面から公式APIリファレンスを参照してシンプルなeasy-notion-blogを自作する....といった演習をしています。(私のブログでは「Blog Learn」と称し、連載中です)

公式APIリファレンスを読み解けるようになってから、
easy-notion-blogの微々たるバグを自分で修正できるようになりました。

不思議と何が不要で、何が必要なのかが分かるようになったんです。。。

その結果、

本家へPR3件させていただき、

ありがたいことに採用してくださいました(^^)

大好きなeasy-notion-blogのContributorになれたのはすごく嬉しかったです。

まとめ

結局easy-notion-blogに出会ったことで、

プログラミングの学習を無料でできて学んだことを記事にして公開する....といったいい流れを作ることができました。

『作ってみたい！』

という思いを実現するためにどんな知識が必要なのか、
公式リファレンスのどこを調べれば手がかりを見つけられるのか......

日本語でやりとりができる環境を整えてくれた開発者(otoyo)さんのおかげで
自走できるようになってきました。

公式リファレンスと格闘していくうちに
あんなにチンプンカンプンだった英語の文章を読めるまでになりました。

私の中で大進歩だと思います。

英語を読めるようになったことで、
TwitterのNotionに関する情報もキャッチすることができたり、
Notion Certifiedを受けるようになったりと
Notionを探求できる切り口になりました。

そしてNotion以外の世界も探求してみたい.......。

ちょうどのレベル。
ちょうどの量。

背伸びをしすぎると挫折してしまうことでも
「ちょうど」に出会えたことで新たな世界を見つけられることができました。

普段やり取りする機会なんて無いはずのリポジトリの開発者(otoyo)さんとのやり取り。
それを可能にしたTwitter。

私は幸せものだなと思います。

easy-notion-blogに関する記事

私のブログではほぼ全てeasy-notion-blogに関する情報を投稿しています。

この他にも関心のあるタグがありましたら是非是非覗いてみてください(^^)

充実してきたeasy-notion-blogの説明

私がForkした頃からだいぶ充実しました。
wikiにはcommitの所作まで説明されています。

updateの際に必要なコマンドについても記載があり非エンジニアにはありがたい部分です。

easy-notion-blog wiki

普段使わないとイメージ付きにくいブランチについても開発者(otoyoさん)が個人ブログで解説した記事もあるのでGitHubの学習にもなります。
https://alpacat.com/blog/how-to-import-commits

開発者(otoyo)さんがユーザーの声をもとに追加していってくださいました。
本当に感謝ですm(_ _)m

これからも
ユーザーをワクワクさせる仕掛けを作り続けるotoyoさんのeasy-notion-blogは目を離せません(´ﾟдﾟ｀)

最後にボソっと....

つい先日４つ目のPRをしてみたのですが....

反省。

今後　「月に１回はPRする!!!」 を目標に取り組みたいと思います。

Discussion