짧은코딩

-문제 사이트 https://school.programmers.co.kr/learn/courses/30/lessons/150368 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 코드 function solution(users, emoticons) { let count = 0, money = 0; let allCase = []; let disCount = [10, 20, 30, 40]; // 모든 경우의 수를 구해주는 DFS function DFS(emotions, case1) { if (emotions.length < 1) { allCase.push(ca..

push useEffect(() => { if (signUpDone) { router.push("/"); } }, [signUpDone]); push를 사용하면 뒤로가기 버튼을 눌렀을 때, 다시 이전 페이지로 돌아간다. replace const router = useRouter(); useEffect(() => { if (me && me.id) { router.replace("/"); } }, [me && me.id]); replace를 사용하면 뒤로가기 버튼을 눌러도 이전 페이지로 돌아가지 못한다. 다시 뒤로 돌아가면 안되는 상황에서는 replace를 사용하는 것이 좋다.

웹 브라우저 요청 흐름 1. 사용자가 URL을 입력하여 요청을 보낸다.("https://www.google.com/search?q=hello&hl=ko"에 요청을 보냈다고 가정) 2. 웹 브라우저는 "https://www.google.com:443/search?q=hello&hl=ko"에서 DNS를 조회하고 생략된 port 번호 443을 찾아냄 그리고 HTTP 요청 메시지를 생성 3. HTTP 메시지 전송 웹 브라우저가 HTTP 메시지를 생성 -> SOCKET에서 IP, PORT 정보를 가지고 목적지 IP와 TCP 3-way handshake를 함 -> TCP/IP로 데이터를 전송하고 패킷을 씌움 -> 요청 패킷 정보가 인터넷으로 흘러감 4. 목적지에 요청 패킷이 도착 목적지에 요청 패킷이 도착하면 T..

URI(Uniform Resource Identifier) URI는 URL과 URN을 포함하는 큰 개념이며 리소스(자원)을 식별한다. 예를 들면 사람의 주민등록번호 처럼 식별하는 것이다. URL과 URN URL: 리소스의 위치, 사람으로치면 현재 있는 위치, URN: 리소스의 이름, 사람으로치면 그 사람의 이름 URN으로는 거의 찾을 수 없어서 사실상 URL만 사용한다고 보면된다. 즉, URI를 URL과 같은 의미로 봐도 된다. URL 문법 URL은 "scheme://[userinfo@]host[:port][/path][?query][#fragment]" 이런 구조를 가지고 있다. 예시로 "https://www.google.com:443/search?q=hello&hl=ko" 이렇게 사용한다. sheme..

웹팩 데브 서버가 필요한 이유 그냥 웹팩을 사용하고 코드 수정을 하면 다시 빌드 명령어를 입력하고 실행해야 바뀐 내용이 반영된다. 하지만 웹팩 데브 서버를 사용하면 코드 변경 시 자동으로 빌드하고 새로고침이 된다. 웹팩 데브 서버의 특징 웹팩 데브 서버를 사용해서 빌드를 하면 결과물이 파일 탐색기나 폴더에 보이지 않는다. 즉, 기존에 생기던 dist 폴더가 생기지 않는다. 이는 메모리에 빌드 결과를 저장하기 때문이다. 개발자 도구의 network 탭에 가면 메모리에 저장되어 있는 bundle.js가 보인다. 파일 입출력보다 메모리 입출력이 더 빠르고 자원이 덜 사용되어 효율적이다. package.json "scripts": { "test": "echo \"Error: no test specified\" ..

IP(인터넷 프로토콜) 1. 지정한 IP 주소(IP Address)에 데이터를 전달한다. 2. 패킷(packet)이라는 단위를 사용하여 데이터를 전달한다. 3. IP 패킷에는 출발지, 목적지 IP와 전송 데이터 등이 있다. 패킷은 여러 노드(서버)를 거쳐서 목적지에 도착한다. 거쳐가는 노드는 상황에 따라 달라진다. 단점 1. 비연결성을 가지고 있어서 패킷을 받을 대상이 없거나 서비스 불능이어도 패킷이 전송된다. 2. 비신뢰적이라 패킷이 중간에 사라지거나 순서대로 가지 않을 수 있다.(패킷은 보통 1500bytes씩 잘라서 보냄) 3. 같은 IP에서 사용하는 애플리케이션이 둘 이상이면 프로그램 구분이 어렵다. ex) 게임, 노래 다 듣고 있으면 어느 프로그램으로 요청을 줘야할지 모름 TCP와 UDP 인터넷..

never 타입 const x: never = 12; never는 공집합이라는 의미라서 아무런 값도 할당할 수 없다. 따라서 x에 12를 넣을 수 없다. 유닛(unit) 타입/리터럴(literal) 타입 type A = 'A'; type B = 'B'; type Twelve = 12; 유닛 타입은 never 다음으로 작은 집합이며 한 가지 값만 포함하는 타입이다. 유니온(union) 타입 type AB = 'A' | 'B'; type AB12 = 'A' | 'B' | 12; 유니온 타입은 값 집합들의 합집합이다. "|"을 사용해서 타입을 묶어줄 수 있다. -예시 const a: AB = "A"; // 정상 const c: AB = "C"; // "C"는 'AB' 형식에 할당할 수 없다. "C"는 유닛 타..

Loader module.exports = { module: { rules: [] } } 로더는 웹팩이 js가 아닌 HTML, CSS, Images, 폰트 같은 자원을 변환할 수 있도록 도와주는 속성이다. 로더는 module로 사용된다. module을 주석 처리한 경우 module을 주석 처리하고 빌드를 하면 사진 처럼 오류가 난다. js 파일 안에 css가 들어갈 수 없어서 로더를 설정하라는 메시지이다. 예시 module.exports = { module: { rules: [ { // 모든 css 확장자를 가진 파일에 use에 있는 loader를 적용하겠다라는 의미 test: /\.css$/, use: ["style-loader", "css-loader"], }, // 모든 js 파일에 대해 babel..

개인정보 수집 유효기간 JS https://school.programmers.co.kr/learn/courses/30/lessons/150370 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 코드 function checkValid(now, chk, num) { let [y1, m1, d1] = now.split("."); let [y2, m2, d2] = chk.split("."); return ((y1 - y2) * 12 + (m1 - m2)) * 28 + (d1 - d2) >= num * 28; } function solution(today, ter..

양과 늑대 https://school.programmers.co.kr/learn/courses/30/lessons/92343 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 코드 function solution(info, edges) { let max = 1; let graph = {}; for (let [a, b] of edges) { graph[a] ? graph[a].push(b) : (graph[a] = [b]); } function DFS(now, sheep, wolf, list) { max = Math.max(max, sheep); if (sheep