본문 바로가기

👨‍💻 web.dev51

Node.js 환경에서 네이버 Open API 활용하기 네이버 오픈 API란? 네이버는 개발자들이 활용할수있도록 다양한 기능들을 오픈 API 형태로 제공하고 있습니다. 이번 포스팅에서는 네이버 Open API에 대한 설명과 이를 활용할 수 있는 방법들에 대해 소개하겠습니다. 네이버 개발자 홈페이지에 가보면 다음과 같이 오픈 API를 정의하고 있습니다. 네이버 오픈API는 네이버 플랫폼의 기능을 외부 개발자가 쉽게 이용할 수 있게 웹 또는 SDK 형태로 공개한 기술들입니다. 쉽게 말해 네이버에서 외부 개발자들이 자사의 다양한 서비스들을 이용할 수 있도록 외부에 공개해놓은 것입니다. 저희는 해당 API를 사용하기 위해 주어진 형식에 맞춰 요청을 보내주기만 하면 됩니다. 네이버 개발자 홈페이지에 가면 활용 가능한 오픈 API들을 확인할 수 있습니다. 네이버 오픈 .. 2021. 3. 2.

Node.js CORS 설정하기 CORS? CORS(Cross Origin Resource Sharing) 는 추가적인 HTTP 헤더를 사용해서 한 출처에서 실행 중인 웹 애플리케이션이 다른 출처의 자원에 접근할 수 있는 권한을 관리하는 체제입니다. 즉 위와 같이 domain-a.com 에서 같은 주소의 domain-a.com 에 접근하여 자원을 요청할때는 문제가 발생하지 않지만, domain-b.com 에 요청할 경우 도메인이 다르기 때문에 보안상의 이유로 제한됩니다. 만약 서버에서 올바른 CORS 헤더를 포함한 응답을 반환하지 않으면 위와 같은 오류가 발생하게 됩니다. 위 예시에서는 자원을 가지고 있는 서버단의 도메인인 http://127.0.0.1:3000 과 자원을 요청한 http://localhost:8080 의 출처가 다르기.. 2021. 3. 2.

React 컴포넌트에서 타이머 설정하기 (with Hooks) 📌 들어가며 React 를 활용해서 오목 게임을 구현하던 중에 위와 같이 화면 왼쪽 상단에 타이머를 설정해주고 싶었습니다. 사용자가 바둑돌을 놓으면 타이머가 재설정되어야 하기 때문에 Timer 컴포넌트를 state 에 따라 useEffect 를 활용하여 다시 설정해주는 방법을 사용하기로 했습니다. 현재 hooks 을 이용해서 컴포넌트를 작성하고 있었기 때문에 이번 포스팅에서는 타이머 리랜더링 로직은 제외하고 React Hooks 을 활용하여 간단한 타이머를 설정하는 방법을 알아보겠습니다. 📌 자바스크립트 타이머 설정 함수 자바스크립트에는 타이머를 설정할 수 있는 함수가 두 가지 존재합니다. 하나는 setTimeout 이고 나머지 하나는 setInterval 로 두 함수는 목적에 맞게 사용하면 됩니다. 이.. 2021. 3. 2.

이전 1 ··· 6 7 8 9 다음

티스토리툴바