개발 노트

최근 iOS 개발자가 되기 위한 여정을 시작하고, Swift 문법 공부를 시작했다.최근 몇몇 기업에서는 코딩 테스트 자체를 모집 분야의 주 언어로만 가능하도록 제한하는 경향이 있다고 하여, PS 역시 기존 C++에서 Swift로 변경하면 좋을 것 같았다. 이에 내가 구성한 VSCode 내에서의 단일 파일 실행 환경 세팅 및, 자잘한 팁에 대해 공유해보고자 한다. 단일 Swift 파일 실행 명령어 XCode 또는 Swift만 설치되어 있다면, 의외로 단일 파일을 실행하는 것은 쉽다. 터미널 환경에서swift [실행할 swift 파일 경로] 명령어만 입력하면 별도의 빌드 과정 없이 단일 파일을 쉽게 실행해볼 수 있다.'그렇다면 단축키를 통해 저 터미널 명령어를 실행하면 되지 않을까?' 라는 생각 하에, VS..

개요원래 VSCode에서 프론트엔드 개발 및 React Native 개발을 하다가, 최근 iOS 개발에 관심이 생겨 XCode를 사용하게 되었다. 사실 불편한 점이 여간 한두개가 아니었는데, 그 중 가장 불편했던 점이 단축키 관련 이슈였다.VSCode만으로 거의 몇년째 개발을 했고, 그 중에서 상당히 유용하게 썼던 단축키가 꽤 많았는데 대부분이 XCode에서 적용되지 않아서 결국 단축키 세팅을 VSCode처럼 변경했다. 나와 비슷한 고충을 겪는 사람이 있을 것 같아, 해당 설정을 공유해보고자 한다. 해당 설정을 바탕으로, 본인 입맛대로 추가 커스텀을 통해 사용하면 될 것 같다.주요 변경점으로는 아래와 같다.⌘+D : 현재 파일 내에서, 현재 선택된 영역과 동일한 이름을 가지는 다음 영역 선택(수정도 가능..

React Native를 이용해 서비스를 개발하던 중, UX 측면에서 좋지 않은 현상 하나를 겪었다. 새로고침 시 이미지가 깜빡이는 현상(flickering)이 생기고 있었다.문제를 찾기 위해 디버깅을 해 보니, 그 이유는 AWS의 Presigned Url에 있었다. 이미지 관련 정보를 S3에서 동적으로 받아오는 형태로 아키텍처를 구성했는데, 동일한 리소스에 대한 요청에도 그때마다 다른 url 값을 반환하는 특성 상 Image 객체의 url이 변경되어, 원치 않는 리렌더링이 발생하는 것이었다. 이미지 자동 캐싱을 해 주는 react-native-fast-image 라이브러리를 써 봤을 때에도 별다른 효과가 없었고, 이후 조금 더 근본적인 해결책을 찾게 되었다. patch 파일을 통해 라이브러리 코드를 직..

문제 상황React Native를 이용해 프로젝트를 진행하고 있는데, IOS에서는 정상적으로 보이는 그림자가 Android에서는 좌우로 잘려 보인다.  원인const GeneralCommunity: React.FC = () => { const { postList, getPostListByBoardId } = useCommunityContext(); const { tokenHeader } = useContext(AuthContext); useEffect(() => { if (!tokenHeader) return; getPostListByBoardId(tokenHeader, 1, 0); }, [tokenHeader]); return ( ( // 그림자 효..

SW마에스트로 합격을 위해 최근 열심히 코딩 테스트를 준비하고 있다. 열심히 코테를 위한 뇌를 깨우고 있던 중, 첫 번째 난관에 봉착했다. 꽤나 오랜 시간을 투자한 만큼 더이상 삽질하지 말자는 의미에서, 기존 내가 설계했던 방식에 대한 짧은 소개와 문제점, 그리고 올바른 풀이를 설명하고자 한다. 이번 문제에서는 아이디어만큼 내가 여기서 겪었던 실패와 성공의 경험 역시 중요하다고 생각해 전반적인 흐름을 작성하였으니, 하나의 이야기를 보는 느낌으로 편하게 봐 주시면 될 것 같다. 문제 https://www.acmicpc.net/problem/2504 2504번: 괄호의 값 4개의 기호 ‘(’, ‘)’, ‘[’, ‘]’를 이용해서 만들어지는 괄호열 중에서 올바른 괄호열이란 다음과 같이 정의된다. 한 쌍의 괄호..

리액트를 이용해 개발을 하다가, 처음 보는 오류를 마주하게 되었다. 기존의 동적인 요소와 상호작용이 되지도 않을 뿐더러, 사이트 자체가 아주 느려진 느낌이었다. 창이 꺼지는 데에도 많은 시간이 걸렸다. 추후에 어찌저찌 개발 툴을 열어 오류를 확인해 보니, 아래와 같은 오류 창이 떠 있었다. 음.. 누가 봐도 어딘가에서 코드를 잘못 써서 무한루프에 걸린 문제였다. 처음에는 'useEffect 내부에서 setState를 호출했으나, useEffect가 두 번째 인자인 dependency 배열을 받지 않았거나 렌더 시마다 dependency가 변경되었을 때 발생할 수 있는 오류'라는 내용을 보고 이 부분을 확인해보고자 하였다. 실제로, 아래 두 가지의 상황에서는 무한루프가 발생할 수 있다. 1. useEffe..

자바스크립트를 이용해 개발을 할 때, 흔히 비동기와 동기적 처리에 대한 용어를 많이 접하고는 한다. 그리고 비동기적 처리에 항상 콜백 함수라는 용어도 같이 동반되고는 한다. 동기와 비동기적 처리 그리고 콜백 함수가 무엇인지, 그리고 어떻게 동기와 비동기적 처리를 구현할 수 있는지에 대해 간단히 정리해보았다. 동기와 비동기 방식 동기(synchronous) : 요청과 처리가 동시에 일어남 비동기(asynchronous) : 요청과 처리가 동시에 일어나지 않음 용어의 정의만 들어서는 무슨 말인지 잘 와닿지 않는다. 요청과 처리의 동시성이 어떤 의미를 가지는 걸까? 현실 상의 예시를 하나 들어보겠다. 당신은 카페에 갔다. 그리고 주문을 하려고 한다. 주문에는 두 가지 방식이 있다. 1) 주문을 하면 즉시 커피..

React는 페이스북에서 개발한, 유저 인터페이스(UI)를 담당하는 자바스크립트 라이브러리 중 하나이다. 리액트는 SPA, CSR, Virtual DOM 등 몇 가지 대표적인 특징을 가지고 있는데, 이번 시간에는 그 특징들에 대해 정리해보고자 한다. SPA와 CSR SPA : Single Page Application CSR : Client Side Rendering SPA는 Single Page Application, 단일 페이지 어플리케이션의 약자이며 MPA(Multiple Page Application)와 반대되는 개념이다. 단 하나의 페이지를 통해 유저의 요청을 처리해 주는 방식이다. 그렇다면 리액트에서 어떻게 하나의 페이지로만 웹 어플리케이션을 구성할 수 있을까? 이를 위해 사용되는 방식이 바로..

문제 https://www.acmicpc.net/problem/1941 1941번: 소문난 칠공주 총 25명의 여학생들로 이루어진 여학생반은 5×5의 정사각형 격자 형태로 자리가 배치되었고, 얼마 지나지 않아 이다솜과 임도연이라는 두 학생이 두각을 나타내며 다른 학생들을 휘어잡기 시작 www.acmicpc.net 아이디어 1) 조합을 이용하여 7개의 좌표 선택 2) BFS를 이용하여, 선택한 좌표가 서로 연결되어 있는지 확인 3) 만약 연결되어 있을 시에는, 연결된 좌표들의 'S'의 개수와 'Y'의 개수 비교 처음에는 1)과 같이 조합을 이용하지 않고 백트래킹을 이용하여, 영역을 넓혀 나가며 좌표를 선택하다가 7개 모두 선택 시 2)와 3)의 과정을 수행하였다. 그러나 백트래킹으로는 십자 모양과 같이 두..

next_permutation은 C++ STL의 헤더에서 제공하며 순열과 조합을 구할 때 유용하게 사용 가능한 함수이다. 순열과 조합 순열 : 서로 다른 n개의 원소에서 r개를 선택한 후, 이를 나열하는 모든 경우의 수. 기호로는 n​Pr 이라고 나타내며, 이 때의 P는 영어 permutation의 약자이다. 특정 원소를 ​뽑은 후 이를 '나열'하는 경우의 수이기 때문에, 뽑힌 원소의 순서까지도 고려가 된다. 예를 들어 {1, 2}와 {2, 1}은 같은 원소를 선택하였으나 순서가 다르기에, 둘은 다른 순열이 된다. {1, 2, 3}으로 만들 수 있는 순열은 다음과 같다. {1, 2, 3} {1, 3, 2} {2, 1, 3} {2, 3, 1} {3, 1, 2} {3, 2, 1} 총 6개의 경우의 수가 존재..