Typescript로 LocalStorage, 안전하게 쓰자!

by DD
8년 전
조회수 5

LocalStorage 사용 시 Model 인스턴스 유실 문제를 지적하고, DataSource 관점 도입을 제안함

Clean Architecture 기반으로 BrowserStorage 클래스를 구현하여 Model 기반 데이터 관리

BrowserStorageMapper를 통해 JSON 변환 책임을 분리하고, 안정성테스트 용이성 확보

BrowserStorage 아키텍처 상세

Clean Architecture를 기반으로 Data LayerBrowserStorage를 위치시켰다. 구체적으로 BrowserStorage 클래스는 keymapper를 주입받아 get(), set(), clear() 메서드를 제공한다. 따라서 Model 기반의 데이터 관리와 오류 처리가 용이해진다.

BrowserStorageMapper의 역할

BrowserStorageMapperLocalStorageModel 사이의 변환을 담당한다. fromJson()toJson() 메서드를 통해 JSONModel 간의 상호 변환을 수행한다. 반면, Mapper를 사용함으로써 ModelLocalStorage는 서로의 구현 세부 사항을 알 필요가 없어진다.

안정적인 LocalStorage 사용을 위한 조언

LocalStorage를 DataSource 관점에서 접근하여 Model 기반으로 데이터를 관리해야 한다. 구체적으로 BrowserStorageBrowserStorageMapper를 활용하여 관심사 분리를 실현한다. 따라서 코드 안정성을 높이고, 테스트 용이성을 확보하여 유지보수성을 향상시킬 수 있다.

Typescript로 Local Storage 안전하게 사용하기