클라우드 지망생의 공부 블로그

왜 Next.JS를 사용해야만 하는가?React 프레임워크의 한계 => 원칙적으로 CSR만 가능.CSR은 서버에서 핵심 HTML을 받은 뒤 이를 기반으로 렌더링을 하기 때문에, 서버가 렌더링을 전담하는 SSR에 비해 SEO(검색 엔진 최적화)의 효과를 볼 수가 없다.SEO의 효과를 보려면 서버에서 렌더링을 해야 한다 => SSR이 되면 클라이언트 쪽에서 HTML 페이지를 다운받아 표시한다 => JS 다운로드까지 완료되면 사용자 상호작용도 가능해진다.웹 페이지를 렌더링하는 2가지 방식: 서버 사이드 렌더링 vs 클라이언트 사이드 렌더링. SSR이란 무엇인가? 고전적인 웹페이지 렌더링 방식. 1) 서버를 향해, 클라이언트가 페이지를 요청한다. 2) 그러면 서버는 요청/Request를 수락한 후, 전체 HTM..

1. 컴포넌트란 무엇인가?컴포넌트란 다시 사용할 수 있는 코드 블록을 말한다.크게 함수형 컴포넌트와 클래스형 컴포넌트로 나뉘며, 함수형 컴포넌트가 더 자주 쓰인다. import React from 'react'; const Greeting = (props) => {   return Hello, {props.name}!; }; export default Greeting; 위의 코드에서, Greeting이라는 함수를 만들었다.인사를 위한 서식은 이 함수로 만들어졌으므로, 다른 컴포넌트에서는 이 인사를 하는 대상이 누구인지만 지정하면 된다.2. API란 무엇인가?이번 4주차에서 사용한 API는 웹 서비스 연동의 기능을 갖는다.Tmdb 사이트에의 영화 목록을 제공하는 API를 이용하여, 클론 넷플릭스의 fron..

과제 목록1. SPA란 무엇인가?2. React란 무엇인가? + 컴포넌트란 무엇인가?3. JSX란 무엇인가?1. SPA = Single Page Application.SPA는 네이버 연관검색어 확인이나 언론사 뉴스 스탠드 조작 등을 포함한 웹과 사용자의 상호작용에 걸리는 대기시간을 최소화시켜 준다. 이 최소화 작업에 요구되는 두 가지 요소가 1)AJAX, 2)XML(과거)/JSON(현재)이다.AJAX를 통해, 웹페이지를 새로고침하지 않고 필요한 데이터만 갱신할 수 있게 한다.=> 비동기성 연결. 상대의 답변과 무관하게, 나의 요청 및 다른 행동이 가능하다.JSON은 XML 대비 보다 빠르고 효율적인 데이터 표현 방식이다.2. React란 무엇인가? + 컴포넌트란 무엇인가?React는 UI를 만들 때 사용..

시도한 과제: 타이핑 게임(타자연습 게임)과제 현황   피드백 사항 정리1. 의사 코드 작성하는 연습 반복하자. 코드를 쓰는 것에 집중할 필요는 현재로서는 없다.코딩보다도 그 코딩의 결과까지 이어지는 논리를 만들어라.2. 비동기 함수는 원래 이해하기 힘들다.한 번에 30분의 제한시간을 두고, 30분 내로 이해할 수 없거든 도움을 요청하라.3. 의사 코드를 바꿀 때는, 목적을 명확히 하고 과정을 세분화하라.  3 예시 - 과제 1, '남은 시간이 0이 되면 입력 칸을 disable 시킨다' 3-1. '남은 시간' value = time left.'남은 시간이 0이 된다' = 2가지 의미.1) time left = 0이 된다.2) 0이 된 값은 음수로 떨어지지 않는다 = clearInterval(timeIn..

1. Semantic 태그란 무엇인가?2. CSS의 Selector/선택자란 무엇인가?3. CSS에서 position, display, grid, flex란 무엇인가?답 1. Semantic 태그란, 보다 분명하고 확실한 의미가 부여된 태그를 말한다.위의 예시에서, 좌측 div는 Container/구획이라는 의미만 갖는다.굉장히 넓은 의미를 가졌기에 어떤 용도로든 사용할 수 있지만, 그런 만큼 좌측 이미지처럼 한 눈에 봤을 때 "그래서 이 div 모음은 무엇인가? 무슨 일을 하기 위해 만들어졌나?" 를 알 수가 없다. 반면, 우측 이미지는 div 대신 header, footer 등의 보다 알기 쉽고 직관적인 태그를 사용한다.HTML에 대해 잘 모르더라도, Head라는 단어로부터 header란 단어의 뜻을..

1. 웹 브라우저란 무엇인가?2. 서버란 무엇인가?3. 클라이언트란 무엇인가?4. IP, DNS, DOMAIN, PORT는 무엇인가?5. 네트워크란 무엇인가?6. 공유기란 무엇인가?7. HTTPS란 무엇인가?8. DOM이란 무엇인가?9. 브라우저 렌더링이란 무엇인가?질문 1. 웹 브라우저란 무엇인가?답변 1. 웹 사이트를 검색하고, 볼 수 있게 하는 도구. 오페라, 파이어폭스, 마이크로소프트 엣지, 브레이브, 크롬 등이 존재한다. 일반적으로, 웹 사이트는 HTML, CSS, Javascript의 3가지 구성요소를 갖는다. - HTML은 웹 사이트의 뼈대이다. 웹 사이트가 전달하고자 하는 내용을 포함한다. - CSS는 웹 사이트의 근육이다. 전달할 내용을 어떻게 배치할 것인지, 어떻게 강조할 것인지 등의 ..