본문 바로가기
728x90

프로그래밍70

SSR(Server Side Rendering) 그리고 CSR(Client Side Rendering) 🌈 SSR & CSR 💡 SSR -> Server Side Rendering : 웹 페이지를 브라우저에서 렌더링하는 대신에 서버에서 렌더링 한다. 브라우저가 서버의 URI로 GET 요청을 보내면 서버는 정해진 웹 페이지 파일을 브라우저로 전송한다. 그리고 서버의 웹 페이지가 브라우저에 도착하면 완전히 렌더링 된다. 서버에서 웹페이지를 브라우저로 보내기 전에, 서버에서 완전히 렌더링했기 때문에 Server Side Rendering 이라고 한다. 웹 페이지의 내용에 데이터이스의 데이터가 필요한 경우, 서버는 데이터베이스의 데이터를 불러온 다음 웹 페이지를 완전히 렌더링 된 페이지로 변환한 후에 브라우저 응답으로 보낸다. 웹 페이지를 살펴보던 사용자가, 브라우저의 다른 경로로 이동하면 다른 경로로 이동할 때.. 2022. 5. 20.
알고리즘 문제 풀이 - orderOfPresentation 문제 말썽꾸러기 김코딩은 오늘도 장난을 치다가 조별 발표 순서가 담긴 통을 쏟고 말았습니다. 선생님께서는 미리 모든 발표 순서의 경우의 수를 저장해 놓았지만 김코딩의 버릇을 고치기 위해 문제를 내겠다고 말씀하셨습니다. 김코딩은 모든 조별 발표 순서에 대한 경우의 수를 차례대로 구한 뒤 발표 순서를 말하면 이 발표 순서가 몇 번째 경우의 수인지를 대답해야 합니다. 총 조의 수 N과 선생님이 말씀하시는 발표 순서 k가 주어질 때, 김코딩이 정답을 말 할 수 있게 올바른 리턴 값을 구하세요. 모든 경우의 수가 담긴 배열은 번호가 작을수록 앞에 위치한다고 가정합니다. ex) N = 3일경우, [[1,2,3],[1,3,2],[2,1,3],[2,3,1],[3,1,2],[3,2,1]] 입력 인자 1: N Number.. 2022. 5. 20.
URL과 URI는 무엇인가?! 🌈 URL 과 URI 💡 URL -> Uniform Resource Locator : 네트워크 상에서 웹 페이지, 이미지, 동영상 등의 파일이 위치한 정보를 나타낸다. URL은 scheme, hosts, url-path 로 구분할 수 있다. 가장 먼저 작성하는 scheme 은 통신 방식(프로토콜)을 결정한다. 일반적으로 웹 브라우저에서는 http 혹은 https를 많이 사용한다. hosts는 웹 서버의 이름이나 도메인, IP를 사용해서 주소를 나타내고 url-path는 웹 서버에서 지정한 루트 디렉토리부터 시작하여 웹 페이지, 이미지, 동영상 등이 위치한 경로와 파일명을 나타낸다. 💡 URI -> Uniform Resource Identifier :일반적으로 URL의 기본 요소인 scheme, hosts.. 2022. 5. 20.
[convertDoubleSpaceToSingle] 문자열을 입력받아 해당 문자열에 등장하는 두 칸의 공백을 모두 한 칸의 공백으로 바꾼 문자열을 리턴해야 합니다. 💡 최대한 간결하게 풀어본 나의 풀이 function convertDoubleSpaceToSingle(str) { // TODO: 여기에 코드를 작성합니다. return str.split(' ').join(' '); } 💡 Split () : 문자열을 일정한 구분자로 잘라서 배열로 저장 const str = "Hello I am learning JavaScript!"; console.log(str.split(" ")); // [ 'Hello', 'I', 'am', 'learning', 'JavaScript!' ] 💡 join() : 배열의 모든 요소를 연결해 하나의 문자열로 만든다. const arr = ['A', 'B', 'C']; console.log(arr.join()); // A,B,C conso.. 2022. 5. 13.
[convertListToObject] 2차원 배열(배열을 요소로 갖는 배열)을 입력받아 각 배열을 이용해 만든 객체를 리턴해야 합니다. 💡 최대한 간결하게 풀어본 나의 풀이 function convertListToObject(arr) { // TODO: 여기에 코드를 작성합니다. let obj = {}; if (arr.length === 0 ) return obj; for ( let a in arr ){ if( arr[a].length !== 0 && !(arr[a][0] in obj)) { obj[arr[a][0]] = arr[a][1]; } } return obj; } 2022. 5. 13.
[알고리즘] 문자열을 입력받아 문자열을 구성하는 각 단어의 첫 글자가 대문자인 문자열을 리턴해야 합니다. 💡 최대한 간결하게 풀어본 나의 풀이 function letterCapitalize(str) { // TODO: 여기에 코드를 작성합니다. a = str.split(" "); return a.map((el) => { if (el === "") return "" return el[0].toUpperCase() + el.substr(1); }).join(' '); } ✓ 사용한 함수들 💡 Split () : 문자열을 일정한 구분자로 잘라서 배열로 저장 const str = "Hello I am learning JavaScript!"; console.log(str.split(" ")); // [ 'Hello', 'I', 'am', 'learning', 'JavaScript!' ] 💡 join() : 배열의 모.. 2022. 5. 12.
[알고리즘] 배열을 입력받아 차례대로 배열의 첫 요소와 마지막 요소를 키와 값으로 하는 객체를 리턴해야 합니다. 💡 최대한 간결하게 풀어본 나의 풀이 // 삼항연산자를 이용해 구현 function transformFirstAndLast(arr) { // TODO: 여기에 코드를 작성합니다. return arr.length>0 ? {[arr[0]]:arr[arr.length -1]} : {} } 💡 삼항연산자 (조건문) ? (참) : (거짓) function getFee(isMember) { return (isMember ? '$2.00' : '$10.00'); } console.log(getFee(true)); // expected output: "$2.00" console.log(getFee(false)); // expected output: "$10.00" console.log(getFee(null)); // .. 2022. 5. 11.
[알고리즘] 문자열을 입력받아 문자열을 구성하는 각 단어의 첫 글자로 이루어진 문자열을 리턴해야 합니다. 💡 최대한 간결하게 풀어본 나의 풀이 function firstCharacter(str) { // TODO: 여기에 코드를 작성합니다. return str.split(" ").map((a) => a[0]).join("") } 💡 Split () : 문자열을 일정한 구분자로 잘라서 배열로 저장 const str = "Hello I am learning JavaScript!"; console.log(str.split(" ")); // [ 'Hello', 'I', 'am', 'learning', 'JavaScript!' ] 💡 join() : 배열의 모든 요소를 연결해 하나의 문자열로 만든다. const arr = ['A', 'B', 'C']; console.log(arr.join()); // A,B,C co.. 2022. 5. 11.
[알고리즘] 수를 입력받아 2의 거듭제곱인지 여부를 리턴해야 합니다. 💡 최대한 간결하게 풀어본 나의 풀이 function powerOfTwo(num) { // TODO: 여기에 코드를 작성합니다. while (num >= 1) { if (num === 1) return true; if (num % 2 !== 0) return false; num = num / 2; } } 2022. 5. 11.
728x90