LoginSignup
21
16

More than 5 years have passed since last update.

VS Code 1.17 の新機能のリリースノートをだらだらと眺めてみる

Last updated at Posted at 2017-10-20

Visual Studio Code の バージョン 1.17 がリリースされたので、リリースノートを眺めてみてどんな機能が追加されたのか見てみる。(過去のやつはこちら。1.16 / 1.15)

しっかし、毎月毎月すっげーボリュームだなぁ・・・

ワークベンチ関連

macOSのタッチバーのサポート

  • macOSのタッチバーにアクションを表示する機能が追加された。
  • 拡張機能からタッチバー機能を扱えるようになった。

macOSネイティブウィンドウタブのサポート

  • "window.nativeTabs":trueの設定でmacOS(Sierra)でネイティブウィンドウタブを有効にすることができる。
  • 一番最後のタブの隣に、新しいタブを開く"+"アクションが追加された。
  • ただし、ネイティブタブは現在のところ部分的にしかサポートされていないらしい。

VS Codeのロゴ

OS 安定版 インサイダー版
mac/linux mac-stable-orange.png mac-insiders-green.png
Windows windows-stable-orange.png windows-insiders-green.png
  • VS Codeのロゴのデザインと色が新しくなり、安定版はオレンジ、インサイダー版は緑色になった。
  • ロゴのデザインはWindows版と、mac/linux版とでも異なる(なぜ!?)。
  • OSによってはアプリケーションアイコンがキャッシュされ、以前のロゴが表示されることがある。
    • 確かにWindows10でやってみたら、タスクバーにピン留めしたアイコンが古いまま変わらず、しばらくしたら何かの拍子で更新された。
  • アイコンの変更は最初は違和感があるけど、たまに変更になるのは新鮮な感じがしてよろしげ。

--waitオプションのサポート強化

  • コマンドライン起動時に--waitオプションを指定して起動すると、開いているインスタンスが閉じられるまで待つことができるが、今回、開いているすべてのエディタが閉じられたときに呼び出しプロセスを終了することで、この機能がより強力になった。その結果、すでに開いているインスタンスで--waitを使用できるようになった。

ファイルエンコーディングに関する新機能

  • files.encodingfiles.autoGuessEncodingを言語ごとに設定できるようになった。
  • CP850およびCP865エンコードがサポートされるようになった。

エディタラベルを制御する新しい設定項目

  • 新しい設定項目workbench.editor.labelFormatによって、エディタのラベル(タブのファイル名横のパス表示)の設定ができるようになった。
  • 選択肢は、short(親フォルダ名のみ)、medium(ワークスペース相対)、long(フルパス)、default
  • defaultの場合、同じファイル名のエディタが複数の開かれている場合にのみ、パス情報を表示する。 他のオプションを使用すると、エディタのラベルには常にパス情報が表示される。
  • 同じファイル名を同時に開くのは、たまーにあるなぁ。のでこれはよい。

launch.jsonとtasks.jsonの${workspaceFolder}

  • 新しい置換変数${workspaceFolder}が導入され、launch.jsonまたはtasks.jsonを含むワークスペースフォルダの絶対パスに置き換えられる。 これは今までの${workspaceRoot}と同じ動作になるが、今後導入予定のマルチルートワークスペースを考慮した場合に名前が適切でなくなるため、${workspaceRoot}が非推奨となり代わりに今回の新しい名前の変数が追加された。

クイックオープンでのripgrepの使用

クイックオープン(Ctrl+P)でripgrepが使用されるようになり、ユーザーの入力フィルタを適用する前の、ファイル名の完全なリストを取得するところで使用されている。

エディタ関連

regionの折りたたみ

  • 折りたたみ機能でregionマーカーがサポートされるようになった。マーカーは言語ごとに定義される。
  • 現在、以下の言語でマーカーが定義されている。
    • TypeScript/JavaScript: //#region //#endregion //region //endregion
    • C#: #region #endregion
    • C/C++: #pragma region #pragma endregion
    • F#: //#region //#endregion
    • Powershell: #region #endregion
    • VB: #Region #End Region
  • 各言語には、マーカー用のスニペットも用意されている。'#'をタイプしてからコード補完を呼び出す。
  • このあたりの言語は普段使わないから、regionの折りたたみっていうのを初めて知った。

