프론트엔드 공부
-
firstCharacter 문제 문자열을 입력받아 문자열을 구성하는 각 단어의 첫 글자로 이루어진 문자열을 리턴해야 합니다. 입력 인자 1 : str string 타입의 공백이 있는 알파벳 문자열 출력 string 타입을 리턴해야 합니다. 주의 사항 단어는 공백 한 칸으로 구분합니다. 연속된 공백은 없다고 가정합니다. 빈 문자열을 입력받은 경우, 빈 문자열을 리턴해야 합니다. 입출력 예시 let output = firstCharacter('hello world'); console.log(output); // --> "hw" output = firstCharacter( 'The community at Code States might be the biggest asset' ); console.log(outp..
문자열을 입력받아 문자열을 구성하는 각 단어의 첫 글자로 이루어진 문자열을 리턴해야 합니다.firstCharacter 문제 문자열을 입력받아 문자열을 구성하는 각 단어의 첫 글자로 이루어진 문자열을 리턴해야 합니다. 입력 인자 1 : str string 타입의 공백이 있는 알파벳 문자열 출력 string 타입을 리턴해야 합니다. 주의 사항 단어는 공백 한 칸으로 구분합니다. 연속된 공백은 없다고 가정합니다. 빈 문자열을 입력받은 경우, 빈 문자열을 리턴해야 합니다. 입출력 예시 let output = firstCharacter('hello world'); console.log(output); // --> "hw" output = firstCharacter( 'The community at Code States might be the biggest asset' ); console.log(outp..
2023.02.01 -
powerOfTwo 문제 수를 입력받아 2의 거듭제곱인지 여부를 리턴해야 합니다. 입력 인자 1 : num number 타입의 정수 (num >= 1) 출력 boolean 타입을 리턴해야 합니다. 주의 사항 반복문(while)문을 사용해야 합니다. 2의 0승은 1입니다. Number.isInteger, Math.log2, Math.log 사용은 금지됩니다. 입출력 예시 let output1 = powerOfTwo(16); console.log(output1); // true let output2 = powerOfTwo(22); console.log(output2); // false 코드 // 작성 코드 function powerOfTwo(num) { while(num >= 1){ if (num & (nu..
수를 입력받아 2의 거듭제곱인지 여부를 리턴해야 합니다.powerOfTwo 문제 수를 입력받아 2의 거듭제곱인지 여부를 리턴해야 합니다. 입력 인자 1 : num number 타입의 정수 (num >= 1) 출력 boolean 타입을 리턴해야 합니다. 주의 사항 반복문(while)문을 사용해야 합니다. 2의 0승은 1입니다. Number.isInteger, Math.log2, Math.log 사용은 금지됩니다. 입출력 예시 let output1 = powerOfTwo(16); console.log(output1); // true let output2 = powerOfTwo(22); console.log(output2); // false 코드 // 작성 코드 function powerOfTwo(num) { while(num >= 1){ if (num & (nu..
2023.02.01 -
computeWhenDouble 문제 연이율을 입력받아 원금이 2배 이상이 될 때까지 걸리는 시간(년)을 리턴해야 합니다. 입력 인자 1 : interestRate number 타입의 연이율 (%) 출력 number 타입을 리턴해야 합니다. 입출력 예시 let output = computeWhenDouble(7); console.log(output); // --> 11 output = computeWhenDouble(10); console.log(output); // --> 8 코드 // 내 작성 function computeWhenDouble(interestRate) { let time = 0; let money = 1; while(money < 2) { money = money + (money * i..
연이율을 입력받아 원금이 2배 이상이 될 때까지 걸리는 시간(년)을 리턴해야 합니다.computeWhenDouble 문제 연이율을 입력받아 원금이 2배 이상이 될 때까지 걸리는 시간(년)을 리턴해야 합니다. 입력 인자 1 : interestRate number 타입의 연이율 (%) 출력 number 타입을 리턴해야 합니다. 입출력 예시 let output = computeWhenDouble(7); console.log(output); // --> 11 output = computeWhenDouble(10); console.log(output); // --> 8 코드 // 내 작성 function computeWhenDouble(interestRate) { let time = 0; let money = 1; while(money < 2) { money = money + (money * i..
2023.02.01 -
transformFirstAndLast 문제 배열을 입력받아 차례대로 배열의 첫 요소와 마지막 요소를 키와 값으로 하는 객체를 리턴해야 합니다. 입력 인자 1 : arr string 타입을 요소로 갖는 배열 출력 객체를 리턴해야 합니다. 주의 사항 빈 배열을 입력받은 경우, 빈 객체를 리턴해야 합니다. 입력으로 받는 배열을 수정하지 않아야 합니다. 입출력 예시 let arr = ['Queen', 'Elizabeth', 'Of Hearts', 'Beyonce']; let output = transformFirstAndLast(arr); console.log(output); // --> { Queen : 'Beyonce' } arr = ['Kevin', 'Bacon', 'Love', 'Hart', 'Cost..
배열을 입력받아 차례대로 배열의 첫 요소와 마지막 요소를 키와 값으로 하는 객체를 리턴해야 합니다.transformFirstAndLast 문제 배열을 입력받아 차례대로 배열의 첫 요소와 마지막 요소를 키와 값으로 하는 객체를 리턴해야 합니다. 입력 인자 1 : arr string 타입을 요소로 갖는 배열 출력 객체를 리턴해야 합니다. 주의 사항 빈 배열을 입력받은 경우, 빈 객체를 리턴해야 합니다. 입력으로 받는 배열을 수정하지 않아야 합니다. 입출력 예시 let arr = ['Queen', 'Elizabeth', 'Of Hearts', 'Beyonce']; let output = transformFirstAndLast(arr); console.log(output); // --> { Queen : 'Beyonce' } arr = ['Kevin', 'Bacon', 'Love', 'Hart', 'Cost..
2023.02.01 -
문제1. 영화 예매 사이트를 개발하고 있습니다. API를 작성하며 잔여 좌석을 확인하는 GET /inquiry라는 엔드포인트를 만들었는데, REST 원칙을 준수하지 않았다는 지적을 받았습니다. 그 이유로 가장 적절한 것을 고르세요. A. HTTP 메서드 중 GET 보다 PUT을 사용하는 것이 적절하기 때문이다. B. 엔드포인트에 동사를 사용했기 때문이다. C. 엔드포인트에 좌석에 대한 리소스를 지칭하지 않았기 때문이다. D. 응답에 Location 헤더 정보를 전달하지 않았기 때문이다. 더보기 A. HTTP 메서드 중 GET 보다 PUT을 사용하는 것이 적절하기 때문이다. HTTP 메서드는 자원에 대한 요청에 적절한 메서드를 사용하는 것이 중요하다. GET 메서드는 자원의 정보를 조회하는 목적으로 사용되..
Open API와 API Key 종합퀴즈 문제풀이문제1. 영화 예매 사이트를 개발하고 있습니다. API를 작성하며 잔여 좌석을 확인하는 GET /inquiry라는 엔드포인트를 만들었는데, REST 원칙을 준수하지 않았다는 지적을 받았습니다. 그 이유로 가장 적절한 것을 고르세요. A. HTTP 메서드 중 GET 보다 PUT을 사용하는 것이 적절하기 때문이다. B. 엔드포인트에 동사를 사용했기 때문이다. C. 엔드포인트에 좌석에 대한 리소스를 지칭하지 않았기 때문이다. D. 응답에 Location 헤더 정보를 전달하지 않았기 때문이다. 더보기 A. HTTP 메서드 중 GET 보다 PUT을 사용하는 것이 적절하기 때문이다. HTTP 메서드는 자원에 대한 요청에 적절한 메서드를 사용하는 것이 중요하다. GET 메서드는 자원의 정보를 조회하는 목적으로 사용되..
2023.01.31 -
REST API 소개 REST는 Representational State Transfer라는 용어의 약자로서 2000년도에 로이 필딩 (Roy Fielding)의 박사학위 논문에서 최초로 소개되었습니다. 로이 필딩은 HTTP의 주요 저자 중 한 사람으로 그 당시 웹(HTTP) 설계의 우수성에 비해 제대로 사용되어지지 못하는 모습에 안타까워하며 웹의 장점을 최대한 활용할 수 있는 아키텍처로써 REST를 발표했다고 합니다. REST API는 HTTP를 사용하여 시스템 간 통신을 허용하며, Representational State Transfer (REST)의 원칙에 기반합니다. REST API는 Representational State Transfer API의 약자입니다. HTTP 요청을 사용하여 웹 서비스..
REST API, OpenAPI, API KeyREST API 소개 REST는 Representational State Transfer라는 용어의 약자로서 2000년도에 로이 필딩 (Roy Fielding)의 박사학위 논문에서 최초로 소개되었습니다. 로이 필딩은 HTTP의 주요 저자 중 한 사람으로 그 당시 웹(HTTP) 설계의 우수성에 비해 제대로 사용되어지지 못하는 모습에 안타까워하며 웹의 장점을 최대한 활용할 수 있는 아키텍처로써 REST를 발표했다고 합니다. REST API는 HTTP를 사용하여 시스템 간 통신을 허용하며, Representational State Transfer (REST)의 원칙에 기반합니다. REST API는 Representational State Transfer API의 약자입니다. HTTP 요청을 사용하여 웹 서비스..
2023.01.31 -
1. 다음 그림은 터미널에서 npm start 명령어를 통해 리액트 앱을 실행한 화면입니다. 설명 중 옳은 것을 모두 고르세요. (정답 세 개) A.localhost 대신에 127.0.0.1로 접속할 수 있다. B.포트 번호 3001번에서 실행중이다. C.172.30.1.14 를 hosts로 사용할 수 있다. D.URI를 통해 네트워크 통신을 위한 scheme이 HTTPS라는 것을 확인할 수 있다. 더보기 A. localhost 대신에 127.0.0.1로 접속할 수 있다. - 옳음. localhost와 127.0.0.1은 로컬 호스트 주소라는 것은 같으며, 어떠한 호스트에서든 이 주소로 접속할 수 있다. B. 포트 번호 3001번에서 실행중이다. - 옳음. 실행화면에서 보이는 http://localhos..
[HTTP/네트워크] 기초 종합퀴즈 풀이1. 다음 그림은 터미널에서 npm start 명령어를 통해 리액트 앱을 실행한 화면입니다. 설명 중 옳은 것을 모두 고르세요. (정답 세 개) A.localhost 대신에 127.0.0.1로 접속할 수 있다. B.포트 번호 3001번에서 실행중이다. C.172.30.1.14 를 hosts로 사용할 수 있다. D.URI를 통해 네트워크 통신을 위한 scheme이 HTTPS라는 것을 확인할 수 있다. 더보기 A. localhost 대신에 127.0.0.1로 접속할 수 있다. - 옳음. localhost와 127.0.0.1은 로컬 호스트 주소라는 것은 같으며, 어떠한 호스트에서든 이 주소로 접속할 수 있다. B. 포트 번호 3001번에서 실행중이다. - 옳음. 실행화면에서 보이는 http://localhos..
2023.01.30 -
문제1. React에서 이벤트를 처리하는 방식으로 옳은 것을 고르세요. A.이벤트 종류를 설정할 때 PascalCase로 설정해야 한다. B.이벤트에 전달하는 값은 함수여야 한다. C.이벤트 핸들러를 설정할 때 반드시 호출연산자 ()를 이용해서 바로 함수를 호출해야 한다. D.이벤트 핸들러는 props로 전달할 수 없다. 더보기 A. React에서는 이벤트 이름을 camelCase로 작성해야 합니다. 예를 들어 onClick, onChange 등이 일반적입니다. PascalCase는 잘못된 형식입니다. B. 이벤트에 전달하는 값은 함수여야 한다. JSX를 사용하여 문자열이 아닌 함수로 이벤트 핸들러를 전달합니다. C. React에서는 이벤트 핸들러를 설정할 때 함수를 호출하지 않고 함수 자체를 전달해야 ..
React State & Props 종합 퀴즈 풀이문제1. React에서 이벤트를 처리하는 방식으로 옳은 것을 고르세요. A.이벤트 종류를 설정할 때 PascalCase로 설정해야 한다. B.이벤트에 전달하는 값은 함수여야 한다. C.이벤트 핸들러를 설정할 때 반드시 호출연산자 ()를 이용해서 바로 함수를 호출해야 한다. D.이벤트 핸들러는 props로 전달할 수 없다. 더보기 A. React에서는 이벤트 이름을 camelCase로 작성해야 합니다. 예를 들어 onClick, onChange 등이 일반적입니다. PascalCase는 잘못된 형식입니다. B. 이벤트에 전달하는 값은 함수여야 한다. JSX를 사용하여 문자열이 아닌 함수로 이벤트 핸들러를 전달합니다. C. React에서는 이벤트 핸들러를 설정할 때 함수를 호출하지 않고 함수 자체를 전달해야 ..
2023.01.27