새벽 2시의 디버깅 새벽 2시의 디버깅

문제 웹뷰 프로젝트를 진행할 때 로그인 후에 유저에 대한 정보를 서버에서 통신하여 데이터를 받아오고 있었다. 이때 많은 로직을 async/await로 처리하여 불필요한 지연이 발생하였고, 이를 해결하기 위해서 Promise.all 도입이 필수적이었다. Promise.all 이란? javaScript에서 비동기적으로 다수의 Promise를 동시에 처리하고 모든 Promise가 완료될 때까지 기다리는 메서드이다. Promise.all은 배열 Promise들을 인자로 받고, 해당 Promise의 결과를 배열로 반환한다. Promise all은 여러개의 비동기 작업을 병렬적으로 처리할 때 유용하게 사용된다. 즉, 모든 작업이 완료될 때까지 대기할 필요가 없고, 작업들 간의 순서가 서로 연관되지 않은 경우 유용하..

동기 하이브리드 앱 프로젝트 과정에서 카메라에 접근하여 사진을 촬영해야 하는 기능이 있었다. 네이티브에서 구현하기엔 번거로워, 웹뷰에서 구현하고 싶었다. HTML태그 하나로 쉽게 구현이 되었고, 매우 간단한 방법이라 기록하려고 한다. 스마트폰 카메라에 접근 가능한 HTML 태그는 바로 " " 이다. 사용법 사용법은 input태그에 속성값을 "file"로 지정하면 된다. 카메라에 바로 접근하는 방법 카메라와 갤러리 등 선택하는 방법 위에서는 input태그의 타입을 file로 하고, accept, capture속성에 값을 정의했다. accept 속성 - 허용되는 파일 유형을 지정 따라서 ‘accept=”image/*”는 모든 종류의 이미지 파일을 허용 capture 속성 - 카메라 또는 기타 입력 장치를 사..

SPA (Single Page Application) 단일 페이지 어플리케이션: 웹 어플리케이션에 필요한 모든 정적 리소스를 최초에 한 번 다운로드 하고, 이후 새로운 페이지 요청 시 페이지 업데이트에 필요한 데이터만을 전달받아 페이지를 업데이트 함 브라우저에서 최초 한 번 서버에 요청하여 페이지 전체 로드 후 특정 변경 일어나는 부분만 axios, ajax 등의 기술을 사용하여 데이터를 바인딩한다. (axios등을 이용하여 주로 서버(백엔드)에서 전달한 json데이터를 주고받는다.) 현재 사용하는 프론트엔드 UI라이브러리 (React), 프레임워크 (Vue)를 이용해 프로젝트를 진행하는 경우 대부분 SPA형식을 따른다. 모던 프론트엔드 기술(React, Vue, Angular)등의 등장으로 SPA방식이..