_app.tsx const router = useRouter() useEffect(() => { window.history.scrollRestoration = 'auto' const cacheScrollPositions: Array = [] let shouldScrollRestore : null | {x: number; y: number} router.events.on('routeChangeStart', () => { cacheScrollPositions.push([window.scrollX, window.scrollY]) }) router.events.on('routeChangeComplete', () => { if (shouldScrollRestore) { const {x, y} = shouldScr..
알고리즘 공부 하던 중 정규식을 사용해서 문자열을 치환하는 방법을 새로 알게 되었습니다. 우선 replace() 메서드는 특정 문자열을 치환 할 때 사용 합니다. ✔ 하지만, 문자열에서 변경하려는 문자가 여러 번 반복될 경우 첫 번째로 발견한 문자열만 치환 합니다. 사용법 replace('찾을 문자열 or 정규식', '변경하는 문자열') 예시 let str = "사과, 배, 수박"; let strChange = str.replace("배", "오렌지"); console.log(strChange); // 사과, 오렌지, 수박 정규식 ❓ ✔ 정해진 규칙을 사용해 모든 문자를 변환할 수도 있고 숫자,번호나 맨 처음, 맨 뒤만 변환할 수 있습니다. 정규식 옵션 옵션 g 모든 패턴 체크(global) i 대소문자..
김영한님의 모든 개발자를 위한 HTTP 웹 기본 지식을 수강하면서 정리한 내용입니다. 1. HTTP(HyperText Transfer Protocol) 문서 간의 링크를 통해서 하이퍼텍스트 문서를 통해서 연결하는 프로토콜 입니다. HTTP 프토토콜에 HTML, TEXT, IMAGE, 음성, 영상, 파일, JSON, XML (API) 등 모든 형태의 데이터를 담아서 전송이 가능하고 심지어 서버간에 데이터를 주고 받을 때도 사용 합니다. 1.1 HTTP 역사 1. HTTP/0.9 (1991년) : GET 메서드만 지원, HTTP 헤더X 2. HTTP/1.0 (1996년) : 메서드, 헤더 추가 3. HTTP/1.1 (1997년) : 가장 많이 사용하고 우리에게 가장 중요한 버전 * RFC2068 (1997년..
✅ useState 변수 선언 후 사용 안할 때 에러 제거 // eslint-disable-line no-unused-vars ✅ useEffect 내 해당 변수를 [ ] 안에 사용하지 않았을 때 에러 제거 // eslint-disable-line react-hooks/exhaustive-deps ✅ 정규식 에러 제거 //eslint-disable-line
김영한님의 모든 개발자를 위한 HTTP 웹 기본 지식을 수강하면서 정리한 내용입니다. 1. URI (Uniform Resource Identifier) Uniform : 리소스 식별하는 통일된 방식 입니다. Resource : URI로 식별할 수 있는 모든 걸 자원이라고 합니다. 웹 브라우저에 있는 HTML의 파일 것만 자원을 뜻하는 게 아니라 실시간 교통 정보 등등 이런것도 자원이라고 합니다. Idenrifier : 다른 항목과 구분하는 데 필요한 정보. 사람을 식별할 때 주민등록번호를 식별 하는 것처럼. URL (Uniform Resource Locator) Locator : 리소스가 있는 위치를 지정 합니다. URN (Uniform Resource Name) Name : 리소스에 이름을 부여 합니다..
김영한님의 모든 개발자를 위한 HTTP 웹 기본 지식을 수강하면서 정리한 내용입니다. 1. 인터넷 통신 인터넷망에서 컴퓨터들은 어떻게 통신할까 ❓ 클라이언트와 서버가 가까이 있으면 케이블로 연결하여 통신 할 수 있습니다. 하지만, 대부분 두 사이가 멀기 때문에 인터넷망 을 통해서 메세지를 주고 받습니다. 또한 인터넷망 내부는 수많은 중간 노드(서버)를 거쳐 메세지가 서버(목적지)로 전달되기 때문에 어떠한 규칙을 가지고 노드들을 지나 전달되는지 지금부터 살펴보겠습니다. 2. IP (인터넷 프로토콜) ✔ 메세지를 전달하기 위해서 클라이언트(출발지) 와 서버(목적지) IP주소가 부여된 상태여야 합니다. IP(인터넷 프로토콜) 역할 지정한 IP 주소에 데이터 전달 패킷(Packet) 이라는 통신 단위로 데이터 ..
컴포넌트란 ❓ 프로그래밍에 있어 재사용이 가능한 각각의 독립된 모듈 컴포넌트 개념의 유래 ❓ 하드웨어 제품들은 각각 독립된 기능을 가진 모듈로 만들어집니다. ➡ 따라서, 문제가 발생 했을 때 해당 부분의 모듈만 교체하면 다시 문제없이 작동 합니다. 하지만, 소프트웨어는 다릅니다. 소프트웨어는 독립적으로 개발되지 않은 경우가 많고, 혹여나 독립적으로 개발되었다 하더라도 다른 모듈과의 호환을 생각하지 않으면, 재사용을 어렵게 하고 유지보수 비용이 증가되는 원인이 됩니다. ➡ 즉, 소프트웨어의 재사용의 중요성과 필요성을 위해 나온 기술이 컴포넌트 입니다. 좋은 컴포넌트란 ❓ 다른 컴포넌트들과 연결되어 있지 않고 (응집도) 독립적 재사용성이 높은 것 ➡ 위의 3가지는 결국 컴포넌트를 나누는 기준이 됩니다. 참고..
클라이언트가 서버에게 요청을 보낼 때 그 요청의 결과가 어떻게 되었는지를 알려주는 것 HTTP status code 10x : 정보 확인 20x : 통신 성공 30x : 리다이렉트 40x : 클라이언트 오류 50x : 서버 오류 ✔ 200번대 : 통신 성공 상태코드 이름 의미 200 OK 요청 성공(GET) 201 Create 생성 성공(POST) 202 Accepted 요청 접수O, 리소스 처리X 204 No Contents 요청 성공O, 내용 없음 ✔ 300번대 : 리다이렉트 상태코드 이름 의미 300 Multiple Choice 요청 URI에 여러 리소스가 존재 301 Move Permanently 요청 URI가 새 위치로 옮겨감 304 Not Modified 요청 URI의 내용이 변경X ✔ 400..
