初書:2021/04/28
mac : 11.2.3
vscode : 1.55.1
qiita api : v2
curl 7.64.1
前書き
QiitaにはAPIがある事は知っていたが、これを利用して記事投稿などが出来るという発想に至る事が最近(今更)起きたので、
いつもMarkdownをとりあえずvscodeで書いて全コピペしていたのを、拡張機能だけで解決しようと思い作成してみる。
ちなみに、この記事では拡張機能の開発面はあまり触れずに、必要そうな記録を残す。
拡張機能面は、ほぼ同時公開の【vscode】改めてtypescriptで拡張機能を開発してみるを参照
拡張機能紹介
今回作成したものがこちら→vscode_qiitaapi - Visual Studio Marketplace
2021/05/12現在、存在している機能はqiitaへの投稿だけのシンプルなもの。
投稿方法
投稿したいファイルを開き、コマンドパレット(com + shift + P)から「qiitaに投稿する」を選択するだけ。
その後、記事タイトル、投稿範囲、タグなどを指定すれば投稿が出来る。
投稿すると、以下のような文章がファイルの先頭に記述されるが、これを使って投稿情報を管理している。
//********************
* ID : xxxxxxxxxxxxxxxxxxxx
* title : 記事タイトル
* private : true
* istweet : false
* tags : タグ1, タグ2
//********************
この管理情報(説明では「qiita テンプレート」と表記)はjsonにするか迷ったが、記事から切り取る良い方法が思いつかなかったために自作。
ちなみにこれは「qiita テンプレートを付与する」を実行することで投稿前に記述しておくことも出来る。(IDが空白かどうかで新規投稿/投稿更新を判断しているため)
開発時メモ
これ以降は開発時に新しく知ったこととかのメモ。
qiita apiを確認する
qiitaのapiは下の方の黒枠にも「API」と書いてあるページから飛ぶ事ができる。
ここに色々なAPIが記述されている。
JSON Schema を利用してみる
少し読んでみると、Qiita API v2にはJSON Schemaなるものが定義されているらしい。
JSON Schemaって何?というのは詳しい説明は他の方に任せるとして、ざっくりいうと仕様書をそのままJSONオブジェクトで書いたもの。
それで今回Typescriptを使用しているわけだが、せっかくこういうものがあるならapiで受け取ったJSONにも型推測したいよね、と。
参考サイト:JSON-SchemaからTypeScriptの型定義を生成する - Qiita
json-schema-to-typeのインストール
何事もまずはインストールから。
% npm install --save json-schema-to-typescript
インストールが終われば次はこちら
% curl https://qiita.com/api/v2/schema | npx json2ts > qiita-types.d.ts
簡単に説明しておくと、https://qiita.com/api/v2/schema
からデータを読み込んで、qiita-types.d.ts
ファイルに変換したものを出力
これで完成。あとはqiita-types.d.ts
をimportなりrequireなりするだけ。
node.jsからシェルを実行する
今回はpandocを使ってみたかったので、node.jsからシェルを実行してみる
なお、nodejs pandoc
と検索すると、node-pandoc-promise - npmがヒットしたのだが、typescript型変換非対応&うまくいかなかったので候補から除外。
ということで使うのはchild_process
。デフォルト機能なのでインストール不要。
使い方はとてもシンプルで、
import {execSync, exec} from "child_process";
const data = execSync(`cat index.ts`);
console.log(data.toString());
という風に、exec
もしくはexecSync
を呼び出すことで使用できる。
2つの違いは同期か非同期か。ただパッと使ってみた感じawait/promise使えなさそう。
またcat index.ts | pandoc -f html -t markdown
のような感じで、cat index.ts
の部分をTSの変数で渡したい場合は、
import {execSync, exec} from "child_process";
str = "<h1>htmlが~~~~</h1>";
const data = execSync(`pandoc -f html -t markdown`, {input : str});
console.log(data.toString());
という風に、第二引数にoptionで渡すことができる。
Node.js|シェルコマンドを実行する方法(child_process) - わくわくBank
終わりに
この記事もこの拡張機能を使って投稿しているので、便利ではある。
あとはどこまで機能を追加するか……。
もし不具合とか、何か気付いたこととかがあれば、下のコメントか、marketplaceのQAに投げていただけると助かります。