Zennで実践するモダンなアウトプット駆動学習スタイル

公開:2021/02/23
更新:2021/02/27
4 min読了の目安(約3800字IDEAアイデア記事

Zennでのアウトプット駆動学習スタイルを構築するため、「最高のZenn執筆環境を作る」という釣りタイトルでScrapを書いていました。

https://twitter.com/Tocyuki/status/1364115198471114755

執筆環境構築が一段落したのでArticles化していきます。

アウトプット駆動学習とは

そもそもアウトプット駆動学習とはなにかについて説明します。
このアウトプット駆動学習という言葉を初めて目にしたのはアウトプット芸人として有名な@kakakakakkuさんの下記ブログとスライド資料でした。
(もう3年以上も前になるのか...)

https://kakakakakku.hatenablog.com/entry/2017/12/22/173455

アウトプット駆動学習という言葉自体カックさんが作ったのかどうかはわからないんですが要するにアウトプットを目的に学習し、必ずアウトプットすることで学習内容の定着率を高める、という学習方法です。

情報収集&学習中はTwitterでその内容をつぶやき細かくアウトプットしながら最終的にQiitaやブログで記事にするというのが従来のアウトプット駆動学習のスタイルでした。
自分もそのスタイルでやっていましたがZennというサービスが誕生し、よりモダンで快適なアウトプット駆動学習が可能になりました。

よりモダンで快適なアウトプット駆動学習スタイル

今までのアウトプット学習スタイルでは個人的に以下において課題があると感じていました。

  1. Twitterでつぶやいた内容の振り返り
  2. ブログやQiitaの執筆環境のUX
  3. 記事コンテンツの資産化(≒Git管理したい)

Twitterでつぶやくのは手軽なんですが、文字数の制限や記述できる表現に限界があります。
さらにほかのつぶやきなども混じると「Twitterで何をつぶやいたっけなぁ」というのが振り返りしづらいし見にくいという問題がありました。

しかし、ZennのScrapsであればそのあたりの課題がすべて解消できます。

執筆環境のUXも普段開発で使っているIDE等のエディタで執筆できるためとても快適に記事の執筆ができます。

仮にQiitaや使っているブログサービスが閉鎖してしまった場合、記事のエクスポートをしたりと色々面倒な感じがします。
しかしZennであればはじめからGitHubでバージョン管理をしながら記事を投下していけるし、Booksで直接マネタイズすることも可能になるしで もうほんと最高じゃないですかなんですかこれは。

記事執筆で草生やせるところもGit管理による地味に嬉しいポイントですね〜。
個人的にはScrapsがGitHub連携対象外となっているのもUX的にとても良いなぁと感じています。

Zennの執筆環境

本題のZennの執筆環境についてですが、textlintで記述内容をチェックできるようにしたぐらいで、何かすごく工夫した点というのはないです。
実行環境としては個人的にはいつものパターンであるDocker + Makefileで構築しました。

エディタについてはとりあえずいつも使っているIntellij IDEAで執筆しているんですが、とくに特別なことはしていないので改良の余地はありそうです。
しかしこういう記事みるとVScode良いなと感じるな。

https://note.com/ryryo/n/n0ca42c3901d0
Dockerfile
FROM node:lts-alpine3.10

WORKDIR /contents
ENV LC_ALL=ja_JP.UTF-8

RUN apk update \
 && npm install -g npm \
 && npm init --yes \
 && npm install -g zenn-cli@latest \
 && npm install -g textlint \
 && npm install -g textlint-rule-preset-ja-technical-writing \
 && npm install -g textlint-rule-no-dropping-the-ra \
 && npm install -g textlint-rule-no-mix-dearu-desumasu

ENTRYPOINT ["/usr/local/bin/npx"]
docker-compose.yml
version: "3.8"

services:
  npx:
    build:
      context: .
      dockerfile: Dockerfile
    container_name: zenn
    working_dir: /contents
    volumes:
      - ./:/contents
    ports:
      - "8000:8000"
    command: npx zenn preview
Makefile
.PHONY: $(shell egrep -o ^[a-zA-Z_-]+: $(MAKEFILE_LIST) | sed 's/://')

help: ## Print this help
	@echo "Usage: make {build|init|preview|article|book|textlint}"
	@echo
	@echo 'Targets:'
	@awk 'BEGIN {FS = ":.*?## "} /^[a-zA-Z_-]+:.*?## / {printf "\033[36m%-30s\033[0m %s\n", $$1, $$2}' $(MAKEFILE_LIST)

build: ## exec docker-compose build
	@docker-compose build

init: build ## exec docker-compose build & npx zenn init
	@docker-compose run --rm npx zenn init

preview: ## exec npx zenn preview
	@docker-compose up

article: ## exec npx zenn new:article
	@docker-compose run --rm npx zenn new:article

book: ## exec npx zenn new:book
	@docker-compose run --rm npx zenn new:book
	
textlint: ## exec npx textlint articles/*.md
	@docker-compose run --rm npx textlint articles/*.md

執筆の流れ

makeコマンドを使い、以下の流れで執筆をします。

初回のみmake initdocker-compose buildnpx zenn initを実施する

  1. Scrapsで調査した内容や学習の途中経過を投稿
  2. Scrapsへの投稿が一段落したらmake articleでArticlesを作成
  3. make previewで内容を確認しながら好きなエディタで記事を執筆
  4. make textlintで指摘箇所を修正
  5. 記事執筆が完了したらGitHubへプッシュし、記事を公開
  6. (1)〜(5)のプロセスを繰り返し、学習スコープの体系的な記事が書けるようになったらmake bookでBooksを作成
  7. Booksが売れて商業本作成のお誘いがくる

おわりに

今回試しに、上記執筆の流れを試してみましたが、めちゃめちゃ最高の執筆体験でした。
学習初期の雑多なアウトプットからまとめ記事の作成、体系的な書籍作成によるマネタイズまで網羅しており、アウトプット駆動学習はZennしかないじゃないですかという感想です。

あと個人的にZennのデザインすごく良いなーと感じているので記載した記事がきれいに表示されているとテンション上がりますね〜。

そして正直アウトプット駆動学習とか全然できていないのでこれを機に少しでも頑張ろうと思えるモチベーションの向上にも繋がりました。
今後はCI導入やエディタの最適化も行っていき、執筆体験をより高めていきます。

個人的には今後Organizationsや独自ドメイン対応してくれたら最高だなぁという感じです。

おしまい。