Atsu Portfolio

先日再開したCodeMafiaさんの「【JS】ガチで学びたい人のためのJavaScriptメカニズム」ですが予想通り自分には難しかった…。1/3程進んだところまでは念入りな複数回の視聴で何とか付いていけていたのですが、回を追う毎に分からないことが多くなり過ぎて頓挫してしまいました…。

しかしながらCodeMafiaさんの動画は作り込みや丁寧な説明の印象があり頓挫した私が言うのも何ですが、実は評価が高かったりします。将来もっとJsの理解が進んだとき辞書的な役割を果たしてくれると期待しております。

そして2年以上前勉強会に参加していた際に購入させてもらったじゃけぇさんの「モダンJavaScriptの基礎から始める挫折しないためのReact入門」を思い出しました。

当時別アカウントで動画の購入後に交通事故に合い、大怪我をして手術・入院、完治まで半年以上かかる大惨事に見舞われたため途中のままだったのです。今度はこちらを再開して改めてJavaScriptへの理解を深めたいと思います。

そういえば勉強会を主催されていたじゃけぇさんが広島に行かれるということで、毎月開催されていた勉強会が終わってしまったと記憶しております。もしまた大阪に戻って来られた際は参加したいので催していただきたいですね！

先日始めた「はじめてのJavaScriptプログラミング入門【2022年最新版】」の学習を2周完了したので記事にしました。先日お伝えした通り初学者にも伝わりやすく噛み砕いてもらってる内容でしたが、WordPressの学習時同様やはり1周では理解が浅すぎたので2周学習しました。

2周してもまだまだ理解は浅いですが、動画内で制作したものを理解を深めるため一部構造を変えたりして組み直したりしました。その際、参考に見た人様のコード等がパーツ毎単位ではありますが一部理解できるようになっていた点は少なからず成長を感じることが出来たので嬉しかったです。

これからも学習を続け理解を深めたいと思います。せっかくなので下記に動画で学び制作したものを載せたいと思います。

文字数カウンター

Twitter等で見かける文字数カウンターです。テキストエリア要素やそこに入力された値を取得し残り文字数に出力、入力された時に発生するkeyupイベントを用いて動作しています。改行や空白は文字数としてカウントしないようにreplaceメソッドも調べて用いてみました。

画像ギャラリー

これまで制作したサイトで画像ギャラリーの上位互換とも言えるスライドショー等は「slick」といったプラグインや「jQuery」等で実装したことはありましたが、完全に1からJavaScriptで実装したのは初めての経験でした。

回答を見ずにクリックイベントで配列を用いず自力で実装したところ、HTMLファイルを多く記述しての実装となりました。回答では配列やオブジェクト、要素生成をうまく用い必要最低限のHTMLで実装されていたため学習になりました。

尚、この画像ギャラリーで使用している画像はフリー画像素材で有名な「ぱくたそ」さんからお借りしたものです。

ページトップボタン

当サイトのページトップボタンも元々はプラグインで実装しておりましたが、今回の学習を活かしたいと思いJavaScriptを用いて実装してみました。人様の情報も参照し、scrollのイベントハンドラやwindowオブジェクトを用いました。

様々なサイトで多く見受けられる初期位置では表示させず、最上部から特定の量のスクロールを行った場合のみボタンを表示させる機能もif文を使用し実装しました。

学習の感想と今後

途中でも述べた通り、人様が書いたコードでも基礎的な内容であれば単体単位ではそのプログラムを理解できるようになったことは今回の学習において最大の収穫だと感じました。

一方で回答を見ずにプログラムを組もうとした時に感じたことですが、0からプログラムを設計するのは非常に難しいとも感じました。

今後は前回難解で理解できなかったCodeMafiaさんの「【JS】ガチで学びたい人のためのJavaScriptメカニズム」に改めて挑戦したいと思います。再戦も難しかった場合は再度当動画を見直したり、別の初学者向けの動画も検討しようと考えています！

先日Js学習のため購入した動画は完全初学者の自分には難しかったため、改めて初学者向けの「はじめてのJavaScriptプログラミング入門【2022年最新版】」という動画を購入しました。

現在1周目の学習を終え2周目も終盤に差し掛かった段階ですが、しっかりと基礎から学べる内容となっており自分にも分かり易い内容で非常に満足しております。

2周目では学んだ事の集大成として数取器や文字数カウンター、フォトギャラリーといったものを回答を見ずに1から組めるようになることを目標に進めています。また当動画で制作したものを記事として後日上げたいと思います。

当動画「はじめてのJavaScriptプログラミング入門【2022年最新版】」の制作者は中村祐太氏というプログラミングはもちろん、その教育にも経験豊富な方です。自分のような初学者でも理解できる内容でしたので、JavaScriptを学びたい方にはオススメです。

特にUdemyでは定期的にセールが行われるので、もし購入を検討される場合その期間中にお安く購入してみてはいかがでしょうか。

以前から気になっていたJsの学習を行うため、Udemyで動画を購入しました。近頃は就活、友人の新案件、現在就業しているお仕事、そして今回購入した動画と多忙になりそうですがコツコツ頑張っていきたいと思います。

今回購入した動画はUdemyで現在も販売されている「【JS】ガチで学びたい人のためのJavaScriptメカニズム」と「【2022年最新】【JavaScript＆CSS】ガチで学びたい人のためのWEB開発実践入門（フロントエンド編）」という動画です。