福野泰介の一日一創

let sum = 0; for (let i = 0; i < array.length; i++) { sum += array[i]; } console.log(sum);

でも、最近はキーワードがハイライトされたコードを見ることが多いので、改善してみました。 let sum = 0; for (let i = 0; i < array.length; i++) { sum += array[i]; } console.log(sum); HTMLは、こんな感じに書きます <script type="module" src="https://js.sabae.cc/code-js.js"></script> <code-js> let sum = 0; for (let i = 0; i &lt; array.length; i++) { sum += array[i]; } console.log(sum); </code-js> 簡単ですね！

HTMLで使うタグを、ハイフン付きの名前であれば自由に拡張できるHTMLElementを使ったWebコンポーネント、便利ですね！ 人気のフレームワークVue.jsのv-タグ、A-FRAMEのa-タグなどが有名です。

「code-js」
highlight.jsをESモジュール化して、一番馴染みが深そうなVSCodeスタイルのcssと含めてcode-js.jsとして作りました。

Code for FUKUI でどんどん追加しているオープンソースなWebコンポーネント。細かいところ調整したい方はどんどんforkして活用ください。改善提案（プルリク）も歓迎です。

どんなタグがあると便利でしょう？
そういえば、VRタグとかいいですね！（サンドーム福井にてクリエイターズランド、開催中！内部の様子、サンドーム福井 - VRふくい）

links
- input-graph グラフ編集コンポーネントα
- input-table テーブル編集コンポーネント
- input-dates 複数日付入力コンポーネント
- mark-down Markdown表示コンポーネント
- csv-map 緯度経度付きCSVデータ地図表示コンポーネント
- csv-table CSVデータ表示コンポーネント