전체 글 184

Q. 숨어있는 숫자의 덧셈 (2)

문자열 my_string이 매개변수로 주어집니다. my_string은 소문자, 대문자, 자연수로만 구성되어있습니다. my_string안의 자연수들의 합을 return하도록 solution 함수를 완성해주세요.🚫제한 사항1 ≤ my_string의 길이 ≤ 1,0001 ≤ my_string 안의 자연수 ≤ 1000연속된 수는 하나의 숫자로 간주합니다.000123과 같이 0이 선행하는 경우는 없습니다.문자열에 자연수가 없는 경우 0을 return 해주세요.❗입출력 예my_stringresult"aAb1B2cC34oOp"37"1a2b3c4d123Z"133😀 내가 푼 답const solution = (my_string) => { return (my_string.match(/\d+/g) || []) ..

CSS의 BEM 모델이란?

CSS BEM 모델이란?BEM(Block-Element-Modifier) 모델CSS 클래스 네이밍 방법론중 하나가독성재사용성 UPCSS 클래스 네이밍 같은 경우에는 CSS의 코드의 가독성, 유지보수, 재사용을 향상시키기 위해 개발자들 사이에서 널리 사용되는 방법론CSS 클래스 네이밍을 3단계로 구조화한 방법Block - 블록독립적으로 존재하며 다른요소에 의존하지 않는 최상위 요소ex. button, header등과 같이 최상위 요소가 블록이 될수 있음Element - 요소블록의 일부로 특정 기능을 수행하는 요소요소는 블록과 함께 사용할때만 의미를 가지고 블록을 기반으로 클래스를 작성함ex. button이라는 블록 하위에 button_text라는 엘리먼트가 있을 수 있고, header라는 블록 하위에 he..

공부/React 2024.11.13

컴포넌트란?

컴포넌트란?리액트 앱을 구성하는 최소한의 단위, 리액트의 기본적인 구성요소즉, 애플리케이션의 구성 요소를 담당하며 재사용가능하고 독립적인 단위로 구성컴포넌트는 UI를 작은 단위로 분리하여 개발하고 유지보수 할수 있도록 하는데 도움을 줌따라서 컴포넌트를 사용하면 코드의 가독성과 재사용성을 높일수 있다는 장점이 있음클래스 컴포넌트 vs 함수 컴포넌트클래스 컴포너트ES6 클래스 사용해서 정의render() 메서드로 UI 반환생명주기 메서드 기능 제공상태관리 기능 제공함수 컴포넌트JavaScript 함수로 정의JSX 반환react-hook 사용하여 생명주기 기능 활용컴포넌트 장점재사용성컴포넌트는 독립적이고 모듈화된 단위로 작성필요한 곳에서 쉽게 재사용 가능가독성과 유지보수성컴포넌트 기반으로 개발을 하게 되면UI..

공부/React 2024.11.07

Create React App 주요 개념

1.create-react-app 주요 개념 설명Create React App한번에 React 개발 환경을 구성해주는 환경meta에서 만든 보일러플레이트로 공식적으로 지원되는 Single Page React Application을 만드는 방법 중 하나따로 React 환경을 구성할 필요없이 최신의 빌드설정을 제공하고 React의 개발 초기에 필요한 여러 라이브러리 및 패키지등을 세팅해줌굉장히 간편하다는 장점이 있음장점하나의 명령어로 react 프로젝트를 손쉽게 세팅 가능초기 개발 시간 단축, 개발 생산성 향상React 앱 개발에만 집중할 수 있음(babel, webpack 등 심화된 관리 x)단점빌드 설정을 커스터마이징하기 어려움, 따로 추가적인 수정이 필요함리액트 앱 구조에 대해서 이해하기 어려울 수 있..

IT/React 2024.11.04

Q. 배열의 길이를 2의 거듭제곱으로 만들기

정수 배열 arr이 매개변수로 주어집니다. arr의 길이가 2의 정수 거듭제곱이 되도록 arr 뒤에 정수 0을 추가하려고 합니다. arr에 최소한의 개수로 0을 추가한 배열을 return 하는 solution 함수를 작성해 주세요.🚫제한 사항1 ≤ arr의 길이 ≤ 1,0001 ≤ arr의 원소 ≤ 1,000❗입출력 예arrresult[1, 2, 3, 4, 5, 6][1, 2, 3, 4, 5, 6, 0, 0][58, 172, 756, 89][58, 172, 756, 89]😀 내가 푼 답const solution = (arr) => { let length = arr.length const isPowerOfTwo = (num) => (num & (num - 1)) === 0 ..

JavaScript - startsWith(), endsWith(), includes()

📚 startsWith()- startsWith() 함수는 문자열 객체의 메서드 중 하나로 해당 문자열이 지정된 접두사로 시작하는지 여부 확인- boolean 값을 반환string.startsWith(searchString[, position])- searchString : 검색할 접두사로 사용할 문자열- position(선택) : 검색을 시작할 인덱스를 나타내는 정수, 기본값은 0이고 생략하면 전체 문자열을 대상📚 endsWith()- endsWith() 함수는 문자열 객체의 메서드 중 하나로 해당 문장려이 지정된 접미사로 끝나는지 여부 확인- boolean 값을 반환string.endsWidth(searchString[, position])📚 includes()- 하나의 문자열이 다른 문장려에 ..

공부/JavaScript 2024.09.02

Q. 이차원으로 만들기

정수 배열 num_list와 정수 n이 매개변수로 주어집니다. num_list를 다음 설명과 같이 2차원 배열로 바꿔 return하도록 solution 함수를 완성해주세요. num_list가 [1, 2, 3, 4, 5, 6, 7, 8] 로 길이가 8이고 n이 2이므로 num_list를 2 * 4 배열로 다음과 같이 변경합니다. 2차원으로 바꿀 때에는 num_list의 원소들을 앞에서부터 n개씩 나눠 2차원 배열로 변경합니다. 🚫제한 사항 1 ≤ my_string ≤ 110 my_string은 대문자, 소문자, 공백으로 구성되어 있습니다. 대문자와 소문자를 구분합니다. 공백(" ")도 하나의 문자로 구분합니다. 중복된 문자 중 가장 앞에 있는 문자를 남깁니다. ❗입출력 예 num_list n result ..

Q. 중복된 문자 제거

문자열 my_string이 매개변수로 주어집니다. my_string에서 중복된 문자를 제거하고 하나의 문자만 남긴 문자열을 return하도록 solution 함수를 완성해주세요. 🚫제한 사항 1 ≤ my_string ≤ 110 my_string은 대문자, 소문자, 공백으로 구성되어 있습니다. 대문자와 소문자를 구분합니다. 공백(" ")도 하나의 문자로 구분합니다. 중복된 문자 중 가장 앞에 있는 문자를 남깁니다. ❗입출력 예 my_string result "people" "peol" "We are the world" "We arthwold" 😀 내가 푼 답 const solution = (my_string) => { return [...new Set(my_string)].join("") } Set 중복되..

MVC Pattern

ⅰ) Model !!→ 데이터(data)가공을 책입지는 컴포넌트(component) - 모델은 어플리케이션의 정보, 데이터를 나타냄 - 데이터베이스, 초기화 된 상수나 값, 변수 등을 뜻함 - 비지니스 로직을 처리한 후 모델의 변경 사항을 컨트롤러와 뷰에 전달함 - Model의 규칙 - 사용자가 편집하길 원하는 모든 데이터를 가지고 있어야 함 - 뷰나 컨트롤러에 대해서 어떤 정보도 알지 말아야 함 - 변경이 일어나면, 변경 통지에 대한 처리 방법을 구현해야만함 ⅱ) View !! → 사용자에게 보여지는 부분, 즉 유저 인터페이스(User interface)를 의미함 - MVC 패턴은 여러 개의 뷰가 존재할 수 있으며, 모델에게 질의하여 데이터를 전달받음 - 뷰는 받은 데이터를 화면에 표시해주는 역할을 가..

공부/CS 2024.03.04

Q. 최대값 만들기(2)

정수 배열 numbers가 매개변수로 주어집니다. numbers의 원소 중 두 개를 곱해 만들 수 있는 최댓값을 return하도록 solution 함수를 완성해주세요. 🚫제한 사항 -10,000 ≤ numbers의 원소 ≤ 10,000 2 ≤ numbers 의 길이 ≤ 100 ❗입출력 예 numbers result [1, 2, -3, 4, -5] 15 [0, -31, 24, 10, 1, 9] 240 [10, 20, 30, 5, 5, 20, 5] 600 😀 내가 푼 답 const solution = (numbers) => { let arr = [] for(let i = 0; i < numbers.length; i++){ for(let j = 0; j a - b); return Math.max(numbers..