オフサイド言語での折りたたみ

  • コードブロックのオフサイドルールに従う言語では、空の行は次の折り返し領域に属する。
  • 設定は言語設定で構成され、次の言語で有効になる。
    • Python, Yaml, Pug, Markdown, Clojure, CoffeeScript, F#
  • オフサイドルールの言語使ったこと無いなぁと思ったら、Markdownもそうなのか。

スニペットセレクタ

  • 「スニペットの挿入」コマンドで表示されるスニペット選択のドロップダウンで、スニペットがユーザースニペットと拡張スニペットの2つのグループに表示されるようになった。
  • ユーザー定義のスニペットのほうが上に表示される。

スニペット変換

  • VS Codeスニペットエンジンが変数変換をサポートするようになった。
  • 変換は変数の値を挿入する前に変更することができる。
  • 形式は、変数名/正規表現/フォーマット文字列/オプション
  • これにより例えば、ファイル名からクラス名を取得してクラス定義を生成するスニペットなどを書くことができる。
  • 正規表現が使えるとできることが増えそうな感じがしてよいね!

電球アイコン(コードアクション)の改善

  • 新しいeditor.lightbulb.enabled設定により、エディタでコードアクションを表示するための電球アイコンの表示/非表示を制御できるようになった(デフォルト値はtrue)。
  • コードアクションメニューでは、デフォルトで最初のエントリが選択されるようになった。

履歴ナビゲーションの改善

  • ファイル内あるいはファイルをまたいでエディタの履歴をナビゲートするためのコマンド(メニューの移動-戻る/進む)の微調整が行われた。
  • 履歴に新しいエントリを追加するには、前の選択と次の選択の間に最低10行の距離が必要になった(以前は5行)。
  • イマイチ使い勝手がよく分からず・・・

警告の色

  • 情報と警告波線を区別しやすくするために異なる色を使用できるようになった。
  • 設定のworkbench.colorCustomizationsに、editorWarning.forgroundeditorInfo.foregroundを追加して指定する。

Emmetの設定追加

  • Emmet2.0の環境設定に関して、前回のリリースで追加された設定に加えて、今回以下の設定が追加された。
  • bem.elementSeparator,bem.modifierSeparator,filter.commentBefore,filter.commentTrigger,filter.commentAfter

統合ターミナル関連

新しいレンダリングエンジン

  • 統合ターミナルに、状況に応じて約5〜45倍速くレンダリングする新しいキャンバスベースのレンダリングエンジンが導入された。
  • これにより、入力待ち時間、消費電力が低減され、端末のフレームレートが大幅に向上する。
  • 速いことは良いことだ。
  • が、Windowsで日本語表示をスクロールするとゴミが残ってしまうようになった・・
    • が、1.17.1で直った!

デバッグ関連

デバッグコンソールメッセージでのソース場所表示

  • デバッグコンソールの出力メッセージにオプションで、発生元の位置が右側に表示されるようになった。
  • この発生元位置をクリックすると、エディタでソースファイルが開く。
  • この機能は以下のデバッガでサポートされる。
    • Node.js - inspectorプロトコルのみ
    • 拡張機能ホストのデバッグ
    • Chrome拡張機能のデバッガ
  • さらに多くのデバッグ拡張機能が採用する予定。

Nodeデバッグ関連

WSLサポートへのファーストステップ

  • Node.jsデバッガ(legacyプロトコルのみ)にて、Windows Subsystem for Linux(WSL)上でのNode.jsアプリケーションの起動とデバッグをサポートした。
  • この機能を使用すると、デバッグ構成にuseWSLフラグを追加することで、Windows上のLinuxサブシステムで実行させることができるようになる。
  • このフラグは、WSLでNode.jsランタイムを起動するだけでなく、WSLとWindows間でパスを正しくマップするようにデバッガを構成する。

stdout/stderrへの直接書き込みからの出力表示

  • console.logではなくprocess.stdout.writeを使用して、stdoutストリームに直接書き込む多くのNode.jsロギングライブラリがある。これは高速だが、Nodeのデバッグソケットから送信されるものではないため、新しいinspectorプロトコルでデバッグする場合、これらのメッセージは以前はデバッグコンソールに表示されなかった。
  • 新しい起動設定オプション"outputCapture":"std"は、デバッグアダプタに対し、デバッグコンソールにstdout/stderr出力を表示させるようにする。

