【2024年】React環境構築を1から丁寧に初めてみよう【viteを利用】

#入門 #react #vite #nodejs #vitest #test #eslint #prettier #tailwindcss #shadcn #webエンジニア #独学 #プログラミング

00:00 イントロ
03:32 vite環境構築開始
07:28 パスエイリアス
10:43 vitest
21:18 eslint
26:40 prettier
30:00 husky & lint-staged
36:44 storybook
44:14 tailwindcss
47:03 shadcn/ui
49:29 github actions
57:18 終わりに

※今回の参考文献
https://zenn.dev/kazukix/articles/react-setup-2024
https://zenn.dev/tentel/articles/488dd8765fb059
https://ja.vitejs.dev/guide/static-deploy.html

AI駆動開発マスター講座が早期リリースされました🎉
https://ai-driven-online-course.vercel.app
Youtube視聴者限定15%割引のクーポンコードはこちら👇
【ai-master-shincode】

＼ プログラミング×AIで人生を変える50講座 ／

✨3つの特徴
✅ 実践的な50講座が見放題
✅ プログラミング×AI×副業ビジネスも学べる
✅ 質問し放題のDiscordコミュニティ付き

💫 期間限定キャンペーン実施中！
通常価格：39,800円
▼YouTubeチャンネル登録者限定▼
20%OFFクーポン「shincodepro」使用で
31,840円

50講座のカリキュラムを無料で閲覧できます👇
https://code-s-school-5bc2.thinkific.com/bundles/shincode-pro
-----------------------------------------------------------------------------------------------------------------------------
【Udemy90%割引クーポン発行中🚀】
↓↓↓↓↓
http://shincode.info/2021/12/31/udemy-discount-coupon/
-----------------------------------------------------------------------------------------------------------------------------
おすすめWeb系IT企業はこちら ↓

株式会社WorldHacks（ワールドハックス）
【HP】https://worldhacks.co.jp
【X】https://twitter.com/WorldHacks_Inc【Facebook】https://facebook.com/worldhacks20220324…
採用も拡大中のため、HPやWantedlyの採用基準をご覧の上ご応募ください。

社長の紹介
森下浬（もりしたかいり）
【X】https://twitter.com/kairi_morishita
株式会社WorldHacks代表取締役。
日本体育大学体育学部卒。完全未経験からエンジニアに転職後、株式会社WorldHacksを設立。現在はWeb、アプリの受託開発をメインで行っており、新規のサービス立ち上げから既存サービスの保守運用まで業界問わず様々な企業様の開発を支援。
-----------------------------------------------------------------------------------------------------------------------------
【この動画を視聴するメリット】
・2024年現在のReact開発環境構築が実装できる
・モダンなライブラリのセットアップ方法が分かる

【信頼性】
・Udemy講師
・講師レビュー評価94.6%
・Udemy受講生延べ3000人突破
・Webアプリ/サイト開発数：200以上
・生きがい：プログラミングでサイトやアプリを作ること

★チャンネル登録はこちらから★
https://www.youtube.com/channel/UCNTxclE0N4qsUuirssL_D8w?sub_confirmation=1

★今回のソースコード★
👇のReadMeに手順を載せています。
https://github.com/Shin-sibainu/react-setup-for-yt-2024

★運営者SNS★
Twitter：https://twitter.com/Shin_Engineer

★この動画で使用している機材★
キーボード(Keychron K6 赤軸)：https://amzn.to/3F4zca5
マウス(Logicool G ロジクール G ゲーミングマウス)：https://amzn.to/3DZaaYB
マイク(サンワダイレクト USBマイク PCマイク)：https://amzn.to/30AVwJF
マイクスタンド(Luling Arts マイクスタンド マイクアーム スタンド)：
https://amzn.to/3se5onZ
※アフィリエイトリンクになります。