전체 글
-
웹페이지가 사용자에게 보여지는 과정Topic/CS 2022. 3. 28. 13:29
순서 사용자가 브라우저에 url을 입력한다. url에서 도메인 name 부분을 DNS 서버에서 검색한다. DNS 서버에서 해당 도메인 name에 해당하는 ip 주소를 찾아 url 정보와 함께 전달한다. 웹페이지 url 정보와 전달받은 ip 주소는 http를 사용해 http 요청 메시지를 생성한다. 이제 생성된 http 요청 메시지를 TCP를 이용해 인터넷을 거쳐 ip 주소의 컴퓨터로 전송한다. 도착한 http 요청 메시지는 http 프로토콜을 사용해 http 응답을 만든다. 만들어진 http 메시지는 다시 TCP를 이용해 요청한 컴퓨터로 전송한다. 도착한 http 응답 메시지는 http 프로토콜을 사용해 웹 페이지 데이터로 변환한다. 변환된 웹 페이지의 데이터는 웹 브라우저에 의해 출력된다. 요약 URL..
-
Ajax 정리Topic/JavaScript 2022. 3. 26. 17:26
Ajax란? Asynchronous Javascript and XML의 약자로 간단히 정리하면 XMLHttpRequest를 이용해서 새로고침없이 페이지의 일부를 로드하는 방법이다. 자바스크립트를 사용한 비동기 통신이며, 클라이언트와 서버간에 XML 데이터를 주고받는 기술이다. 비동기 방식 웹페이지를 새로고침하지 않고 데이터를 불러옵니다. Ajax를 통해 서버에 요청을 해도, 프로그램은 멈추지 않고 계속 돌아간다. 비동기 방식을 이용하면 시간 단축의 효과와 더불어 화면을 리로드하는 경우 필요한 부분만 가져오는 장점이 있다. Ajax를 쓰는 이유 단순하게 웹에서 데이터를 조회하고 싶은 경우, 페이지 전체를 새로고침하지 않기 위해 사용한다. 일반적으로 HTTP 프로토콜은 단방향 통신이기 때문에, 클라이언트에서..
-
[ERROR] You are running `create-react-app` 4.0.3, which is behind the latest releaseerror handling 2022. 3. 25. 22:01
npx create-react-app sparrow 요새 인증/보안 파트를 배우면서 백엔드쪽에 많이 신경쓰다보니 react 프로젝트를 하나 할까 했는데 시작부터 에러 발생했다 ! 코드로 나와있는 부분 Please remove any global installs with one of the following commands: - npm uninstall -g create-react-app - yarn global remove create-react-app 진행했는데 에러 해결은 되지 않았고, 노란색 첫 문장을 보아하니 버전 문제인 것 같았다. 해결 방법을 구글링한 결과 @latest를 붙여 최신 버전으로 react 프로젝트를 시작하면 된다 ! npx create-react-app@latest sparrow
-
SSR vs. CSR (feat. SEO)Topic/CS 2022. 3. 23. 21:16
SSR (Server Side Rendering) 웹 페이지를 브라우저에서 렌더링하는 대신, 서버에서 렌더링합니다. 브라우저가 서버에 URI로 GET 요청을 보내면, 서버는 정해진 웹 페이지 파일을 브라우저로 전송합니다. 그리고 서버의 웹 페이지가 브라우저에 도착하면 완전히 렌더립됩니다. -> 서버에서 웹 페이지를 브라우저로 보내기 전에, 서버에서 완전히 렌더링했기 때문에 Server Side Rendering이라 합니다. e.g. 웹 페이지의 내용에 데이터베이스의 데이터가 필요한 경우 -> 서버는 데이터베이스의 데이터를 불러와 웹 페이지를 완전히 렌더링한 후 브라우저에게 응답으로 보낸다. i.e. 웹 페이지를 보던 사용자가 브라우저의 다른 경로로 이동한다면 -> 이동할 때마다 서버는 다시 필요한 웹 페..
-
-
진법 변환(feat. 프로그래머스)Topic/JavaScript 2022. 3. 7. 22:25
알고리즘 문제에서 간간히 나오는 진법 변환 😇 자바스크립트에서 지원하는 내용으로 진법 변환에 활용해보자 ! 진법 변환 10진법에서 n진법으로 변환하기 let number = 10; // 10진법 -> 2, 8, 16 진법으로 변환 value.toString(2); // 1010 value.toString(8); // 12 value.toString(16); // a n진법에서 10진법으로 변환하기 let A = 1010, B = 12, C = 'a'; // 2, 8, 16 진법 -> 10진법으로 변환 Number.parseInt(A , 2); // 10 Number.parseInt(B , 8); // 10 Number.parseInt(C , 16); // 10 알고리즘 문제에서 활용하기 - 3진법에서 뒤..