A 나라가 B 나라를 침공하였습니다. B 나라의 대부분의 전략 자원은 아이기스 군사 기지에 집중되어 있기 때문에 A 나라는 B 나라의 아이기스 군사 기지에 융단폭격을 가했습니다.A 나라의 공격에 대항하여 아이기스 군사 기지에서는 무수히 쏟아지는 폭격 미사일들을 요격하려

내가 만드는 웹 페이지는 펫프렌즈와 같은 레이아웃 형식으로 되어 있다.그런데 바텀시트를 열기 위해서 모달을 띄우면 웹 페이지의 오른쪽 스크롤바가 사라지면서 컨텐츠를 담고 있는 컨테이너가 스크롤바가 사라진 만큼 오른쪽으로 이동하고, 다시 바텀시트를 닫으면 원래 있던 자리

모바일 브라우저에서 100vh를 적용하려고 하면 내가 의도했던 대로 절대 되지 않는다.왜냐하면 모바일 브라우저에서 100vh는 브라우저 상단 주소창 영역과 하단 네비게이션 바 영역을 포함하기 때문이다. 그래서 100vh로 설정하면 모바일 화면에서는 내가 원래 보여주려고

Redux를 사용할 때는 액션 타입, 액션 생성 함수, 리듀서 코드를 작성해야 하는데, 이 코드들을 각각 다른 파일에 작성하는 방법도 있고, 기능별로 묶어서 파일 하나에 작성하는 방법도 있다./actionscounter.jstodos.js/constantsActionT

Query String (URL Parameter) 개념 URL Parameter (Query String)은 위의 그림에서와 같이 URL에서 물음표 뒤에 따라오는 key=value 형식의 pair들을 말한다. URL Parameter를 여러 개 쓰고 싶다면 &를 써

사용자가 입력한(원하는) 웹페이지, 이미지, 동영상 등의 자원을 서버에게 요청서버로부터 전달(응답) 받은 자원을 화면에 출력웹 브라우저에는 두 개의 엔진이 있다.렌더링 엔진사용자가 볼 화면을 그려내는 역할 (내용 정보인 HTML과 서식정보인 CSS 등을 읽어들여 사람이

Next.js 13버전을 사용하면서 Server Component와 Client Component의 존재에 대해서 알게 되었고, 대충 개념은 이해한 것 같지만 뭔가 애매해서 Next.js의 공식문서 등을 참고해서 다시 한국어를 섞어서 정리해보려고 한다.참고: https

Navbar에서 특정 메뉴를 클릭했을 때 현재 위치에 따라서 해당 메뉴에 데코레이션 효과가 들어가있는 것을 많이 보았을 것이다. (아래 사진과 같다.)이러한 효과를 구현하고 싶은데 이 효과의 이름이 무엇인지를 몰라서 헤매다가 'navbar active'를 검색했더니 이

무수한 API 호출 얼마 전 인턴 채용 사전 과제로 추천 검색어를 띄우는 과제를 받았다. 추천 검색어는 사용자가 입력한 문자열을 토대로 서버에 GET 요청을 보내서 추천 검색어를 받아오고, 그걸 화면에 띄우는 식으로 구현된다. 그런데...! 단순히 input 태그의

인턴 사전과제로 최근 검색어 기능에 대해서 다음과 같은 요구사항을 받았다.검색어 입력 시 최대 30개까지 저장X 클릭 시 삭제❗검색 후 10분 지나면 자동 삭제 따라서 나는 다음과 같이 구현하려고 생각했다.검색어 입력하고 엔터를 누를 시 localStorage에 rec

얼마 전 인턴 채용 사전과제 중에 추천 검색어 하이라이팅 기능을 구현하는 과제를 받았습니다!어떻게 구현했는지 공유해 보려고 합니다 -!우선 검색어 하이라이팅이란 아래와 같은 기능을 말합니다.내가 검색창에 친 문자열과 추천검색어 사이에 공통인 부분을 튀는 색을 주거나 하

필요한 모듈 리스트 Express.js 우리는 백엔드 서버를 Express.js를 사용해서 구축할 것이기 때문에 당연히 설치해주어야 한다. Axios node.js와 브라우저를 위한 Promise 기반 HTTP 클라이언트이다. bcrypt bcrypt는 레인보우 테

겨울방학을 맞아서 프론트엔드만 공부하다가 백엔드도 공부해봐야겠다는 생각이 들었다. 왜냐하면 너무 백엔드를 배우는 것을 알게 모르게 배척하기도 했고, 혹시라도 내가 백엔드에 갑자기 재미를 붙일 수도 있는 가능성이 있기 때문에..ㅎㅎ그리고 결정적으로 내가 백엔드를 해봄으로

🛂Passport.js 회원가입과 로그인을 우리가 직접 구현할 수도 있지만, 이런 작업에는 세션과 쿠키를 비롯해서 복잡한 처리 과정이 많이 들어가므로 우리는 로그인을 보다 편리하게 구현하고 싶을 것이다! 그래서 소개하는 것이 바로 Passport.js이고, Pass

주어진 항공권을 모두 이용하여 여행경로를 짜려고 합니다. 항상 "ICN" 공항에서 출발합니다.항공권 정보가 담긴 2차원 배열 tickets가 매개변수로 주어질 때, 방문하는 공항 경로를 배열에 담아 return 하도록 solution 함수를 작성해주세요.모든 공항은 알

두 개의 단어 begin, target과 단어의 집합 words가 있습니다. 아래와 같은 규칙을 이용하여 begin에서 target으로 변환하는 가장 짧은 변환 과정을 찾으려고 합니다.예를 들어 begin이 "hit", target가 "cog", words가 "hot"

네트워크란 컴퓨터 상호 간에 정보를 교환할 수 있도록 연결된 형태를 의미합니다. 예를 들어, 컴퓨터 A와 컴퓨터 B가 직접적으로 연결되어있고, 컴퓨터 B와 컴퓨터 C가 직접적으로 연결되어 있을 때 컴퓨터 A와 컴퓨터 C도 간접적으로 연결되어 정보를 교환할 수 있습니다.

ROR 게임은 두 팀으로 나누어서 진행하며, 상대 팀 진영을 먼저 파괴하면 이기는 게임입니다. 따라서, 각 팀은 상대 팀 진영에 최대한 빨리 도착하는 것이 유리합니다.지금부터 당신은 한 팀의 팀원이 되어 게임을 진행하려고 합니다. 다음은 5 x 5 크기의 맵에, 당신의

n개의 음이 아닌 정수들이 있습니다. 이 정수들을 순서를 바꾸지 않고 적절히 더하거나 빼서 타겟 넘버를 만들려고 합니다. 예를 들어 1, 1, 1, 1, 1로 숫자 3을 만들려면 다음 다섯 방법을 쓸 수 있습니다.사용할 수 있는 숫자가 담긴 배열 numbers, 타겟

사전에 알파벳 모음 'A', 'E', 'I', 'O', 'U'만을 사용하여 만들 수 있는, 길이 5 이하의 모든 단어가 수록되어 있습니다. 사전에서 첫 번째 단어는 "A"이고, 그다음은 "AA"이며, 마지막 단어는 "UUUUU"입니다.단어 하나 word가 매개변수로 주