Web app that suggests clothing based on temperature and weather conditions.
https://weather-wear-zeta.vercel.app/
Weather Wear is a web application that suggests what kind of clothing is appropriate based on the temperature in your current location. If you open Weather Wear before going out, you can determine at a glance what you should wear.
My room is in the basement. So there is always a big difference between room temperature and outside temperature. When I change my clothes before going out, I always need to open the weather application, check the current temperature, and imagine what to wear based on the temperature. I wanted to make the process a little easier, so I created this application. The difference between this application and other common weather applications is that it directly suggests a guideline for what to wear, rather than the temperature or weather conditions. This saves you a little time in checking the temperature and thinking about what to wear based on that.
This is an example of a component in this app.
type PageProps = {
apiKey: string
}
export const getServerSideProps: GetServerSideProps<PageProps> = async () => {
const apiKey = API_KEY
return {
props: {
apiKey,
},
}
}
const StyledDiv = styled.div``
type Props = PageProps & {...}
const Component = (props: Props) => {
const { data, error, isLoading, isValidating } = useData(props.apiKey)
const dispatch = useAppDispatch()
// Use redux toolkit for global state
const globalState = useAppSelector(selectGlobalState)
// Use useState for local states
const [localState, setLocalState] = useState<string>('')
const exampleLogic = () => {
/* Do something */
dispatch(exampleAction(arg))
}
return (
<StyledDiv>
{...}
</StyledDiv>
)
}
.
components
common
...
layouts
...
pages
...
constants
...
hooks
data
...
...
pages
_app.tsx
_document.tsx
api
...
...
public
services
...
stores
...
styled.d.ts
styles
...
types
...
utils
...