rosie

머쓱이는 직육면체 모양의 상자를 하나 가지고 있는데 이 상자에 정육면체 모양의 주사위를 최대한 많이 채우고 싶습니다. 상자의 가로, 세로, 높이가 저장되어있는 배열 box와 주사위 모서리의 길이 정수 n이 매개변수로 주어졌을 때, 상자에 들어갈 수 있는 주사위의 최대 개수를 return 하도록 solution 함수를 완성해주세요. 🚫제한 사항 box의 길이는 3입니다. box[0] = 상자의 가로 길이 box[1] = 상자의 세로 길이 box[2] = 상자의 높이 길이 1 ≤ box의 원소 ≤ 100 1 ≤ n ≤ 50 n ≤ box의 원소 주사위는 상자와 평행하게 넣습니다. ❗입출력 예 box n result [1, 1, 1] 1 1 [10, 8, 6] 3 12 😀 내가 푼 답 const solutio..

정수 배열 array가 매개변수로 주어질 때, 가장 큰 수와 그 수의 인덱스를 담은 배열을 return 하도록 solution 함수를 완성해보세요. 🚫제한 사항 1 ≤ array의 길이 ≤ 100 0 ≤ array 원소 ≤ 1,000 array에 중복된 숫자는 없습니다. ❗입출력 예 array result [1, 8, 3] [8, 1] [9, 10, 11, 8] [11, 2] 😀 내가 푼 답 const solution = (array) => { return [Math.max(...array), array.indexOf(Math.max(...array))] } 😊 문제풀이 답안 OR 다른사람들 답안 // 1 function solution(array) { let max = Math.max(...array)..

