ここ２日でやったことを忘れないうちにざっくりと記録。
筆者の状況
プログラミング初心者（HTML・CSS、JavaScript、Ruby、PHP、Pythonの基本だけ学んだ）
JavaScriptのフレームワークに手を出し始めている段階。
1. JavaScript(ES6)の学習
インプット
ProgateのJavaScript(ES6)レッスン4～6を１周
学習内容
- クラス（設計図）からオブジェクトをつくる概念と手法
- インスタンス生成直後に行われるコンストラクタの処理
- クラスの継承
- constructorのオーバーライド
- ファイル間のexport, import
- 配列に対して使えるメソッド（push, forEach, find, filter, map）
2. Node.js関連のあれこれインストール
- nodist（Node.jsのバージョン管理ツール）のインストール
- Node.js（サーバーサイドでJS動かす）のインストール
- npm（Node.jsのパッケージ管理ツール）からパッケージの使用
- babel（ESバージョンの橋渡し）のインストール
3. jQueryの学習
インプット
- ProgateのjQuery初級編～上級編
- YouTube動画（https://www.youtube.com/watch?v=hMxGhHNOkCU） #1~#4
学習内容
- 書き換えメソッド(css, html, text)
- click, hover メソッド
- eq, index, prev, next, lengthメソッド
- ゲット用メソッド(text, html, css, attr)
- animateで動きをつける
- thisの構文
- formの受け取り（val, submit）
- カスタムデータ属性
- scrollTop、ページ内ナビゲーション、offset
4. Bootstrap 4の基礎
htmlとcss学んだあなたへの簡単なフレームワーク、的な記事で紹介されていた。
静的サイトを作るため興味を持つ。
そもそも、bootstrapが何なのかよくわかっていなかった。
CSSをあらかじめストックしているファイル群のことで、タグにclassを指定すれば勝手にスタイルがついていくものだと理解した。
インプット
- Learn Bootstrap 4 for free - scrimba（https://scrimba.com/g/gbootstrap4）
- Bootstrap 4入門 - ドットインストール （https://dotinstall.com/lessons/basic_twitter_bootstrap_v5）
startbootstrapでサイトを作ってみよう、という段階
次にやりたいこと
学んだことをすぐにアウトプットできる場所をつくる、学習記録をQiitaではない場所に残す。
そのため、静的サイトをつくる。
具体的にやること
1. 静的サイトを作る
載せるものは、学んだ言語のアウトプット、学習記録、ポートフォリオくらいなので、静的サイトに特化したサイトジェネレーターを使う。
JSベースの静的サイトジェネレーターはNuxt.js、Next.js、Gatsbyなど様々あるみたいですが、React Staticを使うとシンプルに静的サイトを作れるので良いという記事の影響と、React.jsがトレンドっぽいのでなんか良さそうということで、React Staticで制作しようと考えています。
2. サーバーを利用してサイトを公開する
- Githubでの公開はできるけれど色々制限があるみたいなので、GitLab、Netlify、Heroku（違いがよくわかっていない）のどれかを使ってサイトを公開する
少々あせりぎみで学習しているので、復習のためアウトプットを増やして着実に学んでいこう。