dev/web

next js 13 버전으로 프로젝트 생성하기. node.js npm설치가 완료 후 프로젝트를 생성하면 됩니다. 1. node.js 설치 https://nodejs.org/ko/download/releases/ 우선 node.js를 설치합니다. 위 링크를 통해 node.js를 설치 할수 있습니다. 상위 버전에서 호환적인 문제로 이전 릴리즈 인 node.js 8버전을 설치했습니다. 제 PC 는 window 64비트 라서 node-v8.17.0-x64.msi 로 설치 했습니다. 설치가 완료 되셨다면 cmd를 실행시켜 줍니다. cmd를 실행시키는 방법은 키보드에 윈도우 키 + R 누르신 다은 cmd라고 입력 후 엔터를 쳐주시면 되요. node.js 설치가 완료되면 npm도 같이 설치가 됩니다. node 버전 ..

Google Oauth2 Device Login 이번에 Smart TV 앱을 React로 개발을 진행하면서 3rd Party 기능을 추가하였습니다. 3rd Party 기능을 추가하면서 각 Google, Facebook, Amazon Device 3rd Party 구현을 정리해 보도록 하겠습니다. TV, 게임 콘솔, 프린터와 같은 기기에서 실행되는 애플리케이션을 통해 OAuth 2.0 승인을 구현하여 Google API에 액세스 하는 방법을 설명합니다. STEP 1 - oAuth2.0 클라이언트 ID 발급 클라이언트 ID 발급을 위해 Google API Service 사이트로 이동합니다. https://console.cloud.google.com/apis/ Google 클라우드 플랫폼 로그인 Google ..

안녕하세요. 오늘은 javascript를 이용해 동적으로 Dialog Modal을 만들어 보도록 할게요. 화면 중앙에 Dialog Modal 버튼을 만들고 버튼을 클릭하면 Dialog Modal 생성 후 Cancel 버튼을 눌러 Dialog Modal을 다시 제거하도록 했습니다. 우선 아래와 같이 버튼을 만듭니다. Dialog Modal 버튼을 클릭하면 showDialog 함수를 호출하고 함수해서 html 을 동적으로 body에 넣어 Dialog Modal을 표현합니다. Dialog Title Dialog 내용입니다. Cancel OK 위에 Dialog Modal HTML 코드를 Javascript에서 String 으로 만들고 DOMParser().parseFromString() 함수를 사용해 Strin..

웹에서 export로 csv 파일로 다운로드 하는 경우가 많이 생긴다. 이번에는 jquery로 간단하게 csv파일로 다운로드 하는방법을 알아보자. 위 이미지와 같은 웹이 있을 경우 export 버튼을 csv파일로 내보내도록하자. 우선 버튼이 어떻게 만들어 졌는지 보면 export export 버튼을 누르면 downloadCSV()함수를 호출한다. 그럼 downloadCSV() 구조를 보자. function downloadCSV() { const fileName = "userList.csv"; const csv = convertNodeToCsvString(); var link = document.createElement("a"); var blob = new Blob(["\uFEFF"+csv], {type:..