본문 바로가기

분류 전체보기

 (432)
[React] Error: Rendered more hooks than during the previous render 이슈/원인 Rendered more hooks than during the previous render 이전 렌더링에서 호출된 hooks보다, 현재 렌더링에서 호출된 hooks가 더 많은 경우에 발생하는 에러 React는 Hook이 호출되는 순서에 의존한다 React는 Hook이 호출되는 순서에 의존한다. Hook이 함수의 상태를 기억하기 위해서, 호출 순서를 이용하여 함수의 상태를 기억했다가 이전의 상태를 가져온다. 따라서 렌더링되는 순서가 동일해야 React가 locale state를 각 Hook에 연동할 수 있다. 즉, Hook가 매 렌더링마다 동일한 순서로 동일한 개수만큼 호출을 보장 받아야한다. 그래서 Hook을 조건문, 반복문, 함수 안에서 작성하는게 금지되어 있고, 컴포넌트 최상단에서 호출하..
[모든 개발자를 위한 HTTP 웹 기본 지식] 7. HTTP 헤더1 - 일반 헤더 HTTP 헤더 개요 과거의 HTTP 헤더(RFC2616) 헤더 분류 General 헤더: 메시지 전체에 적용되는 정보 (ex. Connection: close) Request 헤더: 요청 정보(ex. User-Agent: Mozilla/5.0 …) Response 헤더: 응답 정보 (ex. Server: Apache) Entity 헤더: 엔티티 바디 정보 (ex. Content-Type: text/html, Content-Length:3423) HTTP Body 엔티티 헤더: 엔티티 본문의 데이터를 해석할 수 있는 정보 제공 데이터 유형(html, json), 데이터 길이, 압축 정보 등 엔티티 본문: 요청, 응답에서 전달할 실제 데이터 메시지 본문은 엔티티 본문을 전달하는데 사용함 (메시지 본문 안에 ..
VSCODE에서 한글로 작성된 부분만 검색하기 1. 검색을 연다. 단축키: Cmd + Shift + F 혹은 검색 메뉴를 누르면 됨 2. Use Regular Expression 을 켠다. 3. [^\x00-\x7F]+ 키워드를 입력하여 검색한다.
[모든 개발자를 위한 HTTP 웹 기본 지식] 6. HTTP 상태 코드 HTTP 상태코드 소개 상태 코드 클라이언트가 보낸 요청의 처리 상태를 응답에서 알려주는 기능 1xx (informational): 요청이 수신되어 처리 중 거의 사용하지 않으므로 생략 2xx (successful): 요청 정상 처리 3xx (redirection): 요청을 완료하려면 추가 행동이 필요 4xx (client error): 클라이언트 오류, 잘못된 문법 등으로 서버가 요청을 수행할 수 없음 5xx (server error): 서버 오류, 서버가 정상 요청을 처리하지 못함 만약 모르는 상태 코드를 서버가 반환하면? 클라이언트는 상위 상태코드로 해석해서 처리함 따라서 미래에 새로운 상태 코드가 추가된다 하더라도 클라이언트를 변경하지 않아도 됨 ex. 299 → 2xx (successful) 2..
[모든 개발자를 위한 HTTP 웹 기본 지식] 5. HTTP 메서드 활용 클라이언트에서 서버로 데이터 전송 데이터 전달 방식(크게 2가지) 쿼리 파라미터를 통한 데이터 전송 GET 주로 정렬 필터(검색어) 시 사용 메시지 바디를 통한 데이터 전송 POST, PUT, PATCH 회원가입, 상품 주문, 새로운 리소스 등록, 리소스 변경 클라이언트에서 서버로 데이터를 전송하는 4가지 상황 정적 데이터 조회 동적 데이터 조회 HTML Form을 통한 데이터 전송 회원 강비, 상품 주문, 데이터 변경 HTTP API를 통한 데이터 전송 회원 가입, 상품 주문, 데이터 변경 서버 to 서버, 앱 클라이언트, 웹 클라이언트(Ajax) 1. 정적 데이터 조회 이미지, 정적 텍스트 문서 조회는 GET 사용 쿼리 파라미터 미사용 정적 데이터는 일반적으로 쿼리 파라미터 없이 리소스 경로로 단순하..
[모든 개발자를 위한 HTTP 웹 기본 지식] 4. 메서드 API URI 고민 URI = 리소스 + 해당 리소스를 대상으로 하는 행위 리소스 = 회원(/members) 명사 계층 구조상 상위를 컬렉션으로 보고, 복수단어 사용 권장(member → members) 최근에는 리소스 → 표현(representation)으로 용어가 변경됨 메서드 = 조회, 등록, 삭제, 변경 동사 리소스를 식별함 HTTP 메서드 주요 메서드 GET: 리소스 조회 POST: 요청 데이터 처리, 주로 등록에 사용 PUT: 리소스를 대체, 해당 리소스가 없으면 생성 PATCH: 리소스 부분 변경 DELETE: 리소스 삭제 기타 메서드 HEAD: GET과 동일하나, 메시지 부분만 제외하고 상태 줄과 헤더만 반환 OPTIONS: 대상 리소스에 대한 통신 가능 옵션(메서드)를 설명(주로 CORS..
[모든 개발자를 위한 HTTP 웹 기본 지식] 3. HTTP 기본 🍒 Recap HTTP 메시지에 모든 것을 전송함 HTTP 역사: HTTP/1.1을 기준으로 학습해야 함 HTTP/2, HTTP/3 은 성능과 관련. 1.1버전만 제대로 학습하면 됨 클라이언트 - 서버 구조 HTTP는 무상태 프로토콜(Stateless)을 지향 HTTP 메시지 = 시작라인 + 헤더 + CRLF + 바디 단순함, 확장 가능 지금은 HTTP 시대! 다시 살펴보고 가자: TCP/IP 4계층 모든 것이 HTTP HTTP HTTP(=HyperText Transfer Protocol) Hypertext: HTML과 같은 문서 Hypertext를 전송하는 것 프로토콜로 시작됨 HTTP 메시지에 모든 것을 전송 거의 모든 형태의 데이터 전송 가능 HTML, TEXT IMAGE, 음성, 영상, 파일 JS..
[모든 개발자를 위한 HTTP 웹 기본 지식] 2. URI와 웹 브라우저 요청 흐름 URI URI(Uniform Resource Identifier) - 리소스를 식별하는 통합된 방법 URI? URL? URN? “URI는 로케이터(Locator), 이름(Name) 또는 둘 다 추가로 분류될 수 있다” 리소스를 식별한다? 자원이 어디에 있는지 식별함. 사람을 식별하기 위해 주민등록번호를 사용하는 것을 생각하면 됨. URI Uniform: 리소스 식별하는 통일된 방식 Resource: 자원, URI로 식별할 수 있는 모든 것(제한 없음) Identifier: 다른 항목과 구분하는데 필요한 정보 URL, URN URL (Uniform Resource Locator): 리소스가 있는 위치를 지정 (ex. 서울시 강남구 …) URN (Uniform Resource Name): 리소스에 이름을 부..
반응형

티스토리툴바