No description
  • TypeScript 88.9%
  • JavaScript 4.6%
  • Dockerfile 3.1%
  • HTML 2.4%
  • CSS 1%
Find a file
2026-02-13 15:41:45 -05:00
.github/workflows fix: add missing workflow env 2026-01-07 17:26:02 -05:00
public init vite svg 2026-01-06 17:10:17 -05:00
src fix: adjust current weather time for larger text size and spacing 2026-01-07 23:49:22 -05:00
.dockerignore init dockerignore 2026-01-07 17:13:33 -05:00
.gitignore init gitignore 2026-01-06 17:09:49 -05:00
commit_test test signed commit 2026-02-13 15:41:27 -05:00
Dockerfile feat: create dockerfile with web-proxy 2026-01-07 17:20:07 -05:00
eslint.config.js init eslint config 2026-01-06 17:10:34 -05:00
index.html feat: set dark mode for html document 2026-01-07 20:41:55 -05:00
package.json init package 2026-01-06 17:09:01 -05:00
pnpm-lock.yaml init package 2026-01-06 17:09:01 -05:00
README.md feat: add demo link to readme 2026-01-08 14:17:33 -05:00
tailwind.config.js feat: create tailwind config to set darkmode class 2026-01-07 20:40:31 -05:00
tsconfig.app.json init tsconfig 2026-01-06 17:08:15 -05:00
tsconfig.json init tsconfig 2026-01-06 17:08:15 -05:00
tsconfig.node.json init tsconfig 2026-01-06 17:08:15 -05:00
vite.config.ts init vite config 2026-01-06 17:08:21 -05:00

Capstone Project 1

Fetch current weather forecast in any US city of up to 7 days in advance, with the default being Huntsville Alabama where the largest NASA center is located!

Setup instructions

  1. Clone the repo using git clone https://github.com/maxpeterkaya/capstone_project1.
  2. Install all dependencies by running pnpm i, or npm install if you're just using npm.
  3. Run the project by executing npm run dev.

APIs Used

The API that is being utilized is open-meteo.

  • https://api.open-meteo.com/v1/forecast is used for retrieving weather data based on coordinate location.
  • https://geocoding-api.open-meteo.com/v1/search is used to retrieve the coordinates of a user-input city in the US. The API supports a number of other countries but due to project simplicity I chose to avoid the extra user-input for ease of use.

Challenges

Designing the flow of elements and trying to organize everything neatly to look polished. I've usually always had luck with setting dark mode through the dark class with TailwindCSS but it just wouldn't work at all, maybe because this time I'm not using a component library.

Live Demo

A live demo of this project can be viewed at project1.maxkaya.com.