ドットインストールの学習メモです
クイズ ショートカットまとめ
command + B
command + s
command + c
command + x
command + option + s
command + ,
shift + command + p
ommand + enter
command + shift
command + d
command + shift + L
command + option +↓
command + f
command + g
command + shift + g
command + option + f
答えは下を読め＾＾
##アクティビティバー
上から
- explore ファイル管理
- 検索
- git
- debug
- extensions 拡張機能
... - 設定
右クリックで表示非表示を選べる
表示 appearance メニューから戻せる
もしくは command + B
削除・フォルダ・ファイル作成もできる。
##一番下はステータスバー
行
列の位置
タブサイズ
文字コード
改行コード
ファイル種別-自然にコードを補完したりしてくれる
###広いエリアはエディタエリア
##ファイル編集
フォルダを追加
ファイルの作成
ファイルの保存-ファイルから保存か、command + s
##Emmet記法
標準のテンプレートを呼び出してくれる機能。
カーソルを置いて
command + c
command + x
で行ごとコピー・カット。
ul>li*3
でul下にliを３つ作ってくれる。
emmet記法を勉強しておくのもいいでしょう。
##css,javascriptを読み込んでみよう
***書いてからホバー・クリックでフォルダとファイル作成してくれる。*** タブを閉じるのはcommand + B タブをエディタエリアに持ってくと分割できる。 タブエリアに戻せば分割を解除。###cssを編集してみよう
色指定後の、色見本(文字のところ）にホバーするとカラーピッカーが出てきて、そこから色を選べる！！
セレクターにホバーするとセレクタが示す要素を例示してくれたり、詳細度を表示してくれたりする。
h1 .title, h1.titleの違いなど
###javascriptを編集してみよう
document = docで候補を選ぶ
queryselector = queselでも候補を選んでくれる！！
ddEventListener = adevliで出てきた！すごい。。。。
###CSS JavaScript全てのファイルを保存するには
command + option + s
##設定の変更
preference setting or command + ,
auto save afterDelay
fontsize 14
fontfamily Ricty diminished
tab 2
render white space all 空白の表示
word wrap on 行の折り返し
##コマンドパレット
view command palette or shift + command + p
カラーテーマの変更など
ミニマップの削除 minimapを検索
ショートカットを調べる
side barの削除 → sidebarを検索
##実践的なショートカットキー
option + 上下 行を移動できる
option + shift + 上下 複製を任意の方向で
行選択 + option +上下 選択行を移動
command + enter 行の途中でも下に行を挿入
command + shift + enter 行の途中でも上に行を挿入
##マルチカーソル
option + マウスで編集箇所を選択 ２カ所以上の同時編集が可能
他のところをクリックかescでマルチカーソルを解除
command + d カーソル前の単語が選択され、も一度押すと同じ単語が選択される。
command + shift + L で一気に同じ単語を選択できる。
command + option +↓ 真下にカーソルを追加できる
##検索と置換
###検索
command + f 検索
command + g 次の検索結果へ
command + shift + g 前の検索結果へ
###置換
command + option + f
検索窓右隣一つ目のアイコンで一つずつ置換
検索窓右隣二つ目のアイコンで全部置換
###作業フォルダ内全てのファイルを対象とする
activity barの検索アイコン
3つの検索アイコン
大文字小文字の区別・単語ごとの検索・正規表現を使うかどうかのオプション
アラートをreplace
##拡張機能の導入
パス。