個人開発｜天気予報Webアプリ（テスト駆動開発）

GitHub: https://github.com/Brady-Moore/weather-app
Live App: https://bradyweatherapp.netlify.app/

⚠ 英語版は日本語の下に記載しています。／English version is located below the Japanese version.

使用技術

Next.js / TypeScript / Tailwind CSS / Jest / React Testing Library / VisualCrossing API

外部API（VisualCrossing API）を利用し、リアルタイムの天気情報を表示するWebアプリを個人開発しました。

検索した地域の天気を取得し、

• 現在の天気情報の表示
• API通信を伴うデータ取得処理
• ローディング・エラーハンドリング

を実装しています。

本プロジェクトでは、**テスト駆動開発（TDD）**を意識し、
Jest と React Testing Library を用いて、
コンポーネントの描画やデータ処理が正しく行われることを確認しながら開発を進めました。

UIについては Tailwind CSS を使用し、
デバイスサイズに依存しないレスポンシブな画面設計を行っています。

API連携、非同期処理、テストの導入といった、
Webアプリ開発の基礎を実践的に学ぶことを目的としたプロジェクトです。

Tech Stack
Next.js / TypeScript / Tailwind CSS / Jest / React Testing Library / VisualCrossing API

This is a personal weather forecast web application built using the VisualCrossing API to display real-time weather data.

The app allows users to search for locations and includes:

• Real-time weather data fetching
• API-driven asynchronous data handling
• Loading and error states

This project was developed with a test-driven development (TDD) approach.
I used Jest and React Testing Library to verify component rendering and data handling while implementing features.

The UI was built with Tailwind CSS, focusing on fully responsive layouts to ensure a consistent experience across devices.

Through this project, I gained practical experience with API integration, asynchronous processing, and testing in a production-style frontend workflow.