🌤 Follow along as I build a Next JS weather app styled completely in Tailwind CSS. I am learning Next JS so I find it helpful to build multiple applications using a certain tool. We will be using axios to make the API call to the Open Weather Map servers and return JSON data that we will be rendering on the screen. In this video we will use conditional rendering in javascript, Image component in Next, API calls, Tailwind CSS and more.
🙏 Thank you for following along and please let me know what you think in the comments below!
🏆 Next JS App
🏆 Tailwind CSS
🏆 Axios API Calls
🏆 https://openweathermap.org/api - OpenWeatherMap API
❤️ Support the Channel
https://www.buymeacoffee.com/clintbriley
Instagram 💪
https://instagram.com/fireclint
⏰ Timestamps
00:00 Start
00:21 - App Demo
01:00 - Create next-app
01:21 - Install Tailwind CSS
04:20 - OpenWeatherMap API Key
07:32 - Install Axios & React-Icons
8:50 - Add state
09:30 - Fetch Weather Data
14:22 - Image Component (External)
20:00 - Search UI & Functionality
36:00 - Weather UI & Conditional Rendering
48:40 - Deploy & Hosting Video
💻 GitHub Repo 💻
https://github.com/fireclint/nextjs-weather-yt
🔥 My Coding Equipment 🔥
Logitech MX Wireless Keyboard - https://amzn.to/3xKPFiN
Logitech MX Master 2S Wireless Mouse - https://amzn.to/3O5WmRD
SAMSUNG 49-Inch Gaming Monitor - https://amzn.to/3mvUy8M
Shure MV7 USB Podcast Microphone - https://amzn.to/3O00nqG
Mic Boom Arm - https://amzn.to/3NHn6YU
Monitor Desk Light Bar - https://amzn.to/3xzKlyj
