- 1. はじめに
- 2. 使い方
- 2.2.1. HTML内でのJavascriptの動作順序・読み込み方法
- 2.2.2. HTMLの基本1（環境構築と基礎知識）
- 2.2.3. 【個人開発】「お好み焼きをひっくり返すだけのアプリ」を作ってみた
- 2.2.4. 【Laravel】 Selectフォームでdisableを使用するとバリデーションに引っ掛かる
- 2.2.5. ~環境構築不要~ 絶対につまづかないReact入門
- 2.2.6. Reactでアプリを作成しました【5】【Todo List ②】「自分用メモ」
- 2.2.7. 【FullCalendar】Googleカレンダーのカスタマイズ例（コピペ用）
- 2.2.8. CSSだけで簡単にグリッチエフェクト風アニメーションを実装する
- 2.2.9. OpenCV.jsでプレデターから逃げるマッチョの画像を作る
- 2.2.10. ブロックレベル要素とインライン要素について！
【Jest】モック化はこれでOK！
# Jestを利用してモック化しよう
テストを作成していて、時刻によって返す値が異なる関数などのテストを書くとき、想定した値を返してもらいたいときがあります。“`jest.fn()“`を利用すると簡単に関数をモック化する事ができます。 この記事は、学習した際の自分用の備忘録です。
https://jestjs.io/ja/docs/mock-functions
## mockプロパティの確認
すべてのモック関数には、“`.mock“`プロパティがあります。モック関数呼び出し時のデータと、関数の返り値が記録されています。はじめにmockプロパティを確認していきます。* calls : モック関数の呼び出し毎の引数の配列
* results: モック関数の呼び出し毎の結果の配列
* instances : newを使用してモック関数からインスタンス化されたオブジェクトが含まれる配列“`javascript:mock.test.js
describe(“#jest.fn”, () => {
it(“Check `jest.fn()` specification”,
H27国勢調査のODデータ（自宅外就業者数及び通学者数）をdeck.glで表示してみました
# はじめに
– H27国勢調査のODデータ（従業・通学市区町村，常住市区町村，男女別自宅外就業者数及び通学者数）を[deck.gl](https://deck.gl/)で表示してみました
– H27国勢調査のODデータ（従業・通学市区町村，常住市区町村，男女別自宅外就業者数及び通学者数）は、[e-stat](https://www.e-stat.go.jp/)より[統計データ](https://www.e-stat.go.jp/stat-search/files?page=1&layout=datalist&toukei=00200521&tstat=000001080615&cycle=0&tclass1=000001101935&tclass2=000001101936&tclass3val=0)をダウンロードして用いています。
– deck.glの表示には、[ArcLayer](https://deck.gl/docs/api-reference/layers/arc-layer)及び[TextLayer](https://deck.gl/docs/api-reference/
CSS: Typewriter effectが流行っているようだ
https://coliss.com/articles/build-websites/operation/javascript/typewritten-text-used-custom-elements.html
というものにあやかり。
## Dev.To でTypewriter合戦が繰り広げられていた
See the Pen Frontend Roadmap 2021 で一人前のフロントエンドエンジニアになる
はじめまして、21新卒エンジニアです?
今年の4月からエンジニアとして就職して約半年が経ちました。
この半年間で自分の無知さを痛感しています。
そこで…# Web Developer Roadmap
Web Developer Roadmapとは、毎年ウェブエンジニアになるためのロードマップをまとめてくださっているプロジェクトです。
私のように何から手をつけていいのか分からない初学者にはとてもありがたい道標になると思いました。
今回はその中の**Frontend Roadmap**に則って学習を進めて、一人前のフロントエンドエンジニアを目指したいと思います?https://github.com/kamranahmedse/developer-roadmap
## Fronend Roadmap 2021
**をダウンロードします。https://freephotomuscle.com
#ソースコード
新しくファイルを作成し“`index.html“`という名称で保存し、次の内容をコピぺします。
OpenCV.jsのチュートリアルにあるソースコードに手を加えました。
https://docs.opencv.org/master/d0/d84/tutorial_js_usage.html“`diff_html:index
ブロックレベル要素とインライン要素について！
#結論！
HTML要素はブロックレベル要素とインライン要素の2種類に分けられる！
要素が入れ子構造になると、「親要素」と「子要素」という言葉で要素間の関係性を表す！
以上が答えだと思います！
これについてわかりやすく書いていきたいと思います！
#①.ブロックレベル要素！
HTMLの積み木を構成する要素です！
1つのブロックレベル要素が、1つのHTMLにおける積み木として存在します！
特徴は下記の通りです！
・横幅いっぱいで表示される四角い箱である！
・箱の中にテキストなどが表示される！
・中身に関係なく横幅いっぱいになる！
・高さは中身によって変わる！
・縦並びで表示される！
#②.インライン要素！
インライン要素とは、テキストの一部として扱われる要素です！
基本的にブロック要素の中で使用され、「テキストの一部を太文字にする」など、
主に文字の装飾などに使用します！
特徴は下記の通りです！
・中身のテキスト量の分だけ横幅が広がる！
・高さは中身によって変わる！
・連続すると横並びで表示される！
#③親要素と子要素について!
親要素とは、ある
