React JS Project Tutorial ( Weather App ) - Tanstack Query, Shadcn, Recharts, Tailwind, Typescript

Link to Buy affordable Hosting from Hostinger: https://www.hostg.xyz/SHF5k
Use coupon code "ROADSIDECODER" and get an additional 10% discount.
➡️ My Frontend Interview Course - https://roadsidecoder.com/course-details (50% Discount)

Build a Weather App in React JS with Tailwind CSS, Tanstack Query, Tyoescript, Recharts, Openweather API and Shadcn UI Tutorial. This is an amazing project for your resume which will impress recruiters a lot and showcase your skillset.

🔗 React JS Interview Series -
https://www.youtube.com/playlist?list=PLKhlp2qtUcSYQojD5G-ElgHezoCyq2Hgo

➡️ Source Code - https://github.com/piyush-eon/tanstack-query-weather-app
➡️ Book a mentorship call with me - https://topmate.io/roadsidecoder
➡️ Learn to code with Scrimba - https://v2.scrimba.com/?via=roadsidecoder

👤 Join the RoadsideCoder Community Discord -
https://discord.gg/2ecgDwx5EE

🔗 React Query Tutorial -
https://www.youtube.com/watch?v=k1tus-TmqCE

🔗 Full Stack React Projects -
https://www.youtube.com/playlist?list=PLKhlp2qtUcSZBJxjXbHBkE_3h5E31dDiu

🔗 MERN Stack Chat App Tutorial -
https://www.youtube.com/playlist?list=PLKhlp2qtUcSZsGkxAdgnPcHioRr-4guZf

🔗 Complete Data Structures and Algorithms with JS Course -
https://www.youtube.com/playlist?list=PLKhlp2qtUcSZtJefDThsXcsAbRBCSTgW4

🔗 JS Interview Series -
https://www.youtube.com/watch?v=oUWRxJ19gfE&list=PLKhlp2qtUcSaCVJEt4ogEFs6I41pNnMU5&index=1

🔗 Cars24 Interview Experience -
https://www.youtube.com/watch?v=vxggZffOqek&list=PLKhlp2qtUcSb_WQZC3sq9Vw3NC4DbreUL&index=2

🔗 Unacademy Interview Experience -
https://www.youtube.com/watch?v=abbdJ4Yfm54

🔗 Tazorpay Interview Experience -
https://www.youtube.com/watch?v=q-ylRxSxGcY

🔗 React Beginner's Project Tutorials -
https://www.youtube.com/playlist?list=PLKhlp2qtUcSa_rX7glmB7HyFsEOEQa0Uk

#reactjstutorial #frontend #ReactJS
-------------------------------------------------------------------------

00:00:00 Intro
00:00:47 Setup React + Shadcn UI
00:06:42 App Routes and Layout
00:14:49 Hostinger Account Setup
00:17:46 Header Component
00:20:47 Dark / Light Mode Toggle
00:23:38 Setup React Query
00:26:30 API Configuration
00:30:40 API Endpoints
00:42:35 Fetching Current Location
00:56:10 Creating Queries for weather API
01:08:14 Current Weather
01:19:36 Houly Temprature Chart
01:30:16 Weather Details
01:36:43 5 Day Forecast
01:45:52 Search City Popup
01:57:43 Search History
02:12:40 City Page
02:16:55 Add to Favorite
02:28:17 Render Favorites on Dashboard
02:37:47 Deployment

-------------------------------------------------------------------------

⭐ Support the channel -
https://www.youtube.com/channel/UCIPZVAwDGa-A4ZJxCBvXRuQ/join

Special Thanks to our members -

Видео React JS Project Tutorial ( Weather App ) - Tanstack Query, Shadcn, Recharts, Tailwind, Typescript канала RoadsideCoder