본문 바로가기

분류 전체보기

(18)
프론트엔드 직무테스트 대비 : 예상 서술형 문제 정리 (CS?) 직무테스트 준비하면서 JavaScript 프론트엔드 서술형 문제들을 정리해봤다.나중에 cs지식이랑 겹칠테니 정리해두면 좋겠지라는 생각 ~프론트엔드 직무테스트 서술형 문제의 특징요즘 코딩테스트는 단순 알고리즘 문제뿐만 아니라 실무 관련 지식을 묻는 서술형 문제도 많이 출제되고 있다.특히 프론트엔드 직무의 경우, JavaScript 관련 지식과 웹 개발 전반에 관한 이해도를 확인하는 문제들이 자주 등장한다고 한다.자주 출제되는 서술형 문제 유형 (예상)1. 호이스팅(Hoisting)에 대해 설명해보세요호이스팅은 JavaScript 엔진이 코드를 실행하기 전에 변수와 함수 선언을 스코프의 최상단으로 끌어올리는 동작을 말한다.쉽게 말해서, 변수나 함수를 선언하기 전에 사용해도 에러가 발생하지 않는 JavaScr..
리액트 전역 상태관리 라이브러리 비교 [MobX, Redux, Zustand, Jotai] 최근 면접에서 “왜 MobX를 선택했는가?“라는 질문을 받았다.사실 2022년 당시에는 학생으로, 아직 경력도 쌓여있지 않은 상태여서 프로젝트의 전체적인 구조를 설계하는 능력이 아직 부족했고, 여러 라이브러리를 깊게 비교분석하지 않았었다.단순히 Redux와 비교된 블로그 글을 보고 “러닝커브가 낮다”는 이유로 MobX를 선택했었는데,이후 회사에서도 MobX를 사용하고 있어서 다른 대안을 고려할 생각을 안했던 것 같다. 이제 와서 생각해보니, 당시 내 선택이 어떤 선택이였는지가 궁금졌다.그래서 오늘은 2022년 말 시점과 현재 2025년 기준으로 전역 상태관리 라이브러리 4가지(MobX, Redux, Zustand, Jotai)를 비교해보려 한다. 2022-2023 시즌 상태관리 라이브러리 상황 (소개, ..
[프로그래머스 고득점 Kit / 깊이/너비 우선 탐색(DFS/BFS) 깊이/너비 우선 탐색(DFS/BFS)DFS(Depth-First Search)와 BFS(Breadth-First Search)는 그래프나 트리 구조에서 노드를 탐색하는 대표적인 알고리즘DFS : DFS는 한 경로를 끝까지 탐색한 후, 다른 경로를 탐색하는 방식"깊이"를 우선적으로 탐색하며, 더 이상 갈 곳이 없으면 이전 경로로 돌아옴(백트래킹)BFS : BFS는 현재 노드와 인접한 노드를 모두 방문한 후, 다음 단계로 넘어가는 방식"너비"를 우선적으로 탐색하며, 한 레벨씩 차례대로 방문LV2. 타겟 넘버 (정답률 63%)모든 경우의 수를 탐색해야 하므로, DFS(깊이 우선 탐색)를 사용했다. DFS를 통해 각 숫자에 + 또는 -를 선택하며 끝까지 탐색한 뒤, 합이 목표 값과 일치하면 카운트를 증가시키는 ..
[React Native] pod install 이슈 해결 ([!] No podspec found for `Permission...) React Native로 네이버 지도 API를 연동하던 중, 예상치 못한 오류를 만났다..!문제 상황: pod install 실행 중 발생한 오류네이버 지도 API를 연동하기 위해 위치 권한을 요청하는 기능을 구현하던 중, 위치 관련 권한 설정을 위해 react-native-permissions 라이브러리를 사용했다. 여러 블로그들을 참고하여 Podfile은 아래와 같이 설정하고 pod install을 실행했는데require_relative '../node_modules/react-native/scripts/react_native_pods'target '프로젝트이름' do ... pod 'Permission-LocationWhenInUse', :path => "#{permissions_path}/Lo..
[프로그래머스 고득점 Kit / 완전탐색] 완전탐색완전탐색은 가능한 모든 경우를 하나씩 시도하며 답을 찾는 방법문제를 해결하기 위해 모든 경우의 수를 탐색하기 때문에 정확한 답을 보장하지만, 경우의 수가 많아지면 비효율적일 수 있음주로 반복문, 재귀(DFS), 백트래킹 등을 활용해 구현장점: 구현이 간단하고 정확한 답을 보장단점: 입력 크기가 커지면 비효율적완전탐색은 입력 크기가 작거나 최적화가 필요 없는 문제에서 유용하게 사용됨LV1. 최소직사각형 (정답률 74%)각 명함의 가로와 세로 중 큰 값과, 작은 값을 따로따로 리스트에 저장한 뒤, 각각의 최댓값을 곱하여 해결했다.내 풀이function solution(sizes) { const maxList = []; const minList = []; sizes.forEach(s=>..
[Softeer/LV3. 택배 마스터 광우/스마트 물류] LV3. 택배 마스터 광우 (정답률 82.44%)주어진 레일의 순서를 적절히 정렬하여, K번의 작업 동안 택배 바구니의 무게 합을 최소화하는 문제dfs의 정석!? 모든 레일의 경우를 생각하기내 풀이const fs = require('fs');const input = fs.readFileSync('/dev/stdin').toString().trim().split('\n');// N: 레일 개수, M: 바구니 최대 무게, K: 작업 시행 횟수const [N, M, K] = input[0].split(' ').map(Number);const railList = input[1].split(' ').map(Number);let min = Infinity; // 최소 무게 합// 주어진 레일 순서에서 K번 작업 동..
[Softeer/LV3. 나무 조경/순서대로 방문하기/루돌프 월드컵] LV3. 나무 조경 (정답률 72.70%)주어진 격자 형태의 정원에서 나무의 높이가 주어졌을 때, 특정 조건에 따라 나무를 그룹으로 묶어 최대의 결과를 계산하는 문제문제는 나무를 그룹화하는 방식과 계산 조건이 복잡하여 여러 시도를 했으나 실패로 끝났음 ..ㅠ첫번째 풀이 (오답)const fs = require('fs');const input = fs.readFileSync('/dev/stdin').toString().trim().split("\n")const n = parseInt(input[0])const garden = input.slice(1).map(i=>i.split(" ").map(Number))const all = garden.reduce((a, c) => { for (let i = 0..
[React Native] 채팅 앱 구현하기 - 채팅 목록, 채팅방, WebSocket 연결 이번에는 React Native로 WebSocket을 활용한 간단한 채팅 앱을 만들어봤다. 사용자 목록 화면, 채팅방 화면, 그리고 WebSocket 연결까지 구현했는데.삽질도 좀 했지만 ㅋ 하나씩 해결하면서 프로토타입을 완성해냈다!아래는 핵심 코드 위주 ~1. 사용자 목록 화면 (ChatListScreen)사용자 ID를 기반으로 서버에서 사용자 목록을 가져와 보여주고, 특정 사용자를 선택하면 채팅방으로 이동할 수 있도록 구현useEffect(() => { DeviceInfo.getUniqueId().then((uniqueId) => { setMyId(uniqueId); // 내 ID 설정 fetch(`http:///users/${uniqueId}`) // 서버 주소는 환..