소프트웨어 개발에서 다양한 아키텍처 패턴은 코드의 구조를 체계화하고 유지보수성을 높이는 데 필수적인 역할을 한다. 그중에서도 MVC(Model-View-Controller), MVP(Model-View-Presenter), MVVM(Model-View-ViewModel)은 소프트웨어 설계에서 가장 널리 사용되는 패턴으로, 관심사…

스크립트 언어는 작업 자동화와 시스템 제어를 위한 것으로 시작되었으나, 현재는 웹 개발, 데이터 과학, 인공지능 등 다양한 분야에서 핵심적인 역할을 한다. 대표적으로 JavaScript와 Python이 있으며, 각기 다른 생태계와 강력한 기능으로 현대 소프트웨어 개발의 중심에 있다. 스크립트 언어의 개념과 역사 스크립트 언어란?…

Leaflet은 오픈 소스 자바스크립트 라이브러리로, 주로 OSM(OpenStreetMap) 같은 무료 지도 데이터를 사용하거나, 타일 기반의 지도 데이터를 불러와 사용할 수 있다. 기본적인 사용 방법만 익히면 별도의 API KEY 설정 없이 간단하게 사용 가능하고, 비용 지불의 걱정이 없다. react-leaflet 같은 라이…

지난 2년간 커스텀 블로그를 생성 후 관리하며 느낀 점, 주요 플러그인 등 후기를 간략하게 정리. 커스텀 블로그의 시작 블로그를 만들어야겠다 느낀 건 2022년 9월 경, 개발을 배워가면서 얻은 지식들을 정리하여 기록물로 남겨두고 싶다 생각이 든 것이 시작이었다. 맨 처음에는 Tistory, Velog 등 내가 배울 때 유용하게…

데이터 시각화란 데이터를 그래프, 차트, 지도, 인포그래픽 등 시각적인 형태로 표현하여 복잡한 정보나 패턴을 쉽게 이해할 수 있도록 하는 방법이다. 대량의 데이터를 시각적으로 표현함으로써 숨겨진 경향, 상관관계, 이상치 등을 더 직관적으로 파악할 수 있게 하며, 이를 통해 의사 결정 과정에서 통찰력을 제공한다. 차트는 데이터를 …

'바퀴를 다시 발명하지 마라(Don't reinvent the wheel)'라는 유명한 프로그래밍 격언이 있다. 개발 과정 중에 문제가 발생하면 새로 해결책을 구상하는 것보다 문제에 해당하는 디자인 패턴을 참고하여 적용하는 것이 더 효율적이다. 디자인 패턴이란? 디자인 패턴(Design Pattern)은 소프트웨어 개발에서 자주…

웹 개발에서는 다양한 기기에 대응하는 화면을 제공하는 것 또한 중요하다. React에서 사용자의 기기 정보를 탐지하여 적절한 UI를 제공할 수 있는 라이브러리인 react-device-detect에 대해 다루어 보았다. react-device-detect란? 몇몇 사이트들은 모바일 접속을 한 경우 특정 창을 띄우거나, 모바일 버…

360도 회전하는 이미지를 볼 수 있고, 더 나아가 드래그 이벤트를 통해 그 물체를 조작해 볼 수 있는 기능은 다양한 웹사이트에서 사용되고 있다. 주로 자동차, 신발, 시계 등의 상품을 관찰할 수 있게 서비스하는 경우가 많다. 이 포스트는 360 뷰어를 구현할 수 있는 다양한 방법 중 react-360-view 라이브러리를 통해…

알고리즘 문제의 복잡성에 대해 이야기할 때, P-NP, NP-완전, NP-난해와 같은 용어들이 등장하게 된다. 외판원 순회, 부분집합의 합과 같은 문제들에 대해 찾아볼 때 각 정보글마다 NP-완전이니, NP-난해니 말이 달라서 혼란이 있었다. 이에 대해 좀 더 조사해 보니, 그렇게 헷갈리게 된 원인이 파악되었다. 이 포스트에서는…

웹 페이지 개발을 하다 보면 이미지의 로딩에 의해 렌더링이 부자연스럽거나 끊기는 현상이 종종 발생한다. 이를 처리하기 위한 다양한 방법 중 프리 로딩(Pre Loading)을 예제를 통해 적용시켜 보았다. Image Pre Loading 이미지 프리 로딩 (Image Pre Loading)이란 사용자가 실제로 요청하기 전에 미리…