Visual Studio Codeのメモ書きとか色々

投稿者: | 2018年6月28日

珍しくABC C問題が解けたから、調子に乗ってメモ書いた時、「Visual Studio CodeってWeb系書きやすいとか言ってたなあ」というのを思い出して、Visual Studio Codeをインストール。とりあえず使ってみました。

感想としては、「普通に使いやすくね・・・?」

私が最後にVisual Stuido Codeを触ったのが、出たばっかの時で、そのときは「Atomでええやん」となっていましたが、色々と便利になってから使ってみるととても使いやすいです。

  • ・軽いのでサクッと書くことができる
  • Emmetが標準で入ってる
  • 見やすい

AtomならEmmetはパッケージで入れればいいし、見やすさもカスタマイズすればいいんですけど、軽さだけはどうにもできない。早いのは正義ですね。

それはそうと、これは自分がよく使いそうな機能とかそういうのをメモしときます。

Visual Stuio Codeでの折返し

ショートカットキーはAlt+Zです。
[card url=”https://qiita.com/Ouvill/items/6fd08347602752acafe5″ title=”[Visual Studio Code]ウィンドウ幅の右端で行を折り返す。”]

ターミナルからVisual Stuido Codeを起動

shellをインストールすればいいです。

  1. Visual Stuido Code起動した状態でComand + SHift + Pでコマンドパレットを開く
  2. “Shell”と検索
  3. シェルコマンド:path内に”code”コマンドをインストールします、と選択

これで、ターミナルからVScodeが起動できるようになりました。
[card url=”https://qiita.com/naru0504/items/c2ed8869ffbf7682cf5c” title=”ターミナルからVisual Studio Codeを起動する方法【公式の方法】”]

HTMLファイルをプレビュー

プラグイン”Live HTML Previewer”をインストール。

インストール後再起動すれば終わり。

横にプレビューを表示するときは、コマンドパレット(Command+Shft+P)を開いて“show side preview”と入力して選択。いちいちCtrl+Sしなくていいから楽です。

以下はVS codeのことではなく、EmmetやMathjaxについてです。

Emmetでマークアップ

知ってたけど使ってなかった・・・めっちゃ便利やんけ!!

リスト作りたいときは”ul>li*3″と打てば要素数3のリストできるし、”h1+p”と打てば、見出しと段落でてくる。

詳しくは下のサイトがいいと思いいました。
[card url=”https://www.granfairs.com/blog/staff/efficiency-by-emmet-01″ title=”Emmetでマークアップを効率化しよう(HTML&カスタマイズ編)”]

Mathjaxで数式を書く

大学生なのにLaTeXが書けません。というか、レポートが手書きばっかで死にたくなります。

Mathjaxを使う

1,以下のコードをヘッダーに追加する

<script type=”text/javascript”
src=”https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.2/MathJax.js?config=TeX-AMS-MML_HTMLorMML”>
</script>

2,プラグインをインストール(wordpress)
“Mathjax Latex”をインストールすればすぐに使えます。
どちらにせよ、Mathjaxを使うときは、式の両端に$$を付ける必要があります。
[card url=”https://bloglife.info/html-suusiki/” title=”HTMLで数式はどれだけ表せる?複雑な式を表示するには”]

インライン数式

文章中に数式を入れたい場合、インライン数式で本文の埋め込みます。
その時、 (…) で囲んで記述すれば、インライン数式として本文に埋め込めます。
[card url=”http://text.baldanders.info/remark/2017/10/getting-started-mathjax-3/” title=”ちょこっと MathJax: インライン数式と別行立て数式”]

コメントを残す

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください