6月の挑戦記
はじめに
こんにちは、けいたです。
早いもので、2025年ももう半分が終わりました。
今年は年始からたくさんの挑戦をして、環境を大きく変えてきました。
近年にはなかった人生の充実感を感じています。
これからもどんどん、自分が成長できることに挑戦していきたいと思います。
先月の振り返り
今月は、先月末から作り始めたポケモン図鑑を完成させました。
その他には、
-
JavaScriptの非同期処理の復習
-
Linuxの復習
-
Git/GitHubの復習
-
HTML/CSSの復習
など、たくさんの復習に取り組む月となりました。
以前学習して身についていた技術でも、忘れていることが少なからずありました。
改めて、復習の大切さを身をもって実感しました。
先月の目標の達成度
-
学習時間120時間以上（1日あたり4時間）
→ 達成！！ 150時間（1日あたり5時間） -
Qiita記事3記事公開
→ Qiita記事2記事公開（1記事足りなかった） -
アウトプット（ポケモン図鑑完成）
→ 完成！
総評
80点！
今月の学習内容
ポケモン図鑑作成
機能
主な使用技術
-
JavaScript（React）
アウトプット
JavaScript 非同期処理
-
Promise構文
-
async/await構文
-
ジョブ、キュー
-
try/catchで処理を分岐
アウトプット
-
Qiita記事を公開
Linux復習
-
標準入力・標準出力・標準エラー出力
-
シェルの理解
-
ディストリビューションとカーネルの違い
-
仮想環境構築（開発環境：Mac M1以降）
アウトプット
-
Qiita記事を公開
git/GitHub復習
-
データ構造の理解
-
基本的なコマンドの復習（git status, git add, git commit, git push, git pull）
-
実践的なコマンドの理解（git rebase, git commit --amend）
-
GitHub Flowの実践
HTML/CSSの復習
-
セマンティックタグについて
-
レスポンシブデザインの考え方
- Gridレイアウト
- 相対単位の設定（em, rem, %など）
アウトプット
成果物・アウトプット紹介
ポケモン図鑑
JavaScript非同期処理
Linux復習
HTML/SCCの復習
気づき・思考の変化
-
これまで独学で学習してきたLinux、Git、HTMLやCSSなどの個々の技術が徐々に紐づいてきて、Web開発に対する解像度が上がってきていると感じました。
-
プログラミングを学習し始めてもうすぐ2年が経とうとしています。
そろそろ転職を意識して、ポートフォリオの作成に本格的に取り組んでいきたいと考えています。
来月の目標宣言
編集後記・雑記
毎月振り返りを行うと、学習中は「本当に身についているのかな？」と感じることもありますが、こうして振り返ると膨大な学習時間と内容に自分でも驚きます。
また、学んだ技術をブログなどでアウトプットすることで、確実に自分の力になっていると実感できます。
今後もこの習慣を続けていこうと思います。
おわりに／次回予告
先月は宣言通り、ポケモン図鑑を完成させることができました。
来月はいよいよ、転職に向けたポートフォリオ ver.01が完成するかも……
いや、必ず完成させます！
来月も「プログラミング挑戦記」お楽しみに〜〜👋
5月の挑戦記
はじめに
こんにちはけいたです。
HappinessChain入って1ヶ月半が経ちました。充実していると時が経つの
早い早い。学習のスピードも同じぐらい早いといいのにって思っちゃいますw
今月はインプット、アウトプットの量も十分にできていて転職に向けて大きく進めることができた1ヶ月になりました。
その1ヶ月を振り返っていきます
- はじめに
- こんにちはけいたです。HappinessChain入って1ヶ月半が経ちました。充実していると時が経つの早い早い。学習のスピードも同じぐらい早いといいのにって思っちゃいますw
- 今月はインプット、アウトプットの量も十分にできていて転職に向けて大きく進めることができた1ヶ月になりました。その1ヶ月を振り返っていきます
- 先月の目標・達成度
- 今月の学習内容
- 成果物・アウトプット紹介
- 技術Tips
- 感想
- 来月の目標宣言
- 編集後記・雑記
- おわりに／次回予告
先月の目標・達成度
・Reactを用いてAPIを叩いてデータを取得するアウトプットを作る
→ ポケモン図鑑（アウトプット）を作成し始めましたが、完成はしていません
・技術記事を3記事作成する
→ 3記事達成！！
※記事については後述します
・勉強時間を100時間以上確保する
→ 170時間（達成！！）
総評
70点
今月の学習内容
vim
・vimの基本操作について
・vimを使ってQiita記事作成
プロになるためのWeb技術入門
・Web技術の基本（URL・HTTP・レスポンス・リクエスト）
・Web技術が発展した過程
ポケモン図鑑作成
・Reactを使用
・一覧表示
・pokeAPIにfetchでリクエストをしてポケモン一覧を取得
・初期表示は20匹表示
・無限スクロール
・ReactフックのuseStateを使用して次の20匹ポケモンを取得して表示
・JavaScriptのdocumentのメソッドを使って（現在のスクロール位置、
画面の高さ、ページ全体の高さ）画面のスクロール位置を検知し、
次の20匹のポケモンを取得
・取得するデータが重複しないようにuseRefとSetインスタンスを使って実装
成果物・アウトプット紹介
Qiita記事
Reactナニソレおいしいの？と思っているそこのあなたへ
Vimが難しいって固定概念をあなたの中から無くします
web技術の基本って？
コーディング
技術Tips
・JavaScriptのプロパティ名にハイフンが入っているときの指定方法
data.sprites.other["official-artwork"].front_default // 正しい書き方（動く）
data.sprites.other.official-artwork.front_default // 間違った書き方（エラーになる）
・TailwindCSSでdisplay:none⇔display:blockを切り替える方法
```code.js
<div className="relative group"> //groupを追加
<img
src={iconItem}
alt={name}
className=" hidden group-hover:block" /> // group-hover:でスタイルを指定
```
・無限スクロールと重複について
無限スクロール
```code.jsx
const [isLoading, setIsLoading] = useState(false);
useEffect*1;
//既にデータがない場合のみデータを追加する
if (fetchedIdsRef.current.has(_id)) return; fetchedIdsRef.current.add(_id);
```
感想
今月はQiita3つの記事を公開した。自分の中ではどれも魂を込めて作成したので
どれも良質な記事に仕上がっていると思います。なかでも、月末に公開した記事「Web技術の基本って」についてはたくさんの方に読んでいただき、いいねもたくさんもらえました。とても励みになりました。
また、自分的にもWeb技術の基本の理解が深まりました。また来月も複数記事を書けるようにインプットしていきたいと思います。
ポケモン図鑑の作成については初めてReactを使って開発するアウトプットなので
苦労をたくさんしながら進めていこうと思います！！
来月の目標宣言
・学習時間120 時間以上（1日あたり4時間）
・Qiita記事3記事公開
・アウトプット（ポケモン図鑑完成）
編集後記・雑記
ブログは技術記事を書くことは大変です。
そこでなぜ大変か？を冷静に考てみました。
・人間は忘れる生き物
・30日間の学習内容を記憶することは不可能
・1日の学習を分かったフリをしてしまう
主にはこの3つかなと思います。
そこで、僕はやった工夫は
「毎日学習ノートを取る」ことです。
これをやることで学習効率はもちろん、知識の定着が抜群になりますよ
おわりに／次回予告
来月はポケモン図鑑作成の苦労日記みたいなのが書けるかな？？
日々インプット・アウトプットしていきます！！
来月もお楽しみに〜〜👋
*1:) => {
const handleScroll = () => {
//現在の画面のスクロール位置（ページ一番上）
const scrollTop = document.documentElement.scrollTop;
//表示されている画面の高さ（使用デバイスによって変わる）
const widowHeight = window.innerHeight;
//ページ全体の高さ
const fullHeight = document.documentElement.offsetHeight;
//スクロール位置の下端 >= ページの下端 - 少し余裕
if (scrollTop + widowHeight >= fullHeight - 300 && !isLoading) {
getAllPokemons();
}
};
window.addEventListener("scroll", handleScroll);
// クリーンアップ（メモリリーク防止）
return () => {
window.removeEventListener("scroll", handleScroll);
};
}, [isLoading]);
```
重複防止
```code.jsx
//UIに関係がないデータなのでuseRefで裏でデータを管理
const fetchedIdsRef = useRef(new Set(
4月の挑戦記
はじめに
HappinessChain入って2週間と少し経ちました。
まじで一瞬で過ぎさりました。
Time is mony ではなく Time is Life です
「何か挑戦を始めると1日の時間増やして欲しい」と思う今日このごろ。
それでは先月を振り返っていきます！！
自己紹介
みなさんこんにちはkeitaです。
18歳で社会に出て23歳で結婚し現在子どもが2人います。
ほんの2年前（27歳）の時までは一生会社員で「可もなく不可もなくテキトーな人生を送ればいっか〜」と思ってました。あるyoutuberに出会うまでは…
2年前から人生を変えるべくプログラミングに『挑戦』しました。
当時は独学で、失敗、挫折の雨嵐でした。
なんとか2年間続いたものの転職をする未来見えなくてXを眺めていた時、
ふと目に止まったのが、HappinessChain代表ゆうだいさんのセミナー特典に関するポストです。
セミナーを受けた時の衝撃は今でも覚えていますが脳みそに雷が落ちました。
次の日にHappinessChainの説明を受け入会しました。
その日が 4月13日 です。
その日から "HappinessChain" で「挑戦」をはじめました。
※僕の人生の転機になった出来事の詳細についてはまたどこかで記事にします。
乞うご期待！！
今月の目標の達成度
今月は月目標を宣言していないので割愛
今月の学習内容と学習時間
学習時間【75時間】
Progate
Ruby on Rails
MVCフレームワーク（モデル・ビュー・コントローラー・（ルーティング））であるRailsの基本的な一連の処理をCRAD操作やログイン（認可・認証）操作を実際に実装を通して学びました。
Javascript（ES6)
定数・変数・配列・this・クラスの基本的なことから学びました。
this以外はどの言語でも共通で使える仕様だと思うので概念を理解することを目的に学習しました。
React
ProgateではReactの前のバージョン（オブジェクト型）の学習でした。
State(状態管理)とprops(値のバケツリレー)のみを用いて実際のウェブアプリケーションを作成し、動的に変わるお問い合わせフォームの実装をしました。
成果物・アウトプット紹介
気づき・思考の変化
・今月は主にProgateでの基礎固めをしました。独学で約2年やってきたので
ある程度理解できていると思っていましたが、
軟弱な基礎の上に知識を積み上げていることに気づきました。
・今まで教材を買って写経してインプットしただけでアウトプットして
こなかったので知識の定着が弱いと感じました。
・最高のアウトプットはサービス開発→技術記事のアウトプットだと
今回実感した。
これからはアウトプットすることを目標にインプットをしていこうと思った。
・Progateは初めて言語を学ぶ時の入口として最適だと思った。
良かったこと
・技術記事を書くことができた
・毎日Xでアウトプットできた
・家だけでなく場所を変えても勉強することができた
悪かったこと
・勉強にコミットする時間が少なかった
・日々の日報がやっつけ作業になってしまっていた
来月の目標宣言
・Reactを用いてAPIを叩いてデータを取得するアウトプットを作る
・技術記事を3記事作成する
・勉強時間を100時間以上確保する
雑記（小話）
今月の中旬にAndroidスマホからiphone16に変えた話
2年前に某youtuberの影響でタイプCで充電できないことを理由でIphone12からOPPOに変えた。仕様当初は見た目もIphoneに似ていてスタイリッシュだったので問題なく使っていた。しかし3ヶ月たったある日異変が起きた。
何をするのも動作が遅い。電話がならないことが多々ある。通知が来ない時がある。SuicaやPayPayへのチャージが遅い。 上げれば切りが無い…
スマホを使うのがストレスでほとんどの作業はPCに頼っていた。
そして先週Iphone16に変えました。これまでのストレスが全てなくなりました。
早く変えればよかった〜
「いやーみなさんApple最強ですよ。投資しましょう」
これだけで1日30分は短縮できたと思います。Iphoneを買うことは投資です
Androidを使っている人は今日、今から直ぐにAmazonでポチりましょう！！
おわりに／次回予告
来月は今月に負けないくらいの激アツなアウトプットしますよー
みなさんお楽しみにー👋👋
