takeU

위장 문제 링크 문제 설명 스파이들은 매일 다른 옷을 조합하여 입어 자신을 위장합니다. 예를 들어 스파이가 가진 옷이 아래와 같고 오늘 스파이가 동그란 안경, 긴 코트, 파란색 티셔츠를 입었다면 다음날은 청바지를 추가로 입거나 동그란 안경 대신 검정 선글라스를 착용하거나 해야 합니다. 종류 이름 얼굴 동그란 안경, 검정 선글라스 상의 파란색 티셔츠 하의 청바지 겉옷 긴 코트 스파이가 가진 의상들이 담긴 2차원 배열 clothes가 주어질 때 서로 다른 옷의 조합의 수를 return 하도록 solution 함수를 작성해주세요. 제한사항 clothes의 각 행은 [의상의 이름, 의상의 종류]로 이루어져 있습니다. 스파이가 가진 의상의 수는 1개 이상 30개 이하입니다. 같은 이름을 가진 의상은 존재하지 않습..

home brew 설치 homebrew는 mac OS용 패키지 관리자이고, 터미널에서 다음 코드로 설치가 가능함 ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)" 설치후에 내 mac에 homebrew가 잘 깔렸나 확인하기 위해 아래 명령어를 입력해 확인 brew doctor homebrew 설치 끝 (참고 사이트 : https://brew.sh/index_ko.html ) vim 8.0 설치 vim --version 버전 확인을 통해 7버전이 깔려있다면 8.2버전으로 업그레이드하기 위해 다음과 같이 실행 brew install mercurial brew install vim --with-over..

완주하지 못한 선수 문제 설명 수많은 마라톤 선수들이 마라톤에 참여하였습니다. 단 한 명의 선수를 제외하고는 모든 선수가 마라톤을 완주하였습니다. 마라톤에 참여한 선수들의 이름이 담긴 배열 participant와 완주한 선수들의 이름이 담긴 배열 completion이 주어질 때, 완주하지 못한 선수의 이름을 return 하도록 solution 함수를 작성해주세요. 제한사항 마라톤 경기에 참여한 선수의 수는 1명 이상 100,000명 이하입니다. completion의 길이는 participant의 길이보다 1 작습니다. 참가자의 이름은 1개 이상 20개 이하의 알파벳 소문자로 이루어져 있습니다. 참가자 중에는 동명이인이 있을 수 있습니다. 입출력 예 participant completion return [..

Whack A Mole 목표 두더지잡기 게임 만들기 기본 코드 Whack-a-mole! 0 Start! 과정 변수, 상수 생성 게임 진행 시간 설정 두다지가 올라올 구멍을 정하는 함수 생성 두더지가 올라오고 내려가도록 하는 함수 생성 게임을 시작하기 위한 함수 생성 두더지를 잡았을 때의 함수 생성 두더지를 클릭하면 bonk 실행 코드 분석 1. 변수, 상수 생성 const holes = document.querySelectorAll('.hole'); const scoreBoard = document.querySelector('.score'); const moles = document.querySelectorAll('.mole'); let lastHole; let timeUp = false; let sco..

Countdown Timer 목표 카운트다운 타이머를 구현 기본 코드 20 Secs Work 5 Quick 15 Snack 20 Lunch Break 과정 변수, 상수 생성 타이머를 진행하는 함수 생성 남은 시간을 출력하는 함수 생성 남은 시간, 분 생성 타이머 시간 설정 함수를 실행하도록 이벤트리스너 생성 코드 분석 1. 변수, 상수 생성 let countdown; const timerDisplay = document.querySelector('.display__time-left'); const endTime = document.querySelector('.display__end-time'); const buttons = document.querySelectorAll('[data-time]'); 변수 ..

Video Speed Controller 목표 비디오 재생속도 컨트롤러를 삽입 기본 코드 1× 과정 상수 생성 속도를 조절할 수 있게하는 함수 생성 함수 실행 코드 1. 상수 생성 const speed = document.querySelector('.speed'); const bar = speed.querySelector('.speed-bar'); const video = document.querySelector('.flex'); 각 클래스에 해당하는 요소를 speed, bar, video에 담음 2. 속도를 조절할 수 있게하는 함수 생성 const handleMove = e => { const y = e.pageY - e.target.offsetTop; const percent = y / e.targe..

Click and Drag 목표 클릭해서 드래그하면 옆으로 넘어가는 페이지를 구현 기본 코드 01 02 03 04 05 과정 상수, 변수 생성 mousedown시 실행될 함수 생성 mouseleave시 실행될 함수 생성 mouseup시 실행될 함수 생성 mousemove시 실행될 함수 생성 코드 분석 1. 상수, 변수 생성 const slider = document.querySelector('.items'); let isDown = false, startX, scrollLeft; items을 클래스로 가지는 요소들을 slider에 담고 isDown, startX, scrollLeft를 변수로 생성 2. mousedown시 실행될 함수 생성 slider.addEventListener('mousedown',..

Stripe Follow Along Nav 목표 박스 크기에 맞춰 내용을 불러오는 네비게이션 바를 만들어 봄 기본 코드 Cool About Me Wes Bos sure does love web development. He teaches things like JavaScript, CSS and BBQ. Wait. BBQ isn't part of web development. It should be though! Courses CLPU Command Line Power User MMD Mastering Markdown Other Links Twiter Facebook 과정 상수 생성 마우스가 올라갈 때의 함수를 생성 마우스가 떠날 때의 함수를 생성 효과를 적용, 해제하는 함수 실행 코드 분석 1. 상수 생성..

Event Capture, Propagation, Bubbling and Once 목표 이벤트 캡쳐링 - 최상위 태그가 먼저 실행이 되고, 그 후에 점점 하위로 호출 이벤트 버블링 - 최하위 태그가 먼저 실행이 되고, 그 후에 점점 상위로 호출 을 구현해보고 알아봄. 기본 코드 button 과정 상수 선언 현재의 클래스 값을 콘솔에 출력하는 함수 생성 div, button에 대해 이벤트리스너 생성 코드 분석 1. 상수 선언 const divs = document.querySelectorAll('div'); const button = document.querySelector('button'); div와 button 태그를 각각의 변수에 담는다 2. 현재의 클래스 값을 콘솔에 출력하는 함수 생성 const ..