Webクライアント（HTML/CSS/JS）を開発していると、方法はどうあれJavaScriptで扱うデータをどこかに集約したり階層化したりして管理しやすい形にまとめておくことが多いと思う。
そんな状況でときどき必要となるこんな仕様
この文字列データは内容によっては途中で改行を入れる
VuexやReduxなどでデータをストアで管理していると、突然出てくるこの仕様を前に私のようなWeb初心者は「データ構造の見直しが必要か？」などとうろたえることになる。
だって、ストアの文字列データに \n や <br /> を入れ込んだところで改行とは認識されず、この文字列がそのまま画面に表示されてしまうだけなのだから。
JavaScriptのデータ内に改行を入れ込むには「テンプレートリテラル」を使う方法が簡単だ。
通常、JavaScriptでは次のようにダブルクオーテーションやシングルクオーテーションで囲んで文字列データを表現する。
"これは文字列です"
'これは文字列です'テンプレートリテラルは、次のようにグレイヴ・アクセント（Shift＋@マーク）という記号で囲んで文字列データを表現するものだ。
`これも文字列です`テンプレートリテラルには便利な機能がいくつかあるけど、ここではその話は置いておいて、改行についてだけ説明する。
テンプレートリテラルで改行を表現するのはすごく簡単だ。
こうすればよい。
`わたしはおもちが大好きだ。
くさもちとくるみもちが
食べたいお。`コンソール出力するなら次のように書く。
console.log(`わたしはおもちが大好きだ。
くさもちとくるみもちが
食べたいお。`);このテンプレートリテラルはVuexやReduxなどでそのままデータとして使えば改行も画面に反映される。