HTMLやCSSやJavaScriptなどのコードをかっこよく魅せるために使用できる無料ツールのまとめ
Post on:2020年9月2日
sponsors
HTMLやCSSやJavaScriptなどのコードをかっこよく魅力的に見せるために使用できるツールを紹介します。
プレゼンなどでコードを人に見せる時をはじめ、TwitterやFacebookやInstagram用にコードの画像を最適化して見せることもできます。
6 Awesome Ways To Present Your Code 🔥
by Niharika Singh ⛓
下記は各ポイントを意訳したものです。
※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。
はじめに
Web制作者はいつか、コードを発表する時がくるかもしれません。プレゼン、ツイート、ブログ、あるいはスニペットを人に見せる時です。
あなたのコードを素敵に見せるために使用できるツールを詳しく見てましょう🔥
Carbon
Carbonはソースコードの美しい画像を簡単に作成でき、共有もできます。使用方法は簡単で、コードを直接入力するか、ファイルをドロップして作成できます。
また、GitHubと連携させることも可能です。
Codeimg.io
Codeimg.ioは私の個人的なお気に入りです🧡
Codeimg.ioの良い点は、既存のソーシャルメディアのテンプレートがあることです。そのため、画像のサイズを心配する必要は一切ありません。テンプレートには、Twitter, Facebook, Instagramで使用されるさまざまなサイズが用意されています。
機能面ではCarbonと比較すると、Codeimg.ioには多くのオプションが用意されています。WindowsとmacOSのUI、タイトルの有無、ボタンの有無、行番号の有無など、簡単に設定できます。
Pastie
ミニマリズムが好きで、スクリーンショットではなくリンクとしてコードを共有したい場合は、Pastieが最適です。
同僚や友達とコードを共有するのに適しており、Pastieで生成されたリンクは24時間有効です。
注意: PastieはHTTPSではなくHTTPを使用しています。これは、暗号化が欠如しており、安全ではないことを意味します。
Rust Playground
Rust派の方にはRust Playgroundがお勧めです。
Rustコンパイラへのブラウザインターフェイスを使って、言語の実験をしてみましょう。また、Pastieのようにスニペットリンクを共有する機能もあります。
Silicon
Siliconは、Rust言語で実装されたCarbonです。
Siliconで克服されたCarbonの問題点は、下記の通りです。
- インターネットとブラウザがないと動作しません。
- シェルではうまく機能しません（carbon-now-cliはありますが、特にネットワークがそれほど良くない場合、うまく機能しません）。
下記のコマンドで生成します。
|
1 |
$ silicon main.rs -o main.png |
Polacode
エディタにVS Codeを使用しているなら、Polacodeがお勧めです。VSCodeからコードの美しいスクリーンショットを簡単に撮影できる機能拡張です。
最後に、ここで紹介した6つのツールの最も優れている点は、すべて無料で使用できることです👍
sponsors
