Tech Magnetではスニペットを投稿することができます。
このページではスニペットの使い方について説明します。
スニペット投稿方法
入力画面への行き方
-
画面上部のアイコンをクリック
-
開いたサイドバー内のスニペット管理をクリック
-
スニペット管理画面内の新規登録をクリック
-
入力画面が表示されます。
スニペットの入力
入力画面で投稿したいスニペット情報を入力していきます。
入力項目は大まかに３つに分かれています。
- 概要情報入力エリア（上記画像の緑色部分）
- スニペット入力エリア（赤色部分）
- 処理結果入力エリア（青色部分）
1. 概要情報入力エリアについて
スニペットの概要を入力します。
| 項目 | 必須 |
|---|---|
| タイトル | ◯ |
| 説明文 |
タイトルのみ必須で、説明文は任意入力の項目になります。
2. スニペット入力エリアについて
投稿したいスニペットを入力します。（緑色部分）
シンタックスハイライトを適用させたい場合は「言語選択」（青色部分）からハイライト表示させたい言語を選択してください。
シンタックスハイライトをサポートしている言語は以下の通りです。
- C
- CSS
- C++
- C#
- Docker
- Golang
- Haskell
- HTML
- Java
- Javascript
- JSON
- Kotlin
- Less
- Perl
- PHP
- Python
- R
- Ruby
- Rust
- Sass
- Scala
- Shell
- SQL
- Swift
- Typescript
- Yaml
ファイル名を指定することもできます。（赤色部分）
スニペット入力エリアの各入力項目の必須項目は以下のとおりです。
| 項目 | 必須 |
|---|---|
| スニペット | ◯ |
| 言語選択 | |
| ファイル名 |
3. 処理結果入力エリア
この処理結果入力エリアは、スニペットを実行したときの処理結果を記録しておきたい場合に使います。
例えば、Reactのボタンコンポーネントのスニペットを投稿した場合に、コード以外に、このコンポーネントがどんな見た目をしているかも分かれば便利です。
そんな場合には、この処理結果入力エリアにコンポーネントのスクショを貼ると次回以降スニペットを確認するときに見た目も一緒に確認できます。
処理結果入力エリアは３つのモードがあり、それぞれ「非表示」「コンソール」「画像」になります。
非表示
処理結果を保存する必要がない場合に非表示を選択します。この場合は、特に何も表示しません。
コンソール
画像ではなく、テキスト形式で処理結果を入力したい場合はコンソールを選択します。
例えば、シェルスクリプトのスニペットを実行した後のコンソールへの出力結果を保存したい場合などに選択します。
画像
処理結果を画像として保存したい場合に選択します。
画像アップロードはドラッグでも可能です。
投稿サンプル
投稿したスニペットがどのように表示されるのサンプルになります。
入力画面
表示ページ
