개발일지, 개인 또는 단체 포트폴리오 등
기본적인 원리는 자바스크립트: 무한 스크롤 (스크롤 이벤트 이용, 라이브러리 없이) 이 글에 나온 것과 동일합니다. 스크롤 인디케이터(스크롤 상태 표시기)란 스크롤을 할 때 현재 스크롤된 영역이 전체 컨텐츠 영역의 몇 % 진행되었는가를 나타내는 표식입니다. 아래 그림에서 파란색 선이 스크롤 인디케이터입니다. 스크롤 인디케이터는 스크롤 정보를 얻어와 구현합니다. 스크롤 이벤트를 하면 이벤트 타겟에 scrollingElement라는 프로퍼티가 더보기…
[프로그래머스/레벨3] 베스트앨범 (자바스크립트) 문제 스트리밍 사이트에서 장르 별로 가장 많이 재생된 노래를 두 개씩 모아 베스트 앨범을 출시하려 합니다. 노래는 고유 번호로 구분하며, 노래를 수록하는 기준은 다음과 같습니다. 속한 노래가 많이 재생된 장르를 먼저 수록합니다. 장르 내에서 많이 재생된 노래를 먼저 수록합니다. 장르 내에서 재생 횟수가 같은 노래 중에서는 더보기…
[프로그래머스/레벨2] 위장 (자바스크립트) 문제 스파이들은 매일 다른 옷을 조합하여 입어 자신을 위장합니다. 예를 들어 스파이가 가진 옷이 아래와 같고 오늘 스파이가 동그란 안경, 긴 코트, 파란색 티셔츠를 입었다면 다음날은 청바지를 추가로 입거나 동그란 안경 대신 검정 선글라스를 착용하거나 해야 합니다. 스파이가 가진 의상들이 담긴 2차원 배열 clothes가 주어질 때 더보기…
참고: 자바스크립트: IntersectionObserver (2) 무한 스크롤(Infinite Scroll) 구현 (라이브러리 없이) 스크롤 이벤트를 하면 이벤트 타겟에 scrollingElement라는 프로퍼티가 있는데 이것을 통해 현재 스크롤 상태와 관련된 정보를 얻을 수 있습니다. 또는 document,documentElement || document.body 에서도 가져올 수 있습니다. clientHeight : 웹 브라우저 창(내용이 보여지는 영역)의 높이입니다. scrollTop : 현재 스크롤된 부분의 맨 더보기…
요구사항 키보드와 마우스를 이용해서 추천 검색어를 선택할 수 있도록 합니다. esc를 누르면 추천 검색어 창이 닫여야 합니다. 키보드의 위, 아래 키를 누르면 추천 검색어 하이라이트가 옮겨지고 엔터를 누르면 하이라이트가 위치한 검색어가 입력창에 반영되어야 합니다. 마우스로 다른 곳을 클릭하여 input이 focus를 잃어버리는 경우 추천 검색어 창이 닫여야 합니다. 마우스로 추천 검색어를 더보기…
[프로그래머스/레벨1] 전화번호 목록 현재 이 문제에는 풀이 가능 언어에 자바스크립트가 없습니다. (C++, JAVA, Python) 문제 전화번호부에 적힌 전화번호 중, 한 번호가 다른 번호의 접두어인 경우가 있는지 확인하려 합니다. 전화번호가 다음과 같을 경우, 구조대 전화번호는 영석이의 전화번호의 접두사입니다. 구조대 : 119 박준영 : 97 674 223 지영석 : 11 9552 더보기…
참고 글: 자바스크립트 lodash: debounce와 throttle을 이용하여 함수의 실행 횟수 제한 debounce: 동일 이벤트가 반복적으로 시행되는 경우 마지막 이벤트가 실행되고 나서 일정 시간(밀리세컨드)동안 해당 이벤트가 다시 실행되지 않으면 해당 이벤트의 콜백 함수를 실행합니다. throttle: 동일 이벤트가 반복적으로 시행되는 경우 이벤트의 실제 반복 주기와 상관없이 임의로 설정한 일정 시간 간격(밀리세컨드)으로 콜백 더보기…
[프로그래머스/레벨1] 완주하지 못한 선수 (자바스크립트) 문제 수많은 마라톤 선수들이 마라톤에 참여하였습니다. 단 한 명의 선수를 제외하고는 모든 선수가 마라톤을 완주하였습니다. 마라톤에 참여한 선수들의 이름이 담긴 배열 participant와 완주한 선수들의 이름이 담긴 배열 completion이 주어질 때, 완주하지 못한 선수의 이름을 return 하도록 solution 함수를 작성해주세요. 제한사항 마라톤 경기에 참여한 선수의 수는 더보기…
참고로 현재 환경의 맥은 2018년부터 사용했습니다. 첫 디바이스는 맥북 12인치였다가 최근 맥북 프로 16인치로 마이그레이션 했습니다. 전 버전인 매버릭스까지는 타이핑에 아무 문제가 없었는데 빅 서(Big Sur) 업데이트 이후로 크롬, 비주얼 스튜디오 코드 등 다양한 애플리케이션에서 타이핑 렉(딜레이)가 발생하기 시작했습니다. 이것 때문에 작업 중 스트레스가 심해 다양한 방법들을 인터넷에서 검색해 봤습니다만 더보기…
AWS(Amazon Web Service) S3 서비스는 파일을 업로드/다운로드 하는 용도로 제공되는 서비스인데요, 이 서비스에서 제공하는 부가 기능을 정적(static) 웹 사이트에 대한 호스팅 서버 용도로도 사용할 수 있습니다. 1) 로그인 후 AWS S3 Management Console 페이지로 접속한 다음 [버킷 만들기] 버튼을 클릭해 새로운 버튼을 만듭니다. 2) 버킷 이름, 리전(지역)을 더보기…