⚙️ Global Weather Dashboard

Implemented a global weather status board using Next.js and NextUI.

📢 [Overview]

• It provides information such as time, temperature, wind temperature, wind temperature, humidity, wind direction, sunrise, sunset, UV index, fine dust, visible distance, atmospheric pressure, and map (Google Map) around the world, which are linked to the OpenWeathermap API.
  
  

🛠️ Stacks

🚩 [Objective]

• It was made to prepare umbrellas to avoid the rain when traveling abroad or working outside the office.
• It is serviced in Korean because I made it for use. (It plans to support I18N (Internationalization) in a global weather-like manner.)
• I also support a RWD(Responsive Web Design) to be useful on mobile.

🛠️ [Technologies]

• Next.js: Next.js is an open-source web development framework built on Node.js that enables react-based web application functions such as server-side rendering and static web page creation.
• React.js: React is used to create a user interface as part of the JavaScript library. It is maintained by Facebook and the community of individual developers and companies.
• Radix UI: Components, icons, and colors for building high‑quality, accessible UI. Free and open-source.
• Tailwind css: Tailwind CSS is an open-source CSS framework.
• OpenWeatherMap: This is an online service owned by OpenWeather Ltd that provides weather data from all over the world, including current weather data, forecasts, current broadcasting, and past weather data through the API.
• Vercel: Vercel Inc. (formerly ZEIT) is an American cloud platform as a services company. The company maintains the Next.js web development framework.

🙏 Special Thanks

• Powered by Open Weather Map API [https://openweathermap.org/api]
  
• Powered by Google Map API [https://developers.google.com/maps/get-started]
  

⚙️ [Instructions]

1.Install dependencies

You can use one of them npm, yarn, pnpm, bun, Example using npm:

npm install

2.Use the nextjs-app

"-- turbo" option is available for Next.js v14 and later.

npm run dev
or
next dev --turbo

3.Run the development server

npm run build
or
next build

📌 [Advanced Features]

• It searches cities around the world and provides weather information.
  
• It provides a variety of weather information.(time, temperature, wind temperature, wind temperature, humidity, wind direction, sunrise, sunset, UV index, fine dust, visible distance, atmospheric pressure)
• Currently, we only support Hangul, but we will support i18N in the future.
• It supports cross-browser and RWD(Responsive Web Design).
• It supports dark mode and white mode.

💻 [Demo and Preview]

[Live Demo]
https://weather-dashboard-nine-steel.vercel.app/

[Desktop Chrome]
The map is being implemented.


[Mobile iPhone15 Pro Safari]

🔑 [License]

Licensed under the MIT license.