タスク関連

  • タスクにマルチフォルダのサポートが追加された。
  • 複数のフォルダを含むワークスペースを作成した場合、タスクバージョン"2.0.0"を使用するすべてのワークスペースフォルダのタスクが収集され、対応するRunコマンドで表示される。
  • 起動設定では、同じワークスペースフォルダからタスクをpreLaunchタスクとして参照することもできる。
  • Gulp,Grunt,Jake,npmのタスク自動検出はマルチルートのワークスペースもサポートするようになった。
  • さらにタスク用のAPIは、異なるワークスペース・フォルダーに対するタスクのサポートをするように拡張された。

言語関連

TypeScript 2.5.3

  • VS CodeにTypeScript 2.5.3が組み込まれた。
  • 今回のアップデートでは、抽出メソッドのリファクタリングを中心にいくつかの重要な修正と改善が行われている。

JavaScript/TypeScriptでのimportパスのクイックサジェスト

  • JavaScriptとTypeScriptは、VS Code1.9以降のimportパスに対してインテリセンスを提供している。
  • ただし、importを入力する際に手動でインテリセンスを起動する必要があるため、この機能については知られていなかった可能性がある。
  • 今回は、importやrequireのパスの入力を開始するとすぐに、モジュールとパスの候補が自動的に表示される。
  • 知られていなかった可能性があるって、ちょっとさみしげ・・

Dark+/Light+テーマでのカラー化の改善

  • 組み込みの配色テーマのDark+/Light+にて、正規表現コンポーネントをより簡単に識別できるように強調表示されるようになった。
  • フォーマット文字列と文字列補完のカラー化もPythonやRubyなどのいくつかの言語で改善された。

メソッド抽出が名前を変更するようになった

  • JavaScript/TypeScriptでのメソッド・関数を抽出するリファクタリングで、抽出されたメソッド・関数の名前が自動的にトリガーされるようになった。
  • ん?どういうこと?

TypeScriptウォッチビルドタスクの自動検出

  • TypeScriptは、通常のビルドタスクとともに、プロジェクト内のtsconfig.jsonファイルの監視タスクを自動的に作成する。

JavaScript/TypeScriptでのインテリセンスでのMarkdownのサポート

  • JavaScriptとTypeScriptでのサジェストとパラメータのヒントがMarkdownコンテンツをレンダリングできるようになった。

JSX言語スコープの改善

  • JSXタグ内のJavaScript式は、JavaScript言語として正しくマークされる。 これにより、ブラケットマッチングやコードコメントなどの基本的な言語機能に関する多くのバグが修正されている。

Markdownコードブロックでの言語サポート

  • Markdownファイルのコードブロックで、それぞれの言語モードが適用されるようになった。
  • 例えばコードコメント(Ctrl+/)を行う際、Javaのコードブロック内であれば//でコメントされ、Pythonのコードブロック内であれば#でコメントされる。
  • 各言語ごとには今までもできていたけど、それを1ファイル内で複数の言語のコードブロックを扱う可能性のあるMarkdownでできるようになったのか・・、すげー!

Markdown参照リンクの検出

  • 参照リンクと定義参照リンクがエディタでリンクとして検出されるようになった。
  • 今までされてなかったのか・・・

CSS言語の改善

  • 組み込みのCSS/LESS/SCSS言語サーバーが更新され、次の機能がサポートされるようになった。
    • @supportsルールのバリデーションと補完
    • メディアクエリ付きの@importのサポート
    • contain他多数のプロパティのサポート
    • R言語の改善
  • 公開されている文法に基づいて構文の強調表示を改善した。
  • 内容と関係ないけど、頭にアットマークが付く文字列は気をつけないとQiitaのメンションになっちゃう・・

ソース管理関連

複数のSCMサポートの改善

  • 複数のアクティブなリポジトリのための新しいソース管理プロバイダセクションがあり、これらはいくつかのSCMプロバイダによって提供される。たとえば、GitリポジトリをTFSワークスペースと並べて使用することができる。
  • このビューでリポジトリを選択すると、その下にハイライト表示される。複数のリポジトリを選択するには、Ctrl+クリックまたはShift+クリックを使用する。それらは分割されたビューの下に表示される。

