짧은코딩

CORS cors에 대해 알기 위해서는 먼저 sop에 대해 알아야 한다. sop(same-origin policy) sop는 동일 출처 정책으로도 부른다. 불러온 문서, 스트립트의 출처가 다르면 리소스와의 상호장용하는 것을 제한하는 중요한 보안 방식이다. sop는 해로울 수 있는 문서를 분리하여 공격받을 수 있는 경로를 줄여준다. -출처의 정의 두 URL의 프로토콜, 포트(명시한 경우), 호스트가 모두 같아야 동일한 출처이다. 예를 들어서 http://store.company.com/dir/page.html과 출처를 비교하면 이런 결과가 나온다. CORS(Cross-Origin Resource Sharing) CORS는 교차 출처 리소스 공유라고도 하며, 추가 HTTP를 헤더를 사용해 실행 중인 웹 애플..

Link import { Link } from 'react-router-dom'; 로그인 하러가기 이렇게 Link를 써야 SPA가 유지된다. swr swr은 원격데이터 fetch를 위한 커스텀 훅 npm 모듈이다. useSWR(Key, Fetch) Fetch 함수를 이용해 key라는 주소에서 가져오는 데이터를 전역적으로 관리할 수 있다. 즉 swr은 데이터를 가져오기 위한 리액트 훅이다. -swr 활용 방법 swr은 비동기랑 get 요청에 얽매이지 않고 fetherPost 이렇게 만들어서 post 요청도 사용할 수 있다. 결국 swr로 전역 데이터를 관리할 수 있다는게 중요하다. 즉 전역 스토리지 역할을 할 수 있다. swr을 잘 활용하려면 백엔드에서 오는 데이터를 그대로 사용하는 것이 아니라 fethe..

관계 DB에는 여러 테이블이 있고 테이블끼리 서로 관계가 정의되어 있고 관계화살표로 나타낼 수 있다. -1 : 1 관계 예를 들면 유저당 이메일은 한 개씩 있다. 이런 경우 1 : 1 관계이다. 1 : 1 관계는 테이블을 2개로 나눠서 테이블 구조 이해가 쉽다. -1 : N 관계 예를 들면 쇼핑몰에서 유저가 여러 개의 상품을 장바구니에 넣을 수 있다. 이런 경우 1 : N 관계가 된다. 하나도 넣지 않는 0개의 경우도 있으니 이런 경우에는 화살표를 통해 표현해야 한다. 한 개체가 다른 여러 개체를 포함하는 관계이다. -N : M 관계 예를 들면 학생과 강의의 관계를 보면 학생은 여러 강의를 들을 수 있고 강의도 여러 명의 학생이 포함될 수 있다. 이런 경우 N : M이 된다. N : M 관계는 테이블을 ..

https://www.acmicpc.net/problem/18406 18406번: 럭키 스트레이트 첫째 줄에 점수 N이 정수로 주어진다. (10 ≤ N ≤ 99,999,999) 단, 점수 N의 자릿수는 항상 짝수 형태로만 주어진다. www.acmicpc.net 해결법 이 문제는 숫자를 입력 받고 mid로 왼쪽 값과 오른쪽 값을 나눌 수 있다. 그리고 left, right에 값을 저장하고 left와 right가 같으면 LUCKY를 출력하고 다르면 READY를 출력한다. 코드 n = input() ary = [] for i in range(len(n)): ary.append(int(n[i])) left = 0 right = 0 mid = len(n) // 2 for i in range(mid): left +..

