👨‍💻

テキストエディタを使ってMarkdownでzennの記事を書いてみました!

2024/08/07に公開

こんにちは、ミヤビです(^^)
プログラミングの勉強を始めてからMarkdownで記事を書いたりREADEMEなど書くことを覚えました。

まだまだ不慣れなことも多いですがMarkdownで文字を書くと心地よいですよね。

zennの記事もMarkdownで書いていますが、今回はテキストエディタを使って書いてみましたので、そのやり方を共有しつつ記事を公開してみます。

テキストエディタを使ってMarkdownで記事を書いてみた

使っているテキストエディタはVisual Studio Codeです。
いわゆるVS Codeですね。
使っている人は多いんじゃないでしょうか。

やり方に関してはこちらの方の記事を参考にしました。
https://zenn.dev/yasuna/articles/56c949ec54d2f6
こちらの方の記事自体はMarkdownの良さ、生成AIでのスライド作成などに触れられていますね。
この記事をきっかけに自分もやってみようと思いました。

Gitリポジトリと連携させる

Zennの公式の記事が優秀すぎるので、これらを複数見てGitリポジトリと連携させました。
https://zenn.dev/zenn/articles/connect-to-github
https://zenn.dev/zenn/articles/zenn-cli-guide

こちらの記事を見ればおそらくそんなにハードルは高くない印象です。
やることは要するにこんな感じです。

プログラミング学習始めて約10ヶ月、実務経験がないのでGitの使い方で戸惑うことも多いですが何とか連携して記事を書くことができました。

僕は日々のタスクをNotionで管理していますが、Gitのコントリビュージョン、いわゆる草を生やすのが何か好きなのででこのやり方は気に入っています。

実際のVS Codeの画面はこんな感じです。

title: "テキストエディタを使ってMarkdownでzennの記事を書いてみました!"
emoji: "📚"
type: "tech" # tech: 技術記事 / idea: アイデア
topics: [Markdown, zenn, ブログ, テキストエディタ]
published: false

GitHub DesktopからPushすればデプロイされて下書きが更新されます。

ターミナルで該当のディレクトリに移動して、下記のコマンドを実行すればブラウザでプレビューを見ながら記事を書くこともできます。

npx zenn preview

Zenn独自の表現方法も使えそうです。

これでブログ記事を書く生産性が上がる予感!

ちなみに僕はブログは複数書いていて、WordPressやはてなブログなども使っていますがZennのMaekdownでの書き方が個人的には気に入っています。

今回はテキストエディタを使って、Markdownで記事を書く方法について書いてみました。

記事の更新頻度が少ないですが役立つ情報や学習での気付きをまた書いていきます。

より良い人生にしていきましょう♪

Discussion