728x90 반응형 전체 글145 [컴퓨터 네트워크/스터디] TCP 1. TCP(Transmission Control Protocol) 1-1. TCP에 대해 설명해주세요. 가이드: TCP 특징에 대해서 설명하기(신뢰적 데이터 전송 중심으로) TCP는 연결 지향형이고, 신뢰적인 데이터 전송을 보장하는 프로토콜 입니다. TCP는 통신 시작전에 3-way-handshake를 통해 사전 연결 설정을 한 다음 통신을 진행 합니다. 그리고 전송한 패킷에 대한 확인 응답, 재전송, 패킷의 순서번호, 타이머 등을 통해 신뢰적인 데이터 전송을 보장 합니다. 추가로 흐름제어와 혼잡제어를 통해 송신자의 패킷 전송 속도를 조절하는 기능이 있습니다. TCP는 가상회선방식을 사용할까? - 가상회선방식: 데이터를 전송하기 전에 논리적인 회선을 먼저 설정하고, 이후에 데이터를 전송하는 방식 TCP.. 2023. 4. 24. [컴퓨터 네트워크/스터디] UDP, 신뢰적 데이터 전송의 원리 1. UDP 1-1. UDP에 대해 설명해주세요. 가이드: TCP와 비교해서 UDP의 특성을 설명 TCP 문제점을 해결하기 위해 나온 개념이 UDP(User Datagram Protocol)입니다. TCP는 전송의 신뢰성은 보장하지만 매번 3-way handshake를 사용하여 Connection을 연결하기 때문에 시간 손실이 발생합니다. 그리고 패킷을 조금만 손실해도 재전송을 해야한다는 문제점이 있습니다. UDP는 TCP보다 신뢰성이 떨어지지만 전송 속도가 일반적으로 빠른 프로토콜입니다. TCP와 다르게 Connection을 끊은 상태로 통신을 하는, 즉 일방적으로 데이터를 발신하는 비연결성 프로토콜이기 때문입니다. 그리고 순차 전송, 흐름 제어, 혼잡 제어를 하지 않고, UDP 체크섬을 사용하여 에러.. 2023. 4. 21. [코드스피츠/CSS] Display Model, Flex Box 전부 다 정리하기보다는 새롭게 알게 된 것들이나 기억하고 싶은 것들을 정리했다. 풀 강의는 유투브에서 확인하는 것이 좋다. Display Model 박스 생성 display: none; box를 무시할 때 사용 display: contents; 마찬가지로 box 모델을 무시한다. 자기 자신의 content를 무시하고, layout 상으로 부모 요소로 승격시켜 그릴 수 있다. Flex Box justify-content는 메인 축에 적용되는 속성이다. flex-start flext-end center space-between space-around align-items는 cross 축에 적용되는 속성이다. flex는 원래 한 줄을 사용하는 것이 기본값이다. 하지만 flex-wrap: wrap;을 사용하면 .. 2023. 4. 20. [프로그래머스-문자열 다루기 기본] 지수 표기법, 그게 뭔데? 프로그래머스 문제를 풀면서 엄청나게 간단한 문제인데 모든 테스트가 통과되지 않았다. // 테스트 미통과 코드 function solution(s) { if ((!isNaN(s) && s.length === 4) || (!isNaN(s) && s.length === 6)) return true; else return false; } 그 이유는 바로 지수 표기법(e) 때문이였다. 문제는 매우 간단하다. 만약 문자열이 모두 숫자로 구성되어 있다면 true를 리턴하고, 그렇지 않다면 false를 리턴해주면 되었다. 하지만, 여기서 문제점은 문자열이 "3e10"처럼 지수 표기법으로 표현되었을 경우이다. 대개 프로그래밍 언어에서 실수를 표기할 때 지수 표기법을 지원한다. 예를 들어 5e3은 5 * 1000을, -4.. 2023. 4. 19. [컴퓨터 네트워크/스터디] HTTP, HTTPS, DNS 1. HTTP 1-1. HTTP 프로토콜이 무엇인가요? 가이드: 웹에서 HTTP가 어떤 역할을 하는지 설명하기 HTTP 프로토콜(HyperText Transfer Protocol)은 텍스트 기반의 통신 규약으로 HTML 문서와 같은 리소스들을 가져올 수 있도록 해주는 통신 프로토콜입니다. 웹에서 브라우저와 서버 간에 데이터를 주고받기 위한 방식으로 HTTP 프로토콜을 사용합니다. HTTP 프로토콜은 클라이언트-서버 모델을 따르고, 애플리케이션 레벨의 프로토콜로(7 계층), 일반적으로 TCP/IP 통신 위에서 동작하며 기본 포트는 80번입니다. 클라이언트-서버 프로토콜(보통 웹브라우저) 수신자 측에 의해 요청이 초기화되는 프로토콜입니다. 하나의 완전한 문서는 텍스트, 레이아웃 설명, 이미지, 비디오, 스크.. 2023. 4. 17. [JS/오류해결] Uncaught (in promise) TypeError: Failed to execute 'json' on 'Response': body stream already read 문제 상황 fetch를 사용하고, 응답을 받을 때 response.json()을 사용한다. 이때 response.json()을 2번 사용하면 오류가 발생한다. fetch('https://www.naver.com/') .then((response) => { console.log(response); if (response.ok) { console.log(response.json()); return response.json(); // 오류 발생 } }); 원인 response.json()은 HTTP 응답에서 JSON 데이터를 추출하기 위한 메서드이다. 이 메서드는 해당 HTTP 응답의 body를 읽어서 JSON 객체로 변환해 주는 역할을 한다. HTTP 응답의 body는 일반적으로 string으로 전송되고, .. 2023. 4. 16. [React] 값을 수정할 때 페이지가 번쩍 거리는 현상 제거하기 페이지가 번쩍 거리는 현상 위의 동영상에서 확인할 수 있듯이 Todo를 수정하고 제출했을 때 뭔가 번쩍 거리는 듯한 느낌이 있다. 일단 결론부터 말하면, 투두를 수정할 때 updateTodoApi를 호출하게 되는데 updateTodoApi는 또 getTodoApi를 호출하고 있었기 때문이다. 여기서 updateTodoApi는 데이터를 수정할 때 발생하고, getTodoApi는 화면에 그릴 데이터를 가져올 때 발생한다. 처음에 이러한 방식으로 코드를 작성한 이유는 서버에 데이터를 저장하고 있기 때문에 수정한 데이터를 화면에 보여주기 위해서 getTodoApi를 계속해서 호출해야겠다고 생각했기 때문이다. 하지만 그러면 제목처럼 화면이 번쩍인다. 그 이유는, 통신을 하고 난 후에 화면에 데이터를 그리기 때문에.. 2023. 4. 15. localStorage.getItem()을 상수로 빼서 사용하면 동작하지 않는 이유 localStorage.getItem()을 여러 페이지에서 사용하고 있었다. 중복되는 코드를 제거하기 위해 리팩터링을 하고 있었기 때문에 localStorage.getItem() 또한 상수로 빼서 관리를 하려고 했었다. 그럼 따로 정의해 둔 변수명을 사용하여 localStorage의 값을 가져오면 되니깐 엄청 편하겠다!라고 생각했던 것이다. 결론적으로 제목과 같이 localStorage.getItem()을 상수로 빼서 사용하면 안 된다. 첫 번째 이유는 값을 가져올 수 없기 때문이다. 아래 코드에서 console.log(access_token) 값은 null이 되는 것을 확인할 수 있다. 이를 해결하기 위해서는 window.localStorage.getItem()을 사용하면 원하는 값을 가져올 수 있다... 2023. 4. 15. [컴퓨터 네트워크/스터디] 네트워크 레이어 1. 컴퓨터 네트워크에 대해서 설명해 주세요. ☝🏻 컴퓨터 네트워크가 무엇인지 간략하게 설명해보기 핵심 키워드: 웹, WWW, 인터넷 ✌🏻 컴퓨터 네트워크에 대해 좀 더 자세히 설명해보기 핵심 키워드: 라우터, 호스트, 클라이언트, 서버, IP주소, 스위치, 스위칭 🤟🏻 네트워크에서 컴퓨터들이 어떻게 데이터를 주고 받는지 설명해보기 핵심 키워드: 회선교환방식, 패킷교환방식 ☝🏻 1단계 답변 컴퓨터 네트워크는 데이터를 주고받기 위해 서로 다른 컴퓨터들이 통신망을 통해 연결된 체계입니다. 전 세계가 연결되어 있는 네트워크 중 하나는 인터넷입니다. 인터넷은 컴퓨터 네트워크가 수없이 모여서 이루어진 컴퓨터 네트워크 시스템입니다. 인터넷 서비스의 종류 중의 하나인 WWW는 World Wide Web의 약자로 인터.. 2023. 4. 13. [React] 자식 컴포넌트에서 부모 컴포넌트로 데이터 전달하는 법 주로 부모 컴포넌트에서 자식 컴포넌트로 props를 전달하지만, 종종 자식 컴포넌트에서 부모 컴포넌트로 데이터를 전달하고 싶은 경우가 있다. 부모 컴포넌트 import React, { useState } from "react"; import Child from "./components/Child"; function Parent() { const [todoList, setTodoList] = useState([]); return ; } export default Parent; 자식 컴포넌트 mport React, { useState } from "react"; function Child({ parentFunction }) { const [data, setData] = useState(2); parentFu.. 2023. 4. 12. 이전 1 ··· 4 5 6 7 8 9 10 ··· 15 다음 728x90 반응형
