본문 바로가기

분류 전체보기33

[JS] This 정리 - 명시적 바인딩과 그 외의 상황에서 this (feat. 점과 대괄호만 체크해보자) 프로퍼티 : 상태를 나타내는 것 메서드 : 동작을 나타내는 것 메서드가 프로퍼티를 참조하려면 자신이 속한 객체를 가리키는 식별자를 참조할 수 있어야한다. This - this를 통해 자신이 속한 객체 또는 자신이 생성할 인스턴스의 프로퍼티나 메서드를 참조할 수 있다. - 실행 컨텍스트가 생성될 때 함께 결정된다. - 함수를 호출할 때 결정된다. - 가리키는 것(this binding)이 동적으로 달라진다. 이를 잘 구분하는 것이 point! const foo = function(){ console.dir(this); }; // 1.일반 함수로 호출 foo(); // window //2. 메서드로 호출 const obj = {foo}; obj.foo; // obj //3.생성자 함수로 호출 new foo(.. 2023. 8. 7.
[Next.js] React + Typescript에 Next.js 적용하기 React와 TypeScript로 포트폴리오 페이지를 제작하려 던 중, router를 설정할 때 next.js가 편리했던 기억을 되살려 이번에도 사용하기로 결정했습니다. 1. Next.js 설치하기 npm install next react react-dom 2. 페이지 생성하기 Next.js는 페이지 기반 라우팅을 사용하기 때문에 src/pages 디렉토리를 생성하고 필요한 페이지 컴포넌트들을 만듭니다. 예를 들어 'pages/index.tsx'를 이용해 메인페이지를 만들 수 있습니다. 3. 'package.json'에 Next.js 스크립트 추가하기 "scripts": { "dev": "next dev", "build": "next build", "start": "next start" } 서버 실행, .. 2023. 6. 14.
[Next.js] Uncaught Error : Hydration failed because the initial UI does not match what was rendered on the server 환경 [ Next.js / React/ Typescript ] 모바일 웹사이트 개발 중 다음과 같은 에러가 지속적으로 발생했습니다. Uncaught Error : Hydration failed because the initial UI does not match what was rendered on the server 공식문서에서 확인해보니 애플리케이션이 렌더링되는 동안, 리액트 트리와 pre-rendered 사이 차이가 발생하기 때문이라고 합니다. This can cause the React tree to be out of sync with the DOM and result in unexpected content/attributes being present. Next.js 공식문서 https://next.. 2023. 4. 26.
[REST API] URI - Identifying resources on the Web Identifying resources on the Web 웹 에서의 리소스 식별 HTTP 요청의 대상을 리소스(resource, 자원)라고 합니다. 리소스는 문서, 사진 또는 기타 어떤 것이든 될 수 있습니다. 각 리소스는 URI로 식별됩니다. URI URI Uniform Resource Identifier(통합 자원 식별자) 인터넷에서 하나의 리소스를 가리키는 문자열 가장 일반적인 URI는 웹 주소로 알려진 URL이 있습니다. https://cord-yen.tistory.com 특정 이름 공간에서 이름으로 리소스를 식별하는 URI는 URN입니다. #URN 예시 # 국제 표준 도서번호(ISBN)에서 식별되는 "로미오와 줄리엣" 도서 urn:isbn:9788937461736 URL Uniform Reso.. 2023. 4. 14.

티스토리툴바