その1からの続きです。
100日間の履歴（51〜100日目）
JavaScript 100日写経（51日目）
windowあれこれ pic.twitter.com/DxcWn0nNTi
— FG🐡 (@fuguti) January 29, 2024
JavaScript 100日写経（52日目）
window.history.forward();とwindow.history.back();で行ったり来たりしてキャッキャする。 pic.twitter.com/kJUzOefDCR
— FG🐡 (@fuguti) January 30, 2024
JavaScript 100日写経（53日目）
文字を浮かび上がらせる。
この動きgmailのアプリで受信トレイが空のときの動きに似ている。 pic.twitter.com/Sar9lc6aKd— FG🐡 (@fuguti) January 31, 2024
JavaScript 100日写経（54日目）
iterations:Infinityで延々と流れる水滴を作り眺めたら疑似マイナスイオンを得られるのではないか？という仮説のもと作った。
が、ずっと見ていると自分で自分のことが不安になってくるので失敗。 pic.twitter.com/rYVGU60sR9
— FG🐡 (@fuguti) February 1, 2024
JavaScript 100日写経（55日目）
うねうね背景が動く。すごいｗ pic.twitter.com/yFa9j9lnt8
— FG🐡 (@fuguti) February 2, 2024
JavaScript 100日写経（56日目）
jQueryを使う。https://t.co/4uxNchZvNL pic.twitter.com/tL7tGTjBqZ
— FG🐡 (@fuguti) February 3, 2024
JavaScript 100日写経（57日目）
ゲーム風。 pic.twitter.com/agSuXGgfjY
— FG🐡 (@fuguti) February 4, 2024
JavaScript 100日写経（58日目）
アニメーションのGSCスクリーンショット。
軍隊ガニCが浮かび上がっていない。 pic.twitter.com/TtLsrqoyPP— FG🐡 (@fuguti) February 5, 2024
JavaScript 100日写経（59日目）
GTMで一定時間経過するとsection-title箇所が消えるカスタムHTML。エラーが出てきて失敗。
調べたらconstが使えないとのこと。https://t.co/g9Qw3240D6 pic.twitter.com/wq61iNI48S
— FG🐡 (@fuguti) February 6, 2024
JavaScript 100日写経（60日目）
varで書き直し。
100ミリ秒後にsection-title（記事見出し箇所）が消えた！ pic.twitter.com/JDq8CGEeNs— FG🐡 (@fuguti) February 7, 2024
JavaScript 100日写経（61日目）
やってて思ったんだけどシンプルなところだと一定時間経過でアラート出すとかはお試しで簡単にできるよなという感想。 pic.twitter.com/aJ8eKlSXaz
— FG🐡 (@fuguti) February 8, 2024
JavaScript 100日写経（62日目）
動的な情報を組み合わせたものをカスタムHTMLで作成する。
GTMのプレビューで試す前に一回consoleで試したほうが早いという学び。 pic.twitter.com/Pb3LHJZZrA— FG🐡 (@fuguti) February 9, 2024
JavaScript 100日写経（63日目）
5秒後にsection-title箇所のテキストをすべて変更するカスタムHTML。 pic.twitter.com/CqF46l0FUs
— FG🐡 (@fuguti) February 10, 2024
JavaScript 100日写経（64日目）
GTMで設定した
50秒後に出力されるconsole.log
と
0.5秒後に出力されるconsole.log
のライブテストの違い。 pic.twitter.com/gYBaGoe6n9— FG🐡 (@fuguti) February 11, 2024
JavaScript 100日写経（65日目）
1秒おきにconsole.logで秒数カウントをするカスタムHTMLを仕込んでライブテストをする。自分の環境では4秒になった。（誰得） pic.twitter.com/d9oW9fCJcs
— FG🐡 (@fuguti) February 12, 2024
JavaScript 100日写経（66日目）
カスタムHTMLでdataLayerを作り、consoleから本気でpushpushする。 pic.twitter.com/ql5JqOx93C
— FG🐡 (@fuguti) February 13, 2024
JavaScript 100日写経（67日目）
昔作ったやつ。GTMのプレビュー画面でしか見てなかったけどconsole上ではこんな動きになっていた。
（どこで勉強したのか丸わかりのクーポン名になっている）https://t.co/cbTHrlwSC9 pic.twitter.com/pA4qtIlQx2— FG🐡 (@fuguti) February 14, 2024
JavaScript 100日写経（68日目）
IntersectionObserverEntry pic.twitter.com/BJEhCLW3DB
— FG🐡 (@fuguti) February 15, 2024
JavaScript 100日写経（69日目）
GTMのヘルプに載ってたサンプルコード。
リンクをクリックするとデータが追加されるやつ。https://t.co/hWvNnoBEBv1がクリック前、2がクリック後。 pic.twitter.com/zLMz8lIBfy
— FG🐡 (@fuguti) February 16, 2024
JavaScript 100日写経（70日目）
「金曜日の次点を見る」をクリックするとappName、date、UA取得以外に、user-type「'user-type': 'heavy user'」となる。（フィクションです。リリースしていませんｗ） pic.twitter.com/39rvlfUQgc
— FG🐡 (@fuguti) February 17, 2024
JavaScript 100日写経（71日目）
ページに入っているscriptを抜き出す。
document.querySelectorAll('script');ですべて引っこ抜いたもの、番号で指定したもの。 pic.twitter.com/O6jdNzHPDk— FG🐡 (@fuguti) February 18, 2024
JavaScript 100日写経（72日目）
i++ でなにか書くhttps://t.co/jmgasQ4oHO pic.twitter.com/89o5ZYHjn2
— FG🐡 (@fuguti) February 19, 2024
JavaScript 100日写経（73日目）
2月21日にだけsection-titleが変更されるaboutページ。https://t.co/njomd7k9Jv
today.getMonth() === 1で2月（錯乱）
（本日はa2iどうぞよろしくお願いします）#a2iseminar pic.twitter.com/efzLD87kzP
— FG🐡 (@fuguti) February 20, 2024
JavaScript 100日写経（74日目）
リファラーによるブログタイトルの書き換え。 pic.twitter.com/uYPCwM2pH3
— FG🐡 (@fuguti) February 21, 2024
JavaScript 100日写経（75日目）
リファラーによってsection-titleが変化する場合、URL検査ではどうなるのか？→ リファラー情報ないので表示なし。 pic.twitter.com/7i9q0D5zQE
— FG🐡 (@fuguti) February 22, 2024
JavaScript 100日写経（76日目）
1秒後に突然GoogleのリダイレクトページにリダイレクトさせるカスタムHTML。 pic.twitter.com/nFB11pgIQV
— FG🐡 (@fuguti) February 23, 2024
JavaScript 100日写経（77日目）
リダイレクトがかかるページのURL検査🤔 pic.twitter.com/bkal5p7bJd
— FG🐡 (@fuguti) February 24, 2024
JavaScript 100日写経（78日目）
onclick系のイベント各種を体験する。おおー！ってなるｗhttps://t.co/Sjg4TM0GLt
画像は右クリック反応のoncontextmenu。 pic.twitter.com/ta2J3AD7jq
— FG🐡 (@fuguti) February 25, 2024
JavaScript 100日写経（79日目）
onmouseoverでログが出てくるページのコンソールとURL検査。URL検査のログにはなにもない。 pic.twitter.com/lDqKYWfJVn
— FG🐡 (@fuguti) February 26, 2024
JavaScript 100日写経（80日目）
多分やらないほうがいいGTMからの修正。 pic.twitter.com/cg7cIaB4LH
— FG🐡 (@fuguti) February 27, 2024
JavaScript 100日写経（81日目）
昨日の続き。html側のidが変わってしまい、GTMが効かなくなってしまった例。 pic.twitter.com/nCEYRIVtlp
— FG🐡 (@fuguti) February 28, 2024
JavaScript 100日写経（82日目）
（多分やらないほうがいいと思うけど）変数に日本語が使えた。
+ コードのミスを聞いた時の絶対に間違っているGeminiのアドバイス。どこからそう考えたんだ。 pic.twitter.com/JAvbphBdNa— FG🐡 (@fuguti) February 29, 2024
JavaScript 100日写経（83日目）
documentとかwindowのデータを見ていて「これを駆使すればGAが作れるのでは？？？？？？」とか思ったんだけど、冷静に考えるとJS使ってるのでそれはそう。（1週した）
あらためてGTMとかGAのタグを見てみると、これまでの写経でも見たことのある記述があって新鮮。 pic.twitter.com/nnyyIPeuv3
— FG🐡 (@fuguti) March 1, 2024
JavaScript 100日写経（84日目）
ここで色々定義されていそう（想像）。https://t.co/ovkLYx6S1z pic.twitter.com/o7yeHGe2YF
— FG🐡 (@fuguti) March 2, 2024
JavaScript 100日写経（85日目）
page_view、DOM Ready、ウインドウの読み込みの違い体験教室。https://t.co/X95x2u2IHY pic.twitter.com/H64VRSWMRo
— FG🐡 (@fuguti) March 3, 2024
JavaScript 100日写経（86日目）
page_view、DOM Ready、ウインドウの読み込みの違いどれくらい差分を出せるか選手権。
重めのページをSlow 3Gで動かしてみた。ウインドウの読み込みだけ3分差が出た。 pic.twitter.com/399soghgPr— FG🐡 (@fuguti) March 4, 2024
JavaScript 100日写経（87日目）
titleの書き換え。URL検査で見るとtitleが2つある。 pic.twitter.com/GtjkG4khRQ
— FG🐡 (@fuguti) March 5, 2024
JavaScript 100日写経（88日目）
GTM（カスタムHTML）とページに直書きしたJSのtitleをバッティングさせたらどうなるのか。
あまりこういうことはやらないし、やらないほうがいいとは思うものの。 pic.twitter.com/8uDqmCXBHb— FG🐡 (@fuguti) March 6, 2024
JavaScript 100日写経（89日目）
ヘルプに載ってたnoidexをGTMで書いて動かしてみる。
ヘルプ：JavaScript SEO の基本を理解するhttps://t.co/1sLrofZ4vI pic.twitter.com/v4riljBmdI
— FG🐡 (@fuguti) March 7, 2024
JavaScript 100日写経（90日目）
JavaScript を使用してDOM 要素を直接作成 × URL検査。
これを魔改造した。https://t.co/t3oryPEHn1 pic.twitter.com/ORGpFZS1x9
— FG🐡 (@fuguti) March 8, 2024
JavaScript 100日写経（91日目）
document.cookie
GAの形跡が見える。https://t.co/exuwDT1Ctq pic.twitter.com/uwhpiAqCJM— FG🐡 (@fuguti) March 9, 2024
JavaScript 100日写経（92日目）
Cookieへの書き込み。https://t.co/exuwDT2aiY pic.twitter.com/crmCHca2kZ
— FG🐡 (@fuguti) March 10, 2024
JavaScript 100日写経（93日目）
document.cookieを踏まえたうえでこういうの見ると震える。（試してみたけど怖かった。画像は自粛）
クロスサイトスクリプティング(XSS) – とほほのWWW入門https://t.co/gghn1nqPxE
— FG🐡 (@fuguti) March 11, 2024
JavaScript 100日写経（94日目）
JavaScriptと聞くととりあえずGTMで試したくなる身体になる。これはドラッグでバカ毛バードが動く。
「JavaScriptで要素をドラッグして移動する簡単な方法」という記事が初耳だらけだった件 https://t.co/ZcflyLE9yk #Qiita pic.twitter.com/JBMA59s1kB
— FG🐡 (@fuguti) March 12, 2024
JavaScript 100日写経（95日目）
目に見えてわかる非同期処理ないかなあと思ったけどここがもっともわかりやすかった気がする。
実行処理の図を見て「非同期処理」について知ろう – itstaffing エンジニアスタイルhttps://t.co/HTijLFL4kv pic.twitter.com/cS4WIK8bV7
— FG🐡 (@fuguti) March 13, 2024
JavaScript 100日写経（96日目）
色々と魔改造をして日付と時計を作る。貼ったのは魔改造パート。
最初時計パートとidを一緒にしていて全然表示されない…とかやっていた。時計パートはこちらを参照。https://t.co/rmtLQzbtsq pic.twitter.com/D7oJeq37od
— FG🐡 (@fuguti) March 14, 2024
JavaScript 100日写経（97日目）
Chart.jsを使ってグラフを描画する。すげえー！ってなったｗ
しかもヌッと動く。https://t.co/8T3XVJrBLo pic.twitter.com/XHA7FDufJk— FG🐡 (@fuguti) March 15, 2024
JavaScript 100日写経（98日目）
Chart.jsの棒グラフ。素敵な商品情報の価格推移を入れて情報を充実させる。美しい。
カーソルを合わせると項目が表示される。https://t.co/8T3XVJr3VQ pic.twitter.com/F0X5zHy3sH— FG🐡 (@fuguti) March 16, 2024
JavaScript 100日写経（99日目）
BigQueryのデータを出力できないものだろうかと思い諸々設定したけど失敗。難易度が高いｗ 99日目の失敗。 pic.twitter.com/bFbYml8oDP
— FG🐡 (@fuguti) March 17, 2024
JavaScript 100日写経（100日目）
進捗どうですかカウントダウンタイマー。
〜JavaScript 100日写経・完〜https://t.co/79J6DpzhcR pic.twitter.com/7D3uIfDIqH— FG🐡 (@fuguti) March 18, 2024
まとめ
普段頻繁にJavaScriptを書くような仕事ではないので忘れてしまう部分も多いです。
ただ概念的なところは覚えていたりするので、仕事で触れることがある方にはおすすめです。
ブログへのサポートのお願い（アマゾンギフト）
いつも「バカに毛が生えたブログ」をご愛読いただきありがとうございます。
現在、このブログは皆様のおかげで無料・広告なし（※）で運営しております。
※AdSenseはセンシティブ判定されてしまうため、広告を掲載できません。
ブログの継続とさらなる充実のためご支援をお願いします。
支援は一度限りのショット支援として、¥15から可能です。
いただいた支援は、以下のような形で活用させていただきます：
- サーバー費用やサイトの維持
- 新しいコンテンツの作成
- モチベーション
ご希望の方はスパチャ読みをいたしますので、その旨をお知らせください。
ご支援はより良いブログを提供するための力になります。
こちらのメールアドレスを送信先にしてください。
