技術 - テキストの記事一覧
Muscular !!! - 筋肉大好きな人のためのcowsay
最近、筋肉.ktや筋肉もくもく会など、筋トレやエクササイズと勉強会を組み合わせた異色の（？）コミュニティが人気です。IT系はとかく貧弱だと思われがちですが、世界最高レベルの握力の持ち主はIT業界の方
SlidesCodeHighlighter - ソースコードをスライドに貼り付ける際に
スライドに綺麗にシンタックスハイライトされたコードを使いたいと思ったことはないでしょうか。コードを画像にするのは格好悪いですし、普段自分がエディタで使っているハイライトではないものを使いたい場合はとても大変です。そこで使ってみたいのがSlidesCodeHighlighterです。ソースコードのハイライトに特化したソフ...
speak.js - eSpeakからポーティングしたテキストtoスピーチ
テキストをコンピュータに喋らせる試みはずっと行われてきました。かつてはまさにコンピュータっぽい音声でしたが、今はSiriやAlexaなど、滑らかで人が喋っているような音声で読み上げできるようになっています。今回紹介するspeak.jsはどちらかと言えばコンピュータ音声です。特徴として、JavaScriptだけで実現して...
Unicopedia Plus - ユニコードや絵文字を調べる開発者用ツール
絵文字の登場によってユニコードが幅広く使われるようになりました。合字によって、肌の色を変えたり、年々絵文字の種類が増えています。また、アジア圏の文字では似ていても微妙に違う文字もあります。そんなユニコードの文字をチェックしたり、調べられるのがUnicopedia Plusです。## Unicopedia Plusの使い...
json.pizza - キーボード操作主体のJSON整形サービス
JSONはシステム連携で使われる一方、可読性の高さも特徴となっています。とは言え、改行やインデントをなくした状態ではとても読む気にはなれません。整形が必要です。今回紹介するjson.pizzaはJSONを貼り付けて、素早く整形できるサービスとなっています。## json.pizzaの使い方JSONを貼り付けて、Ctrl...
Silicon - ソースコードを綺麗な画像に
スライドの中でソースコードを取り扱いたいと思うことはよくあります。コードハイライトに対応していないと、見づらいものになってしまうでしょう。そのため、プログラミングエディタのコードをスクリーンショットで画像化したりしているかも知れません。そんな面倒はせずにSiliconを使えばコードを綺麗に画像化できます。## Sili...
org-web - React製のorg-mode
org-modeと言えば、Emacsユーザにとっては慣れ親しんだメモ環境です。個人的にも長く使ってきましたが、キーバインドなども複雑で、当時はまだしも今はもう使い方も忘れてしまっています。そんなorg-modeをWebベースで復活させたのがorg-webです。マウス操作も含めると使い勝手が良さそうです。## org-w...
Argdown - 文章構造を可視化する記法
文章を構造化して書くのは難しいものです。特に長文になったりすると全体像を一目で把握するのが難しくなり、読み飛ばしてしまったりすれば意味を取り違えてしまうことになります。そこで使ってみたいのがArgdownです。文章構造を解析し、ビジュアル化してくれるソフトウェアです。## Argdownの使い方例です。左側が文章、右側...
copy-code-block - プログラミングコードをクリップボードにコピー
ブログなどでコードを記載しているサイトは多いです。その表示方法も様々で、行番号があるもの、ハイライトが付いているものなどがあります。そのコードをコピーしても余計な行番号が付いてきたりして、ストレスと感じたりします。そこで使ってみたいのがcopy-code-blockです。自由度の高くコードのコピーが可能です。## co...
comntr - 任意のサイトにコメント
あるサイトに書かれている内容について皆とディスカッションしたいと思った時、多くの場合はソーシャルサービスやコミュニティサイト、チャットなどを使います。コンテンツとディスカッションは別な場所に分かれているのが普通です。今回紹介するcomntrはその逆で、任意のURLに対してコメントを書けるサービスとなっています。そしてH...
Rune Search - 山羊を操作して文字を探したり戦ったり
たくさんの文字が並んだ中から目的の文字を探すゲームがあります。上下左右、斜めの中から単語を探していきます。意外と集中できて、時間つぶしにトライしている人も多いのではないでしょうか。それと似ているようで似ていない、そんなゲームがRune Searchです。## Rune Searchの使い方ゲームのチュートリアル。!
ojichatrix - ojichatをマトリックス風に流す
おっさん風のチャットテキストを生成するojichatは世の中のおっさんを震撼させました。あの自動で生成された文字をみて、自分のことだと思った人も多いのではないでしょうか。または自分はあんな文字は書かないと思った人もいるでしょうが、否定する時点でおっさんなのは間違いないでしょう。そんなojichatがさらに恐ろしい代物に...
Olivia - チャットボット用AI
汎用的なAI（人工知能）を作り上げるのは相当困難で、まだまだ実現は難しいでしょう。一定の縛りがあってこそ、機械学習やAIといった分野が活きてきます。チャットボットのその一つのカテゴリとして知られています。今回紹介するOliviaは対話側のAIになります。日本語は使えませんが、対話ができます。## Oliviaの使い方デ...
textFit - 枠に合わせてテキストを最大表示
Webの表現力は高く、ウィンドウの幅によってテキストの行数が変わってしまったりします。その結果、デザイナーの意図した表示にならないことも多く、かといって固定サイズにすると閲覧者にストレスを与えることにもなりかねません。そこで使ってみたいのがtextFitです。テキストを枠の中に収まる形で最適化してくれるライブラリです。...
Makepad - アニメーションが付いたIDE
AtomやVisual Studio CodeがJavaScriptなどを使ってエディタを実現していることもあり、Webブラウザベースのエディタも現実的になっています。コードをローカルに保存する必要もなく、コンパイルや実行はサーバ上で簡単にでき、メリットも数多くあります。そんなWebブラウザ向けのエディタとして紹介した...
ojichat - おっさんっぽいメッセージを生成
筆者自身が40歳になり、すっかりおっさん世代に入っているのですが、それ故に精神や態度、肉体的におっさんな人たちは嫌いです。痛々しい若さアピールは嫌ですが、下の世代に嫌がられない振る舞いは大事ではないでしょうか。そんな私の嫌いなおっさんを体現してくれるのがojichatです。おっさんがチャットで送信しそうなメッセージを生...
SakubunCSS - 作文用紙風CSS
Web上の文章などは横書きが多いですが、日本語は本来縦書きのために作られています。それだけにWeb上であっても縦書きで文章を公開したいと考えている人は多いでしょう。アラビア語などは右から表示されるのに、日本語にしても横書きのままなのは気になります。そこで使ってみたいのがSakubunCSSです。振り仮名まで含めて日本語...
Docsy - オープンソースな仕組みを取り入れたドキュメントサイトテンプレート
読みやすい開発者ドキュメントはDevRelにおいて大事な要件になります。コンテンツはもちろんですが、サイトとしても読みやすくできていなければなりません。文字サイズやインデックス、コードの可読性などが要素として考えられます。今回はGoogleがメンテナンスしているDocsyを紹介します。DocsyはHugo向けのテンプレ...
Kroki - テキストからドローに変換するWeb APIサーバ
プログラマーは図を書くのが嫌いです（たぶん）。少なくともドローソフトウェアを使って書くのは嫌がるでしょう。メンテナンスしづらいですし、コードと図の乖離が発生しがちです。せめてテキストで書いて、自動的に図にしてくれるものであれば、元のテキストを自動生成する方法が選べたり、バージョン管理で差分が取れるようになります。そんな...
Hanzi Writer - 漢字の書き順をアニメーション表示
漢字は基本的な書き順さえ覚えてしまえば大抵のものには対応できますが、時々複雑なものがあったりします。さらに漢字と言っても日本のものだけでなく、中国語もあります。日本人でも中国の漢字の書き順はぱっと見ただけでは分からないかも知れません。そこで使ってみたいのがHanzi Writerです。中国語（日本の漢字も）の書き順を表...