記事一覧
ReactのTooltipについて
自作したチャットアプリ（https://queryroom-9178b.web.app/login）を隙間時間を見計らってアップデートしてる際に、Reactの新たな知識を仕入れたので、アウトプットしてお…
FireBaseの開発で盛大にやらかした話
こんにちは😀
数日前から家計簿のWebアプリ開発に取り掛かっています。
我が家の家計簿はこれまでExcelで非常にアナログだったので、今後ずっと使い続けることを想定して、拡張性が高くスマホからでもアクセスできるようにブラウザベースのアプリケーションで作ろうと思いました🤔
技術スタックは私の中ではお馴染みの下記です！
フロントエンド： React+TypeScript
バックエンド： Fi
ReactのTooltipについて
自作したチャットアプリ（https://queryroom-9178b.web.app/login）を隙間時間を見計らってアップデートしてる際に、Reactの新たな知識を仕入れたので、アウトプットしておきます〜。
Tooltipとは・・・？
チャットアプリでよくある、ユーザーのアイコンをホバーしたらユーザー名やアドレスが表示されるやつ！の実装をしていました。
通常のWeb制作ならjQueryで
チャットアプリをリリース！
開発に没頭しており、note更新が疎かに・・・😭
ただ、遂に個人開発したブラウザアプリ「QueryRoom」をリリースしましたー！開発に至った経緯など詳細は前回の記事に書いてあるので、ご覧いただければと思います！！
👇実際のアプリがこちらになります〜〜！
まだ、正直満足はしてないのです。
独自ドメインを取得していなかったり、チャットアプリとしては機能が不足している面もあり・・・リリースを
Web開発勉強日記 🧸その9🧸〜雑記〜
Udemyの講座も終盤に入ってきたので、今までCodeSandBoxでコードを書いていましたが、慣れ親しんだVS CODEでReact✖️TypeScriptの環境を構築しました！！
ReactやTSをインストールするのは一瞬ですがESlintやPrettierのインストールや初期設定が中々大変だった・・・。
手順も長く難しかったため、ググりつつ自分の極秘Notionに手順書を作成しました！後
Web開発勉強日記 🧸その8🧸〜カスタムフック〜
昨日に引き続き今日もReact！React！
ちょっとずつ感覚でコードが打てるようになってきたぞ
本日の学び✍️今日はカスタムフックについて学習しました！
カスタムフックとは
コンポーネントに直接処理を書くのではなく、1つの機能を1つのファイルに切り出してフックスとして定義した関数のことだと理解しました！
メリット
複数のReact Hooksを1つの関数内でまとめることができる。
使
Web開発勉強日記 🧸その7🧸〜TypeScript〜
お、お久しぶりです！！
先週は本業の疲れからか学習をサボってしましました！
2週間ぶりに学習したので、アウトプットしていきますー！
本日の学び✍️前回に引き続きTypeScript（以下、TS）について学習しております。
TSは現代のフロントエンド開発では必須と言われているそうなので、しっかり学ばないといけなさそうですね。。。
ただ僕みたいにカオス(w)なコードを書く人にとっては、TSで規律性や
Web開発勉強日記 🧸その6🧸
本日2本目のアウトプットはTypeScriptについてです！
2本目なので余談は無しで！！
そして学習してたらいつの間にかこんな時間に・・・！
眠い！
本日の学び✍️冒頭でも書きましたが本日午後はTypeScriptについて学びました
TypeScriptとは
TypeScriptはJavaScript（以下、JS）を静的に型付けしたプログラミング言語です。通常のJSは動的型付け言語であり、
Web開発勉強日記 🧸その5🧸
とりあえず午前中に学んだことをアウトプット！！
恒例の余談ですが・・・
GPTsにてポートフォリオ作成をサポートしてくれる先輩を召喚しました！
名前は「パイセン」、性格は社内にいる優しい先輩風で自己肯定感を上げてくれる・・・と他にも細かく性格を設定してみました。
早速、ポートフォリオのアプリを作るにあたってのサポートをしてくれているので、ありがたい🥹
AIなのでお礼の品とかをプレゼントできなく
Web開発勉強日記 🧸その3🧸
昨日に引き続き今日もがっつり学習しました！
例の通り今日のサムネもDALL-E3に作ってもらいました〜。
サムネを生成する過程も楽しい😆
多分これからしばらくは生成してもらうかも。
本日の学び✍️本日は1日中AtomicDeignを活用したコンポーネントの分割をしていました。
AtomicDesign
そもそもAtomicDesignとは・・・
アトミックデザインと読む・・・
かっこいい・