パフォーマンスの向上

  • ソース管理の拡張APIとUIについては、かなりのパフォーマンスの向上があった。

Git stash コマンド

  • ソース管理ビューの「…」のドロップダウンで、Git stashコマンドが追加された。
  • というか、いつの間にか「…」のドロップダウンからもGitコマンドがいろいろ操作できるようになっていた!

ドキュメント関連

Java言語サポート

  • 新しいJava言語のトピックでは、Javaコード拡張機能パックをインストールして、VS Codeで優れたJavaコードインテリジェンスとデバッグをサポートする方法について説明している。
  • デバッグ実行とかができるようになるとか、結構本格的。すげー。

ヒントとテクニック

  • VS Codeで生産性を高めるためのヒントとコツのトピックが追加された。これには、VS Codeチームの好きな機能やキーボードショートカットが含まれている。

デバッギングのレシピ

  • 現在、様々なデバッグシナリオのレシピに取り組んでおり、これらのガイドを概説し、役に立つブログ記事へのリンクを提供する新しいトピックが追加された。
  • ReactやAngularなどのフレームワークのデバッグ、ElectronやDockerのようなランタイムについて解説されている。

キーボードショートカットのチートシートの更新

  • キーボードショートカットのPDFが更新され、ユーザ設定を開く(Ctrl+,)やキーボードショートカットを開く(Ctrl+K Ctrl+S)などの便利なコマンドのキーバインディングが追加された。
  • Windows用macOS用linux用
  • デザインがきれー。思わず印刷したくなる衝動。

拡張機能開発関連

拡張機能開発者のためのマルチルートガイド

  • すべてのユーザへのマルチルート機能のサポート提供は間近。すべてのVS Codeのコア機能(SCM、設定、デバッグ、タスク、など)と拡張機能(HTML、JS/TS、ESLint、Docker、など)はマルチルートの概念をサポートするようになった。
  • 作成した拡張機能をマルチルートワークスペースに対応させる方法についてのガイドが作成された。
  • 議論されたすべてのAPIは安定しており、現在利用可能であると考えられている。ただし、マルチルートワークスペースはインサイダーリリースでのみ有効。
  • ガイドに加え、新しいAPIを使用するサンプルリポジトリには新しいサンプルが追加された。フォルダ名にmultiを含むサンプルを探すと見つかる(例えばbasic-multi-root-sampleなど)。

ファイル保存&ファイルを開くダイアログ

  • 拡張機能APIに新たに、拡張機能がファイルやフォルダを保存したり開くためのダイアログを表示する2つの新しい関数が用意された。

CompletionItems/SignatureHelp

  • CompletionItemsSignatureHelpのAPIを拡張し、MarkdownStringとしてドキュメントを提供できるようになった。
  • これにより、空想的なレンダリング、埋め込みコードスニペット、およびさらなるドキュメントへのリンクが可能になる。
  • 独自のTypeScriptとJavaScriptの拡張機能はすでにMarkdownStringを使用している。

CompletionContext

  • CompletionItemProvider.provideCompletionItemsに新しいCompletionContextパラメータが追加された。
  • このコンテキストには、補完プロバイダがどのように起動されたかに関する情報が含まれている。

タッチバーのサポート

  • macOSのタッチバー機能を拡張機能から扱えるようになった。
  • 新しいメニュー識別子のtouchBarがこの目的のために追加された。
  • コマンドコンテキストは常に現在アクティブなファイルであり、when条件に基づいてコマンドを動的に表示および非表示にすることができる。
  • ラベルまたはアイコンのいずれかを持つことができる。コマンドがアイコンを提供する場合、タッチバーのスペースは非常に限られているため、ラベルは表示されない。
  • 現在、コマンドアイコンはPNGファイルタイプである必要があり、SVGはサポートされていない。

アクティブなビューの列の参照

  • エディタのレイアウト(エディタグループ)は1~3列で構成され、showTextDocument関数を使用する場合は列を指定する。
  • ただし、現在アクティブな列を参照したいだけの場合もある。
  • これを簡単にするために、新しいシンボル列ViewColumn.Activeが追加された。
  • 常に現在アクティブな列にドキュメントが表示され、それが何列目であるかを把握する必要がなくなる。

