Checkout the project live here
This is a simple weather app where you can get realtime weather data by choice of city.
Add as many cities as you want to the sidebar and view detailed information by clicking on the card components.
I built this weather app to demonstrate my knowledge in React/NextJS and to showcase my knowledge in fetching data from an API.
For this project, I worked with the following tools:
- React
- NextJs
- Tailwind
- OpenWeather API
I got the design inspiration from my friend Samuel Kraft who has built this awesome running app.
When it comes to making the site responsive for mobile I found it a little bit difficult since I'm only working with a Sidebar and Center component.
I could solve this by letting the end user toggling back and forth between the Sidebar - Center component on mobile devices.
But instead I chose to not put to much effort into the design, rather showcase that I understand how to fetch key data.
For my next project I would like to try axios and fetch data within the getInitialProps since this is best practice.
First, run the development server:
npm run dev
# or
yarn devOpen http://localhost:3000 with your browser to see the result.
This is a Next.js project bootstrapped with create-next-app.