🌤️ T 없이 맑은 날

날씨와 대기환경을 한눈에 확인할 수 있는 웹 애플리케이션
🔗 배포 URL: https://your-url.com 
🔗 GIT URL: https://your-url.com 

🙋 프로젝트 소개

t 없이 맑은 날은 날씨와 대기환경(미세먼지)을 표출해주는 웹 애플리케이션이다.
React.js로 개발되었으며, 공공데이터 포털 API(기상청 날씨, 에어코리아 미세먼지)를 통해 데이터를 불러오고, 구글 맵을 통해 시각적으로 표출했다.

주요 화면

1. 날씨 현황 화면

2. 대기환경 현황 화면

🌱 개발 동기

React.js를 처음 배우고, 간단한 프로젝트를 직접 만들어보며 익혀보고 싶었다. 주제를 고민하던 중, 이전에 환경 데이터 표출 관련 업무를 했기 때문에, 자연스럽게 날씨와 미세먼지 데이터를 시각화하는 서비스를 만들어보기로 했다. 복잡한 기능보다는 React의 기본기를 다지는 데 집중하며, 최대한 가볍고 심플하게 구현하는 것을 목표로 했다.

🛠️ 사용 기술

💬 후기

이 프로젝트는 React.js 공부 목적으로 가볍게 시작한 프로젝트이다.
공공데이터 포털 API와 구글 맵을 활용해 데이터를 화면에 표출하는 방식을 직접 구현해보는 데 초점을 맞췄다.

겪었던 문제와 해결 과정

처음에는 Promise를 사용해 지역별 데이터를 순차적으로 호출했는데, 이로 인해 초기 데이터 로딩 시간이 길어지는 문제가 발생했다.
이를 해결하기 위해 Promise.all을 도입해 여러 API 요청을 병렬로 처리하도록 개선했고, 로딩 속도를 크게 단축할 수 있었다.

아쉬웠던 점

처음에는 PC 화면만을 고려하고 개발을 시작했다가, 이후 반응형 웹으로 전환하는 과정에서 문제가 생겼다.
PC에서 호버(hover)로 동작하던 기능이 모바일에서는 클릭으로 동작하게 되어 UX가 어색해졌다.