const ProductsList = () => { const [currentPage, setCurrentPage] = useState(1); const {data: products, isLoading, isError} = useQuery('products', ProductsList); const handlePageChange = newPage => { setCurrentPage(newPage); }; return ( );};   const Pagination = ({currentPage, itemsPerPage, totalItems, onPageChange}) => { const totalPage = Math.ceil(totalItems /..

01. 데이터 구조const folderData = [ { id: 1, name: "Root Folder", children: [ { id: 2, name: "Sub Folder 1", children: [ { id: 3, name: "File 1" }, { id: 4, name: "File 2" } ] }, { id: 5, name: "Sub Folder 2", children: [ { id: 6, name: "File 3" } ] } ] }]; 02. 재귀 컴포넌트 구조import React f..

01. 3계층 IP가 하는 일 : 멀리 있는 컴퓨터끼리 데이터 주고 받음 => IPv4: 데이터가 정확하게 전달 보장 X: 중복 패킷 전달 가능 & 패킷 순서의 잘못 전달 가능 => DoS 공격이 됨: 데이터의 정확하고 순차적인 전달은 tcp에서 보장! * 총 20바이트 (옵션이 있어서 최대 60바이트, 일반적으로 옵션 없이 사용)  * Version : IP버전 4 Or 6 (4)* IHL : 헤더의 길이/4 = 최소 20바이트 ~최대 60바이트 (15) (예시로 20바이트 = 5 => 0101(2) ) * Type of Service(= Differentiated Services Field)  = 초기에 사용했지만 요즘은 사용 안해서 0으로 처리 * Total Length : Payload까지 합쳐진..

01. 3계층 ARP가 하는 일 : Address Resolution Protocol: ARP는 같은 네트워크 대역에서 통신하기 위해 IP주소를 이용해서 상대방의 MAC 주소 알아오는 프로토콜: 같은 네트워크 대역에서 통신한다고 해도  7계층부터 캡슐화를 통해 데이터를 보내기 때문에 IP주소 MAC주소 모두 필요함 * Hardware type : 2계층에서 사용하는 프로토콜 타입 (이더넷 0001)* Protocol Type  :  Source Protocol의 타입 (IPv4 0800) 16진수 = 4비트 * Hardware Address Length : MAC주소의 길이 (6바이트 = 06)* Protocol Address Length   : IPv4주소의 길이  (4바이트 = 04)* Opcode ..

01. 7계층에서 하는 일 : HTTP (HyperText Transfer Protocol): www에서 쓰이는 핵심 프로토콜 (문서의 전송에 사용) (1) HTTP 1.0 특징: 연결 수립, 동작, 해제의 단순함이 특징: 문제점 = 단순동작의 반복으로 통신 부하 문제 발생=>  HTTP 1.1 보완 (연결했으면, 데이터 다 받아가고 종료해라) 02.  HTTP 요청 프로토콜* 요청타입 : GET, POST 등* 공백 : space* URI : 주소 전체  (ex. https://www.youtube.com/watchv=2ikhZ_fNP5Y&list=PL0d8NnikouEWcF1jJueLdjRIC4HsUlULi&index=30)=> 인터넷 상에서 특정자원(파일)을 나타내는 유일한 주소* HTTP 버전 :..

01. 4계층에서 하는 일 (전송계층): 송신자와 수신자의 프로세스를 연결하는 통신 서비스(1) TCP : 연결 / 데이터 주고 받을 때 (2) UDP : 비연결 / 데이터 던지기  02. 포트번호: 특정 프로그램이 사용하는 주소 : 하나의 포트는 하나의 프로세스만 사용 가능 : 하나의 프로세스는 여러개의 포트 사용 가능(1) well-known 포트 : HTTP 80 / HTTPS 443  등(2) registered 포트 : 오라클 DB 서버 (1521) / MYSQL 서버 (3306) / MS 원격 데스크탑 (3389)(3) dynamic 포트 :일반 사용자들이 사용하는 포트  (49152 ~ 65535)   03. 프로그램 연결정보: cmd > "netstat -ano" (연결정보 확인)* 네이버..