[JS] 공원 산책
·
코딩테스트
문제프로그래머스 코딩테스트 연습 : 공원 산책 자료구조/알고리즘, 시간복잡도, 소요시간자료구조/알고리즘: -시간 복잡도: O(n)소요 시간: 40분 코드function move(park, position, route) { let isMoved = true; const initializePosition = [position[0], position[1]]; const [direction, count] = route.split(" "); for(var i = 0; i = park.length || park[current_y + 1].split("")[current_x] === 'X' ) { isMoved = fals..
[시작! AWS] - 도서리뷰
·
컴퓨터 기초
후기프론트엔드 주니어 개발자로서 클라우드 서비스에 대한 기초를 쌓을 수 있었습니다. 복잡해 보이는 AWS 개념을 쉽고 친절하게 설명하며, 실습 중심의 구성으로 따라 하며 배울 수 있어 유익했습니다. 특히 EC2, S3 같은 주요 서비스 활용법을 이해하고 간단한 애플리케이션을 배포하는 데 실질적인 도움을 받을 수 있었습니다. EC2와 S3 같은 필수 서비스의 설정과 활용 방법을 단계별로 안내해 실제로 따라 하며 익힐 수 있는 점이 큰 장점이었습니다. 특히 실습 위주의 구성은 이론과 실무를 자연스럽게 연결시켜주어 AWS의 구조와 작동 원리를 이해하는 데 큰 도움이 되었으며, 책의 전반적인 흐름이 명확하고, 실습을 통해 결과물을 눈으로 확인할 수 있어 이해하기 쉬었습니다. 클라우드와 AWS가 낯선 프론트엔드 ..
[React] 뒤로가기 시 상태 유지하기 ( useNavigationType, popstate )
·
React
TLDR이번에는 Tab Navigation을 서비스를 개발하며 개선한 부분에 대해서 얘기해보려고 합니다. 그저 "탭의 상태" 에 따른 표시되는 UI가 변경되는 정도의 컴포넌트로 인식하고 있었지만, 사용자측면을 고려하고 베타테스트를 진행하면서 저 "상태"를 자연스럽게 관리하는 것에 대해 고민하고 개선한 내용과 그 로직에 대해 공유하려고 합니다. 초기 로직 : UI와 그 기능에 집중처음 개발한 Tab Navigation은 UI와 Highligt Animation 등에 더 신경을 많이 썼습니다. 다른 페이지에서도 활용 될 수 있게끔, 탭의 갯수와 상관없이 UI를 적용할 수 있게끔 고민했고, 탭의 상태는 크게 신경쓰지 않았습니다.컴포넌트의 Props를 통해 tab의 정보를 배열로 받았으며, tab navigat..
[React] 웹뷰로 연결된 Android Stuiod / IOS 에 데이터 주고받기 ( 브릿지 통신 )
·
React
TLDR웹뷰형태의 앱을 서비스하게 되니, React에서 앱으로 데이터를 주고받을 수 없을까? 하는 생각이 들었습니다. 저희 서비스에서는 웹뷰로 표시될 앱을 외주를 맡기고 앱동작이 아닌 거의 모든 UI와 상태들이 웹에서 관리되고 있었기 때문에, 데이터를 전달해서 기능과 UI를 다르게 서비스하는 기능이 필요했습니다.이번 포스팅에서는 저희 서비스에서 웹과 앱간에 데이터를 주고받기 위해 사용한 두 가지 방식에 대해 소개해드리려고 합니다. URL params웹뷰로 연결된 앱에서는, URL 을 통해 앱에 웹을 표시합니다. URL 뒤에 약속된 params에 데이터를 남긴다면 데이터를 전달하거나 그에 맞춰서 UI를 변경할 수 있습니다.저희 서비스에서 앱에서 사용자의 몇몇 액션에 따라 페이지에 팝업이 떠야 하는 경우가 ..