はじめに
初めまして、UX/UIデザイナーとして活動しているKikoといいます。
デザインエンジニアになることを目標に今年の1月からReactの勉強を始めました！
自分の簡単な自己紹介はこちら👇
3ヶ月でやったこと
ReactとTypeScriptを使ってミニアプリを開発し、最終的には CI/CD の構築まで行いました。
1-2ヶ月目はCSS などの装飾を行わず、React の基本を押さえたシンプルなアプリを作成しました。
そして今回はそのベースをもとに、React Hook Formや React Testing Libraryなどを取り入れながら、実践的な機能を段階的に追加していきました。
使用言語
- React
- TypeScript
バックエンド / DB
- Supabase
テスト
- Jest
- React Testing Library
UI / フォームまわり
- Chakra UI
- React Hook Form
ビルド / 開発環境
- Vite
- Firebase Hosting
苦戦したこと
TypeScript のtypeやclassといったオブジェクト指向の概念を理解するのに苦労しました。
また、テストを進める段階で設計の甘さに気づきテスト直前で慌ててリファクタリングを行うなど、見直しが多く発生しました。
しかし突然サービスを終了しても依存が少ないUIを提供できるように設計する という開発においてかなり大事なことが早い段階で学べて良かったです。こういった体験はコミュニティに所属する恩恵だと感じました。
課題での気づき
この課題を進める中での気づきは初歩的なものであっても、随時記事にまとめていきました。
AIとの向き合い方
今回もがっつりAI（chatGPT4o）を使いました。
React専用のGPTsを作り、キャンバスでラリーをしながらコードを書いていきました。
AI補助無しでやるのもありだと思いますが、プログラミング経験のあまりない初学者には現状の自分では辿り着けない概念を使わなければならない場合もあるので、その点においては諸学者がAIを導入することはやはり欠点より利点の方が優ると思いました。とんでもない方向で進めてしまってスタックし、モチベーションが下がることを回避できるからです。
とはいえ何でもかんでもAIに聞くと身にならないので、悩む時間は決めてから（私の場合は15分）取り組みスタックしたらAIへ聞くようにしました。
Next Step
いよいよ次回から個人開発を見越して、自分の作りたいアプリの像を詰めていくことになります。
なので少しずつでも運用前提で設計できるように意識していきます。開発は誰かが使ってくれることがゴールなので、少しずつ練習から本番へとマインドセットをシフトさせていきたいです。
JISOUのメンバー募集中！
プログラミングコーチングJISOUでは、新たなメンバーを募集しています。
日本一のアウトプットコミュニティでキャリアアップしませんか？
興味のある方は、ぜひホームページをのぞいてみてください！