분류 전체보기 (59) 썸네일형 리스트형 09. 연결지향형 TCP 프로토콜 TCP 프로토콜 TCP가 하는 일 전송 제어 프로토콜(Transmission Control Protocol, TCP)은 인터넷에 연결된 컴퓨터에서 실행되는 프로그램 간에 통신을 안정적으로, 순서대로, 에러 없이 교환할 수 있게 함 TCP의 안정성을 필요로 하지 않는 애플리케이션의 경우 일반적으로 TCP 대신 비접속형 사용자 데이터그램 프로토콜(UDP)을 사용 TCP는 UDP보다 안전하지만 느림 TCP의 구조 안전한 연결을 지향하는 TCP 프로토콜 window: 데이터를 얼마나 더 보내야할 지 알려줌 TCP 플래그 TCP 플래그의 종류 어떤 플래그를 셋팅하고 보내느냐에 따라서 연결 유형이 달라짐 TCP의 주된 기능이 플래그에 따라 나뉘어 짐 U(Urgent Flag): 보내는 데이터에 급한 데이터가 있음 .. 08. 비연결지향형 UDP 프로토콜 UDP 프로토콜 UDP가 하는 일 사용자 데이터그램 프로토콜 (User Datagram Protocol, UDP)은 유니버셜 데이터그램 프로토콜 (Universal Datagram Protocol)이라고 일컫기도 함 전송 방식은 너무 단순해서 서비스의 신뢰성 낮음, 데이터 도착 순서가 바뀌거나, 중복되거나, 통보 없이 누락됨 일반적으로 오류의 검사와 수정이 필요 없는 프로그램에서 수행할 것으로 가정 UDP 프로토콜을 사용하는 프로그램 DNS 서버 도메인을 물으면 IP 을 알려줌 tftp 서버 UDP로 파일 공유 RIP 프로토콜 라이팅 정보를 공유 실습 tftpd를 사용하여 데이터 공유 tftpd64 다운로드 해당 프로그램 실행 호스트: 공유할 경로 설정 및 IP 주소를 선택 클라이언트: Tftp Clie.. [React 기초] 08. 예제 - Movie info 영화 정보 api API Documentation - YTS YIFY Official YTS YIFY API documentation. YTS offers free API - an easy way to access the YIFY movies details. yts.mx 아래 조건을 사용한 api를 사용함 https://yts.mx/api/v2/list_movies.json?minimum_rating=8.5&sort_by=year import { useEffect, useState } from "react"; function App() { const [loading, setLoading] = useState(true); const [movies, setMovies] = useState([]); const.. [React 기초] 07. 예제 - Coin tracker 코인 파프리카 api 해당 주소를 fetch하여 api 요청하고, then, 응답으로 온 response를 json으로 변환하고, then, json으로 변환된 데이터를 console.log 해보기 위 과정은 처음 랜더링할 때 한 번만 하면 되므로 useEffect(funciton, []) 적용 useEffect(() => { fetch("https://api.coinpaprika.com/v1/tickers") .then((response) => response.json()) .then((json) => console.log(json)); }, []); 위 코드는 async와 await을 사용한 코드로 사용할 수 있음 const getCoin = async () => { const response = a.. [React 기초] 06. 예제 - Todo List JS 문법 전개구문 전개 구문 - JavaScript | MDN 전개 구문을 사용하면 배열이나 문자열과 같이 반복 가능한 문자를 0개 이상의 인수 (함수로 호출할 경우) 또는 요소 (배열 리터럴의 경우)로 확장하여, 0개 이상의 키-값의 쌍으로 객체로 확장시 developer.mozilla.org 전개 구문을 사용하여 기존 배열에서 새로운 배열을 쉽게 추가할 수 있음 const array = [1, 2, 3, 4]; const newElement = 5; const newArray = [...array, newElement]; map map 함수를 사용하여, Array에 있는 요소를 react element로 출력할 수 있음 { toDos.map((item, index) => {item}); } Todo.. 07. 컴퓨터 프로그램끼리 데이터 주고 받는 방법 (4계층) 4계층 프로토콜 4계층에서 하는 일 전송 계층(Transport Layer)는 송신자의 프로세스와 수신자의 프로세스를 연결하는 통신 서비스를 제공 전송 계층은 연결 지향 데이터 스트림 지원, 신뢰성, 흐름 제어, 그리고 다중화 같은 편리한 서비스 제공 종류 전송 제어 프로토콜(Transmission Control Protocol): 연결 지향 전송 방식을 사용 사용자 데이터그램 프로토콜(User Datagram Protocol):보다 단순한 전송에 사용 UDP(User Datagram Protocol) 안전한 연결을 지향하지 않는 UDP 프로토콜 (전송 여부 미확인) TCP(Transmission Control Protocol) 안전한 연결을 지향하는 TCP 프로토콜 (전송 여부 확인) 6분 46초 포트.. [React 기초] 05. effects 아래 코드에서 state가 변경될 때마다, console.log가 실행된다. 첫 번째 render할 때만 실행하고 싶다면? import { useState } from "react"; function App() { const [counter, setValue] = useState(0); const onClick = () => setValue((prev) => prev + 1); console.log("call an API"); return ( {counter} Click me! ); } export default App; useEffect 컴포넌트 안에 딱 한 번만 실행하고 싶은 코드가 있을 경우 컴포넌트 안에 특정 데이터가 변화할 때만 실행해야하는 경우 dependencies: React가 지켜봐야하는.. [React 기초] 04. create-react-app https://create-react-app.dev/ Create React App Set up a modern web app by running one command. create-react-app.dev 실행하기 위해서는 NodeJS가 필요함 npx는 패키지 실행을 위한 도구로, 패키지의 최신버전 파일을 불러와 설치하여 실행시키고 실행된 이후에 해당 패키지를 제거하는 방식 npx create-react-app my-app my-app으로 파일 생성되고 안에 패키지가 설치됨 package에 기본적인 명령어가 설정되어 있음 개발용 server를 열게됨 package.json에서 기본적으로 설정된 명령어를 scripts에서 확인 가능 살펴보기 index.js에서 App을 랜더링하고 있음 css를 impor.. 이전 1 ··· 3 4 5 6 7 8 다음