MarkedStringとMarkdownString

  • 今回のリリースでMarkedStringでコマンドリンクを使用することはできなくなったので、代わりに新しいMarkdownStringを使用する。

新しいソース管理メニュー

  • メニューIDscm/sourceControlを使用して、ソース管理ビューの新しいソース管理プロバイダセクションのインラインソース管理プロバイダ行にコマンドを提供できるようになった。
  • 現在は、コンテキストメニューコマンドのみがサポートされている。

タスク用のAPI

  • タスクAPIは、さまざまなワークスペースフォルダのタスクをサポートするように拡張された。
  • 拡張機能でタスクを作成するコンストラクターには、タスクがグローバルか、ユーザーローカルか、またはワークスペースフォルダーに属しているかを特定する追加の引数がある。

デバッグ用のAPIの変更

非推奨のvscode.startDebugコマンド

  • 7月分のリリースでvscode.debug.startDebugging(...)APIが導入されたため、vscode.startDebugコマンドを使用してデバッグセッションを開始する必要がなくなった。
  • vscode.startDebugコマンドは8月分リリースで非推奨になったが、10月分のリリースで削除される予定。

非推奨のvscode.workbench.customDebugRequestコマンド

  • 7月分のリリースでDebugSession.customRequest(...)APIが導入されたため、vscode.workbench.customDebugRequestコマンドを使用してカスタム要求をデバッグアダプタに送信する必要がなくなった。
  • vscode.workbench.customDebugRequestコマンドは8月分リリースで非推奨になったが、10月分リリースで削除される予定。
  • デジャヴ・・

package.jsonでのデバッグ設定

新しいアクティブ化イベントonDebug

  • 新しいデバッグAPIを使用する場合、拡張機能は必要なときにVS Codeで使用できるように、DebugConfigurationProviderを早めに登録する必要がある。
  • DebugConfigurationProviderは一般的に拡張機能のactivate関数に登録されているので、デバッグ作業が開始される直前に起動される新しいアクティブ化イベントonDebugを導入する(起動設定の設定やデバッグセッションの起動など)。
  • 拡張機能にDebugConfigurationProviderを登録した場合は、package.jsonactivationEventsonDebugエントリが含まれていることを確認する。

非推奨のアクティブ化イベントonDebug:type

  • DebugConfigurationProviderAPIの導入により、アクティブ化イベントonDebug:typeを正しくサポートすることが困難になった。
  • 代わりに新しく導入されたアクティブ化イベントonDebugを使用することが推奨される。
  • 9月分のリリースでonDebug:typeを非推奨にし、10月分リリースで削除する予定。

package.jsonでのdebuggers.startSessionCommandの使用の非推奨

  • DebugConfigurationProvider型のresolveDebugConfigurationメソッドの導入により、startSessionCommandをデバッガのコントリビューションポイントに提供する必要はなくなった。
  • したがって今回startSessionCommandを非推奨にし、10月分リリースにて削除する予定。
  • デジャ・・

package.jsonでのdebuggers.initialConfigurationsコマンドの使用の非推奨

  • DebugConfigurationProvider型のprovideDebugConfigurationsメソッドの導入により、debuggers.initialConfigurationsのコントリビューションポイントにコマンドを提供する必要がなくなった。
  • したがって今回コマンドIDを指定する機能を非推奨にし、10月分リリースにて削除する予定。
  • デ・・

デバッグアダプタプロトコル

BreakpointEventのremovedサポート

  • BreakpointEventreason属性の値セットにremovedが追加された。
  • この追加により、デバッグアダプタはそのクライアント(フロントエンド)にブレークポイントが削除されたことを通知できる。
  • これまではVS Codeはchanged(またはupdate)ブレークポイントイベントのみをサポートしていた。
  • 今回のリリースでVS Codeはブレークポイントのnewchangedremovedを完全にサポートするようになった。

ロケールをデバッグアダプタに渡す

  • initializeリクエストにオプションとしてlocale属性が追加された。
  • これにより、デバッグアダプタプロトコルのクライアント(フロントエンド)は、現在のロケールをデバッグアダプタに渡すことができるため、クライアントに渡されたすべてのユーザーの可視情報(エラーメッセージなど)に対して正しい変換を選択できる。

