The weather application, developed using Next.js 13, GraphQL, TypeScript, Tremor, Stepzen, and Tailwind CSS, allows users to select a country and city to retrieve detailed weather information. It provides temperature, date, time, forecast, maximum and minimum temperature, UV index, wind speed, wind direction, chance of rain, and humidity levels. The application is designed to be responsive, ensuring optimal display and functionality across different devices and screen sizes.
This is a Next.js project bootstrapped with create-next-app.
npx create-next-app@latest weather-appgit clone https://github.com/nikul6/weather-app.gitand then install node-modules
npm installSign up for StepZen: Go to the StepZen website and sign up for an account. Install the StepZen CLI: Install the StepZen command-line interface (CLI) by following the installation instructions provided in the StepZen documentation.
Run the development server:
npm run dev
# or
yarn dev
# or
pnpm devOpen http://localhost:3000 with your browser to see the result.
You can watch the video here
To learn more about Next.js, take a look at the following resources:
- Next.js Documentation - learn about Next.js features and API.
- Learn Next.js - an interactive Next.js tutorial.
- Learn TailwindCSS: Docs
- Apollo Client: Docs
- Tremor: Docs
- React Select: npm
- Country-city-state API: npm
You can check out the Next.js GitHub repository - your feedback and contributions are welcome!
The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.
Check out our Next.js deployment documentation for more details.