nvmとnpmの違いをまとめてみた(ついでにyarnも

## 概要
毎回あやふやになってしまうので備忘録として残しておきます。

## nvmはnode.jsのバージョン管理ツール
nvmはnode.jsのバージョンを管理するツールです。
主に,`nvm install “10.17.0”`みたいな感じでインストールしたりします。
さらに`echo ‘10.17.0’ > .nvmrc`みたいにするとそのディレクトリで`nvm use`でバージョン切り替えるみたいなことができます。

## npmはnode.jsの公式パッケージ管理ツール
一方、npmの用途はパッケージ管理です。
JavaScript公式のやつです。
Expressとか、asyncとかnode.jsの有名なパッケージを管理できます。

## yarnはnode.jsの非公式パッケージ管理ツール
yarnもnpmと同じnode.jsのパッケージ管理ツールです。
非公式だけどこっちの方が早くて優秀？らしいです。（今はあんまり変わらないみたい

WordPress 以外を探し始めた君へ贈る Netlify CMS

こんにちは。[リケイのオコジョ](https://twitter.com/rikei_ocojo)です。
Apple関連、Web開発やSaaSの情報とオコジョのイラストを書いてます。


# はじめに
[Netlify CMS](https://www.netlifycms.org/)は[gatsby](https://www.gatsbyjs.com/)や[Jekyll](https://jekyllrb.com/)、[Hugo](https://gohugo.io/)などの静的サイト生成フレームワークや、[NextJS](https://nextjs.org/)、[Nuxt](https://nuxtjs.org/)などのJavaScriptフレームワークと合わせて使うことでWordPressのようなCMSを作る

nodejs で import がシンタックスエラーを吐く

ある`nodejs`のコードを実行しようとしたら以下のようなエラーを吐かれた

“`jsoutput
import pkg from ‘‘;
^^^^^^

SyntaxError: Cannot use import statement outside a module
“`

https://bobbyhadz.com/blog/javascript-syntaxerror-cannot-use-import-statement-outside-module#:~:text=The%20%22SyntaxError%3A%20Cannot%20use%20import,json%20for%20the%20Node%20apps.

によると、どうもJavascriptのバージョン`ES6`からの機能を使ったコードが含まれている場合にこのようなことが起きるらしい。
`Nodejs`の場合には`package.json`の中に以下のような記述を追加すればよいらしい。

“`json
{
“type”: “module”,
}
“`

JavaScript メソッド「write」と「name:value」変数定義

“`

JavaScript 　メソッド「getElementById」「innerHTML」　

“`
/*内容一文省略*/

test

This is paragraph

This is Div

Click

when you click button up,th

文章の最初と最後を抜き出すやつ　インターネット無しのローカルで動くページ

# 文章の最初と最後を抜き出すやつ(雑)
インターネット無しのローカルで動くページ。。。
とある所で使うようなので、解説とかは無しです。

“`html

将来の自分へのメモも兼ねているので、見返しやすいようにシンプルな内容の記事にできればと思います。

## 今回扱う事例
JavaScript で SVG を動的に生成する話を書いていくのに、冒頭のモーションパスの例だと内容がシンプルにならなそうでした。
そのような中、最近書いた以下の記事は SVG の内容がシンプルなので、それを題材にしてみようと思います。

●p5.js で SVGフィルターを使う（p5.js Web Editor上の HTML・JavaScript に手を加えて利用） - Qiita
　https://qiita.com/youtoy/items/217bfe7e940f2a7e2626

## JavaScript で SVG を動的に生成する時のポイント（「createElementNS()」を使う）
冒

【#38 エンジニア転職学習】Go WebApp　フロントエンド部分作成

# はじめに
富山県に住んでいるChikaといいます。
毎日投稿を目標に、バックエンドエンジニア転職に向けた学習内容をアウトプットします。

使用しているGoのUdemy教材後半部分である、
Webアプリ作成演習を学習していきます。

バックエンドエンジニアになるまでの学習内容は以前投稿した以下の記事を基にしています。

https://qiita.com/Chika110/items/ef54dddd565a0193ef44

# 本日の学習内容
本日はCandleStickのデータフレーム作成、APIHandler、jQueryを使用したフロントエンド部分作成を学習しました。

* データフレーム
* APIHandler
* **フロントエンドchart作成　←Topics!!**

# フロントエンド chart作成
以下今回のフロントエンド部分作成時の個人的ポイントです。
* chart作成のHTMLは基本的なものは`developers.google.com/chart/`からテンプレート取得
* jQueryは「Google Hosted Libraries」よりリンク

【JavaScript・HTML・(Python)】tableにあるボタンを押した行をモーダル上で削除する

### ※注意！！
タイトルでは、「削除する」とありますが、記事に書いているのは、**tableの1行をボタンを押してモーダルを出す→削除する手前まで！！！** です。
削除機能実装については書いていませんのでご了承ください。

## 本記事の目的
1. JavaScriptを使って「欲しい！！」と思った**テーブルの行の情報を取得**できるようになる
1. ボタンをクリックして、**クリックした行の情報を取得**できるようになる
1. 上から降ってきた画面(モーダル)上のボタンを押して、プログラムを実行する手前まで実装することができる

の3つです！

## 目次
1. 実装した機能
1. この記事を書こうとした経緯
1. 具体的な実装方法
1. 参考にしたサイト

## 1. 実装した機能

今回実装したい機能は、こんな感じです。
![event_category_delete.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/782282/6eeb43cc-f554-cd59-1f1f-d6f5f5

Markdownでレポートを書きたい2

こちらの記事は，[Markdownでレポートを書きたい](https://qiita.com/tt_and_tk/items/e16c524c9e647813d6e8)の続きです．

# レポートを楽に，綺麗に書きたい
※読み飛ばしOK

レポートを書くというのは，非常に時間のかかる行為です．できるだけ効率的に短時間で，でもきれいに書きたいという気持ちは多くの学生が抱いていることと思います．
そこで前回の記事ではMarkdownでレポートを書くということを考え，表紙や図番号などを作りました．でも，図番号については[こちらの記事](https://qiita.com/fujino-fpu/items/eeafe3143ae40addff84)などいろいろなところで紹介されている通りすでにあるようです．

いったん話は変わりますが，学校で求められるレポートは意外と多岐にわたります．「この社会問題について，自分の意見をA4二枚にまとめて」と言われることもありますし（実際に言われた），「この日の授業は来れないから代わりに練習問題を解いて提出したら出席扱いにする」と言われることもあります（実際に

未経験からITエンジニアとして転職するためにテックキャンプに通ってみた

# テックキャンプを受講してみて
私は、未経験でのITエンジニアへの転職を行うためにテックキャンプというプログラミングスクールに通っていましたので、今後検討される方のために感想を中立な立場として記述したいと思います。
なお、こちらの記事の内容は一個人の見解ですので、参考程度にしていただければと思います。
その上で、私の属性は以下を参考にしていただければ幸いです。

# 前提条件
【当方の前提条件】
・大学は私立文系で3年次より金融専攻
・銀行の営業員として業務に従事
・新卒で入社した企業を1年で退社した、24歳の人
・在職中にHTML&CSSは本を使って学習
・スクール学習期間中は、11時間程度学習（土日関係なし）

# 結論
テックキャンプはお勧めできる。（条件付き）
考える上で「学習内容について」「費用面」「転職活動面」の大きく３つに分けてお話しします。みなさんが気になるであろう上記３つ以外にももちろんスクール選びのための要因や比較等もあると思いますが、ひとまずこちらの３点だけ記述させていただこうと思います。

### 学習内容について
他社サービスとは比較していないですが、テッ

スプレッド構文を利用してUI表示をうまく切り替える

# React・VueのUI表示切り替えで使える

フラグで表示の切り替えを行うことって多いかと思います。
その時に使えそうなものがあったので今回紹介します。
大したものではないので、また普段使っている方も多いと思います。
ぜひ、使っていいい感じに切り替えできるといいなと思います。

## スプレッド構文を使う

``` typescript
const list1 = [1, 2];
const list2 = [10, 20];
const result = [...list1, ...list2];
```
これですね。

``` typescript
const list1 = [[], 2];
const list2 = [10, 20];
const result = [...list1, ...list2];
=> [2, 10, 20]
```

空の配列はマージすると消えることを利用したUIの切り替えが使えます。

例えば

``` typescript
const list1 = [
flag ?
[
{ title: 'AAA' }

htmlのtableであれこれ（前回の続き）

## テーブル機能追加
前回の記事で作ったヘッダ固定スクロール表に機能を追加。
+ 見出し列のグルーピングについて、スクロールして表示される範囲の中央に表示。
+ セルをクリックしてテキストボックスを表示（実際の編集処理は省略）

See the Pen
Untitled by cfd-ack (