CPU는 메모리에 올라와 있는 명령어를 실행할 뿐이다. 메모리 계층 메모리는 레지스터, 캐시, 메모리, 저장장치로 구성된다. -레지스터 CPU 안에 있는 작은 메모리이다. 휘발성 속도: 빠름 기억 용량: 가장 적음 -캐시 L1, L2 캐시이다. 휘발성 속도: 빠름 기억 용량: 적음 -주기억장치 RAM을 가리킨다. 휘발성 속도: 보통 기억 용량: 보통 -보조기억장치 HDD, SSD를 말한다. 비휘발성 속도: 느림 기억 용량: 많음 캐시(cache) 캐시는 데이터를 미리 복사해두는 임시 저장소이다. 그리고 장치간의 속도 차이에 따른 병목 현상을 줄일 수 있다. 실제로 메모리와 CPU 사이의 속도 차이가 너무 커서 레지스터 계층을 이용해서 속도 차이를 해결한다. => 이렇게 계층과 계층 사이에 있는 것을 캐시..

내 풀이 from collections import deque n = int(input()) ary = list(map(int, input().split())) ary.sort() ary = deque(ary) answer = 0 while ary: max = ary.pop() - 1 while True: if ary: ary.popleft() max -= 1 if max == 0: answer += 1 break else: break print(answer) 일단 각 인원들의 공포도를 입력 받고 오름차순으로 정렬한다. 그리고 answer에 완성된 팀의 수를 저장한다. 내가 푼 풀이로는 가장 큰 수를 max에 저장하고 그 인원이 들어왔으니 -1을 해서 저장한다. 그리고 공포도가 낮은 인원을 max가 0이..

해결법 이 문제는 위상 정렬로 풀면 되는 문제이다. 위상 정렬로 구현은 잘 했지만 디테일한 해결법은 생각하지 못했다. 처음에 각 과목이 걸리는 시간을 저장한 리스트를 만든 다음에 현재 노드에서의 시간과 다음으로 할 과목의 시간을 더한 값을 리스트에 갱신하면서 해결하면 된다. 이때 copy 라이브러리에서 deepcopy 함수를 사용한다. 이것을 사용하지 않으면 얕은 복사가 이루어져서 값이 꼬이게 된다. 자세한건 코드에서 보면 될 것 같다. 코드 from collections import deque import copy n = int(input()) indegree = [0] * (n+1) graph = [[] for i in range(n+1)] weight = [0] * (n+1) for i in ran..

axios Axios는 node.js와 브라우저를 위한 Promise 기반 HTTP 클라이언트이다. 서버에서는 네이티브 node.js의 http 모듈을 사용하고, 클라이언트(브라우저)에서는 XMLHttpRequests를 사용한다. 사용법 -back 서버에 보내는 주소 리스트 https://github.com/ZeroCho/sleact/blob/master/API.md GitHub - ZeroCho/sleact Contribute to ZeroCho/sleact development by creating an account on GitHub. github.com axios .post('http://localhost:3095/api/users', { email, nickname, password, }) //..

커스텀 훅 커스텀 훅이란 리액트에서 기본 제공하는 훅을 합쳐서 사용자가 훅을 만드는 것이다. 예를 들어 useState와 useCallback을 합쳐서 새로운 훅을 만들 수 있다. import { useCallback, useState } from 'react'; const useInput = (initialData) => { const [value, setValue] = useState(initialData); const handler = useCallback((e: any) => { setValue(e.target.value); }, []); return [value, handler, setValue]; }; export default useInput; 이런 식으로 useState, useCallba..

preventDefault preventDefault는 form 태그에서 제출 버튼을 누르게 되면 href 를 통해 이동하거나, 창이 새로고침하여 실행된다. preventDefault 를 통해 이러한 동작을 막아줄 수 있다. 우리는 SPA 방식을 사용하기 때문에 preventDefault가 필요하다. TS에서 any, unknown, 제너릭 타입 -any any 타입은 어떤 타입이라도 올 수 있는 것이다. 하지만 이러면 ts를 사용하는 의미가 없고 개발할 때 이로 인해 에러가 발생할 수 있다. 따라서 any 타입은 조심해서 사용해야 한다. -unknown unknown 타입은 any 타입과 동일하게 모든 값을 허용하지만, 할당된 값이 어떤 타입인지 모르기 때문에 함부로 프로퍼티나 연산을 할 수 없다. -..