전체 글

❗️ 문제출처: 프로그래머스 코딩 테스트 연습,https://school.programmers.co.kr/learn/courses/30/lessons/42577 프로그래머스코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요.programmers.co.kr전화번호부에 적힌 전화번호 중, 한 번호가 다른 번호의 접두어인 경우가 있는지 확인하려 합니다.전화번호가 다음과 같을 경우, 구조대 전화번호는 영석이의 전화번호의 접두사입니다.- 구조대 : 119- 박준영 : 97 674 223- 지영석 : 11 9552 4421전화번호부에 적힌 전화번호를 담은 배열 phone_book 이 solution 함수의 매개변수로..

❗️ 문제출처: 프로그래머스 코딩 테스트 연습,https://school.programmers.co.kr/learn/courses/30/lessons/42576 프로그래머스코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요.programmers.co.kr수많은 마라톤 선수들이 마라톤에 참여하였습니다.단 한 명의 선수를 제외하고는 모든 선수가 마라톤을 완주하였습니다.마라톤에 참여한 선수들의 이름이 담긴 배열 participant와 완주한 선수들의 이름이 담긴 배열 completion이 주어질 때,완주하지 못한 선수의 이름을 return 하도록 solution 함수를 작성해 주세요.  ❓ 문제 풀이functi..

❓ 클라이언트 사이드 렌더링(CSR)CSR은 웹 페이지가 사용자의 브라우저에서 직접 그려지는 방식이다.여기서 중요한 점은, 서버가 사용자에게 완성된 페이지를 보내는 것이 아니라 기본적인 HTML 뼈대만 전달한다는 것이다. 이 기본 HTML 은 말 그대로 페이지의 틀만 가지고 있을 뿐, 실제로 화면에 표시될 내용(텍스트, 이미지, 버튼 등...)은 없는 상태이다. 즉, 브라우저는 처음에 빈 화면을 받게 된다.그래서 페이지가 처음 로드될 때, 화면에 거의 아무것도 보이지 않거나 간단한 로딩 화면만 나타날 수 있다. 브라우저는 이 HTML 파일을 받은 후, HTML 안에 포함된 자바스크립트 파일을 불러와서 실행한다.자바스크립트는 서버로부터 필요한 데이터를 다시 요청하고, 그 데이터를 이용해 페이지의 나머지 부..

❗️ 문제 출처: 프로그래머스 코딩 테스트 연습,https://school.programmers.co.kr/learn/courses/30/lessons/12948 프로그래머스코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요.programmers.co.kr프로그래머스 모바일은 개인정보 보호를 위해 고지서를 보낼 때 고객들의 전화번호의 일부를 가립니다.전화번호가 문자열 phone_number로 주어졌을 때,전화번호의 뒷 4자리를 제외한 나머지 숫자를 전부 *으로 가린 문자열을 리턴하는 함수, solution을 완성해 주세요.  ❓ 나의 풀이function solution(phone_number) { let..

📌 상황프로젝트를 진행하면서 react-helmet 을 사용해 메타 태그를 동적으로 제어하고 있었는데, 계속 똑같은 경고 메시지가 떴다. 🔍 문제 분석이 경고 메시지는 "componentWillMount 를 React 의 엄격 모드에서 사용하면 버그가 나타날 수 있다" 는 의미였다.구글링을 해보니, 이 문제는 react-helmet-async 를 사용하면 해결되는 문제였다. 기존에는 react-helmet 을 이용해 컴포넌트를 사용하여 메타 태그를 설정하고 있었는데, react-helmet-async 를 사용하지 않아서 경고 메시지가 떴던 것이다.import { Helmet } from 'react-helmet'// HTML 문서의 메타 태그를 설정하여 SEO 와 페이지 정보를 제공하는 컴포넌트co..

📌 상황프로젝트에서 Zustand 를 이용해 다크모드 기능을 구현하던 중, 현재 경로 정보를 가져오기 위해 useLocation() 훅을 사용하려고 했는데 다음과 같은 에러 메시지를 접하게 됐다.Uncaught Error: useLocation() may be used only in the context of a component 🔍 문제 분석번역을 해보니 "useLocation() 은 컴포넌트의 컨텍스트에서만 사용될 수 있습니다." 라는 의미였다.관련 문서를 찾아보니, 이 문제는 useLocation() 훅이 Router 컴포넌트의 자식으로 존재하지 않을 때 발생하는 오류였다. 나는 RouterProvider 를 사용해서 라우터를 관리하고 있었고, 아래와 같이 ThemeSwitcher 컴포넌트에..