문자열 my_string과 정수 num1, num2가 매개변수로 주어질 때, my_string에서 인덱스 num1과 인덱스 num2에 해당하는 문자를 바꾼 문자열을 return 하도록 solution 함수를 완성해보세요. 🚫제한 사항 1 { const arr = [...my_string] arr.splice(num1, 1, my_string[num2]) arr.splice(num2, 1, my_string[num1]) return arr.join("") } 😊 문제풀이 답안 OR 다른사람들 답안 function solution(my_string, num1, num2) { my_string = my_string.split(''); [my_string[num1], my_string[num2]] = [my_s..

❓ Design System 이란? 재사용 가능한 UI 구성 요소의 모음 버튼과 같은 UI 요소와 텍스트 요소 및 디자인 파일에서 재사용될 요소를 정의할 수 있음 미리 만들어놓고 하나씩 꺼내서 쓰는 시스템으로 이해하면 됨 ex. apple 디자인 시스템 ❗️❗️ Design System을 사용하는 이유 디자인 시스템의 주요 이점 중 하나는 일관성!! 색상, 타이포그래피, 간격 및 기타 많은 항목이 명확하게 정의된 디자인 시스템이 있다면 디자인 파일 전체에 일관성이 보장되게 됨 → 일관성이 보장된다는 것은 브랜드를 가지게 된다는 뜻! 구축된 시스템은 디자인 & 개발의 워크플로우를 매우 쉽게 만듦 → 디자이너가 모듈(컴포넌트) 형태로 작업물을 만들면 이를 가지고 개발자가 컴포넌트 중심의 개발을 할 수 있게 ..

📌 SCSS SCSS는 Sass3 버전부터 새롭게 등장 SCSS는 Sass의 모든 기능을 지원하는 Superset SCSS는 CSS와 거의 비슷한 문법으로 Sass의 기능을 사용할 수 있어서 편리함 📚 CSS의 단점 CSS는 복잡한 언어는 아니지만 작업이 커지거나 코드가 많아지면 불편함이 생김 -> 유지보수가 어려워진다는 단점이 있음 선택자(Selector)를 만들때 매번 불필요한 부모요소 선택자를 적어야 함 funtion같은게 없으니, 규모가 큰 프로젝트의 경우 자동화하기 어렵고 모든 것을 수동으로 변경해야 함 결국에는 중복되는 코드가 많아 코드 줄수가 길어져 유지보수에 마이너스적인 요소가 됨 📚 SASS(Synthetically Awesome StyleSheets) Sass는 코드의 재활용성을 올리고..

어떤 세균은 1시가에 두배만큼 증식한다고 합니다. 처음 세균의 마리수 n과 경과한 시간 t가 매개변수로 주어질 때 t시간 후 세균 수를 return 하도록 solution 함수를 완성해주세요. 🚫제한 사항 1 ≤ n ≤ 10 1 ≤ t ≤ 15 ❗입출력 예 n t result 2 10 2048 7 15 229,376 😀 내가 푼 답 const solution = (n, t) => { return n * (2 ** t) } 😊 문제풀이 답안 OR 다른사람들 답안 function solution(n, t) { return n

📌 Network tab의 기능 개발자도구의 네트워크 탭은 서버와 데이터를 주고 받을 때 편리하게 디버깅을 할 수 있도록 도와주는 도구. 각 소스들을 불러올 때 속도, 응답 등 네트워크 측면에서 확인 가능하며, 문제시 비교, 분석을 할 수 있게 해줌 http 네트워크 통신 확인, API 크롤링, 페이지 로딩 성능 테스트, 이미지, 영상 등의 소스(mock data 활용)등에서 사용할 수 있음 ❗Network 패널의 여러 가지 탭의 종류와 기능 살펴보기 📚 탭 최상단 왼쪽 상단에 빨간 불이 들어와 있으면 통신을 기록하고 있다는 뜻 빨간 불 옆에 삭제 버튼을 눌러 받아온 리소스 기록을 삭제할 수 있음 필터를 통해 모든 리소스를 확인하거나, Fetch/XHR, JS, CSS 등 여러가지 데이터를 형태별로 걸러..

📌 가상 요소(Pseudo-elements)란? - CSS 가상 요소는 선택자에 추가하는 키워드로 선택한 요소(elements)의 일부에만 스타일을 적용할 수 있고 선택한 요소 전체에 스타일을 적용하는 것이 아니라, 요소의 일부에만 스타일을 적용할 수 있음!! - HTML에 새로운 엘리먼트를 추가한 것처럼 동작함 - 존재하지 않는 요소를 존재하는 것처럼 부여하여 문서의 특정 부분 선택이 가능함 📕 가상 요소 문법 선택자::의사요소이름 {속성: 속성값;} - 하나의 HTML 요소에 여러개의 의사 요소를 동시에 적용 가능함 ❗❗ 주의점 - CSS1과 CSS2에서는 하나의 콜론(:)으로 가상 요소를 나타내어 CSS3를 지원하지 않는 브라우저에서는 적용되지 않을 수 있음 - CSS3에서는 가상 클래스는 하나의 ..

문자열 my_string과 정수 n이 매개변수로 주어질 때, my_string에 들어있는 각 문자를 n만큼 반복한 문자열을 return 하도록 solution 함수를 완성해보세요. 🚫제한 사항 2 ≤ my_string 길이 ≤ 5 2 ≤ n ≤ 10 "my_string"은 영어 대소문자로 이루어져 있습니다. ❗입출력 예 my_string n result "hello" 3 "hhheeellllllooo" 😀 내가 푼 답 const solution = (my_string, n) => [...my_string].map(i => i.repeat(n)).join("") repeat() 문자열을 주어진 횟수만큼 반복해 붙인 새로운 문자열을 반환함 😊 문제풀이 답안 OR 다른사람들 답안 function soluti..

영어에선 a, e, i, o, u 다섯 가지 알파벳을 모음으로 분류합니다. 문자열 my_string이 매개변수로 주어질 때 모음을 제거한 문자열을 return하도록 solution 함수를 완성해주세요. 🚫제한 사항 my_string은 소문자와 공백으로 이루어져 있습니다. 1 ≤ my_string의 길이 ≤ 1,000 ❗입출력 예 my_string result "bus" "bs" "nice to meet you" "nc t mt y" 😀 내가 푼 답 const solution = my_string => my_string.replace(/[aeiou]/g, "") 😊 문제풀이 답안 OR 다른사람들 답안 function solution(my_string) { return [...my_string] .filte..