Qiitaのユーザが技術用語の説明を書いたら、分かりやすいプログラミング辞書ができるのではないか？

作ったもの（Qiipedia）

実現したいこと(動機) ＝投稿者に負担をかけないQiitaの閲覧性向上

はじめての技術を学ぶときに、 wikipediaの内容が1%も分からずに、Qiitaに助けられる ことが多い。

つまり、Qiitaには既に有用な技術用語の解説記事が多数存在する。

しかし、Qiitaでの解説記事の検索は、外部のgoogle頼りで辿り着くしかない。

一方で、技術情報の技術情報をアウトプットはハードルが高いため、解説を意識すると記事のアウトプットが少なくなってしまう懸念がある。

Qiipediaというプログラミング辞書の実現は、投稿者にとってQiitaの記事投稿に極力近い方法が望ましい。

Qiipediaで実現できること

-　投稿者は通常の記事投稿とまったく同じ操作でQiipediaの執筆ができる
-　対象についての説明記事を「ストック数」という評価順で取得できる
-　編集リクエスト機能によって、Qiitaユーザ間でタイポ修正や加筆が可能

Qiipediaの使い方

Qiipediaへの寄稿の仕方

Qiipediaへの寄稿は簡単です。

あなたが作成した記事の説明対象のタグを付与し、合わせてタグ説明タグを付与して投稿して下さい。

Qiipediaの参照の仕方

TOPページ

以下のUserScriptを設定すると、先頭の画像のようなTOPページになります。
~~ただ、Qiipediaのヘッダを付けるだけ~~

UserScriptの内容を確認する。

Qiipedia.js

// ==UserScript==
// @name         Qiipedia
// @namespace    http://tampermonkey.net/
// @description  Qiitaのタグ説明
// @author       j5c8k6m8
// @match        https://qiita.com/tags/%e3%82%bf%e3%82%b0%e8%aa%ac%e6%98%8e
// ==/UserScript==
const tagShow = document.querySelector('div.p-tagShow');
console.log(tagShow)
tagShow.insertAdjacentHTML(
    'afterbegin',
    '<div class="px-2 px-1@s pt-4 pt-1@s" style="max-width: 1100px; margin: 0 auto;">' +
      '<div class="px-4 py-2" style="background-color:#fff; border: solid 1px #55c500; border-radius :4px;">' +
        '<p>' +
          '<span class="mr-2" style="font-size: 28px; color:#3f9200">Qiipedia</span><span style="font-size: 18px;">へようこそ</span></p>' +
        '<p class="pt-1">' +
          '<span class="ml-1">Qiipediaは</span>' +
          '<span class="ml-1"><a href="https://qiita.com/j5c8k6m8/items/6214d551900aa5b3a8ef" style="color:#3f9200">誰でも編集できる</a></span>' +
          '<span class="ml-1">エンジニアのための</span>' +
          '<span class="ml-1">プログラミング辞書です</span>' +
        '</p>' +
      '</div>' +
    '</div>'
);
const tagShowContainer = document.querySelector('div.p-tagShow_container');
tagShowContainer.classList.remove("pt-4")
tagShowContainer.classList.add("pt-3")

検索ページ

上記の検索ページを開き、検索したいタグ名部分を調べたい単語に変更して検索ボタンを押して下さい。

ストック数で並び替えを行いたい場合は、デフォルトの「関連順」を「ストック数順」に変更して再検索してください。

もっと詳しい使い方

より詳しい情報はこちらのページを参照ください。

【爆速】【無料】【簡単】を実現するために使ったもの

Qiitaのタグ機能
Qiitaの検索機能
その他Qiitaの機能
UserScript(TOPページのヘッダ用)

~~ほぼ意味のない~~ヘッダの付与以外、全てQiitaの機能を使用したことで、UserScript作成のみ(約1時間)という【爆速】【無料】【簡単】な開発を実現しました。
~~これが、本当のサーバレス開発~~

tl;dr

Qiita夏祭りに乗じて、「タグ説明」タグの使い方を記事にするため、UserScriptを書いた。

さいごに

本記事はポエムですが、(TypeScriptの静的型付けのような)省略可能なQiitaの仕様です。
本仕様を採用した実装が増え、タグ安全なQiitaの実現に可能性を感じています。
賛同いただけた方は「LGTM」するか「タグ説明」記事を書いて、タグ安全なQiitaの実現に協力して下さい。

Qiipediaを爆速で作った物語【無料】【簡単】