リモートファイルシステムAPI

  • 現在リモートファイルシステムのサポートを模索中。
  • 新しいAPIを使用すると、ファイルやフォルダをエクスプローラに追加したり、ファイルの作成、削除、移動、コピー、ファイルの読み書きを行うことができる。
  • 目標は、リモートソースからのアイテムがローカルディスクのファイルと同様に表示され、動作すること。

マルチルートワークスペース(プレビュー)

  • 現在、単一のVS Codeウィンドウ(インスタンス)で複数のフォルダを開くためのサポートを続けている。
  • この機能は、1.14.0のリリースでプレビューされた。
  • マルチルート機能は安定版で利用できるだけの確信が持てるまでインサイダービルドでのみ使用できる。
  • 試してみるには、https://code.visualstudio.com/insiders からインサイダービルドを入手する。
  • 今回のリリースでは、ウィンドウの再読み込みを行わずにワークスペースワークに移行することに重点を置き、マルチルートワークスペースをよりよくサポートするための拡張機能用のAPIを追加導入した。

ウィンドウのリロードなしでのワークスペースの追加

  • これまでは、ワークスペースを作成または保存するとき、またはワークスペースにフォルダを追加するときに、ウィンドウ全体をリロードする必要があった。
  • 今回、ウィンドウを再ロードする必要がなくなり、マルチルートの利用がよりスムーズになった。

推奨される拡張機能

  • 推奨される拡張機能のサポートをマルチルートのワークスペースに拡張した。
  • すべてのルートフォルダからの推奨される拡張機能が統合されて表示される。
  • また、Extensions: Configure Recommended Extensions(Workspace)コマンドを使用して、マルチルートワークスペース自体の推奨される拡張機能を構成することもでる。
  • これにより、ワークスペース構成ファイルにて、extensions/recommendationsセクションに推奨される拡張機能を指定できる。

ワークスペースフォルダ選択用の新しいAPI

  • VS Codeでのマルチルートのサポートの到来により、拡張機能がユーザに対して特定のWorkspaceFolderを求めることがよくあることに気付いた。
  • 新しく提案されたAPIメソッドshowWorkspaceFolderPickはワークスペースフォルダの一覧を表示し、選択された結果を返す。

新しいAPI RelativePattern

  • 特定のWorkspaceFolderへのファイルパスを簡単にフィルタリングできるように、新しい型RelativePatternを追加し、次の場所でサポートした。
    • workspace.createFileSystemWatcher
    • workspace.findFiles(include, exclude)
    • DocumentFilter#pattern
  • RelativePatternを使用すると、ファイルパスは対象となるパターンのベースパスに相対的にマッチする。
  • 例えば、ベースパス/home/work/folderに対し/home/work/folder/index.tsというファイルパスが指定されている場合、RelativePattern内のパターンはindex.tsとマッチする。

よりスマートなワークスペースファイル形式の保存

  • Windowsにて、ワークスペースファイルを変更時にディスクに保存するときに、ファイルがすでにスラッシュを使用している場合には、パスの前方にスラッシュを使用することを推奨する。
  • これにより、Windowsと他のプラットフォーム間でワークスペースファイルを簡単に共有できるようになる。
  • さらに、ワークスペース・ファイル内にてコメントを保存できるようになった。
  • JSONはファイル内のコメントを許可していないが、ここではVS Code設定に使用するのと同じJSONパーサを使用してコメントを許可し、さらにエラー耐性も高めている。たとえば、末尾のカンマでワークスペースファイルが無効になることはない。

ワークスペースフォルダ名

  • 設定ファイル内の各フォルダにnameプロパティを割り当てることができる。
  • 名前はエクスプローラで取得され、同じベース名を持つ複数のワークスペースフォルダを区別するために使用される。

エンジニアリング関連

課題管理の自動化

  • 現在、Probotインスタンスをメインのリポジトリ以外にも使用し始めており、拡張機能やその他のリポジトリにて、Issueの自動的な割り当てや古いneeds more infoIssueのクローズに使用している。

注目すべき変更

  • 27285: OneDriveのフォルダが開けない
  • 25934: 高DPIの外部モニターでVS Codeがチカチカする
  • 35148: 画面非表示でVS Codeを起動する
  • 22696: 保存ダイアログのファイル名フィールドにてCmd-Aでテキストが全選択されない
21
16
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
21
16