본문 바로가기

Javascript

Node.js RSA Encryption, Decryption 1. Private Key & Public Key 생성 // generate rsa private.key openssl genrsa -out private.key 2048 // generate rsa public.key openssl rsa -in private.key -out public.key -pubout 2. Node.js crypto를 사용한 RSA Encryption, Decryption const crypto = require('crypto'); const rsaPrivKey = `-----BEGIN RSA PRIVATE KEY----- MIIEogIBAAKCAQEAxmtuWLe0poapjNrP7wyhsPgGCikuQRU7nI+0sj9QBexrt2Mt kVwhXdXevHXcR9sA90Bkrs..
Node.js AES Encryption, Decryption const crypto = require('crypto'); const algorithm = 'aes-128-cbc'; const secretKey = 'abcdefghijklmnop'; const iv = '00000000000000000000000000000000'; const encrypt = (message) => { const cipher = crypto.createCipheriv(algorithm, Buffer.from(secretKey), Buffer.from(iv, 'hex')); const encrypted = cipher.update(message); return Buffer.concat([encrypted, cipher.final()]).toString('hex'); }; const ..
정리된 형태의 JSON 출력하기 const newWindow = window.open('', 'new window') const jsonString = JSON.stringify({obj}, null, 2); newWindow.document.write(`${jsonString}`) JSON을 화면에 출력하다보면 정리된 형태로 나오지 않고 읽기 힘들게 모두 붙어서 나오는 경우가 있다. 이경우 JSON.stringify를 통하여 JSON 문자열로 변경하고, 이를 태그에 넣으면 의도한대로 출력되게 된다. JSON.stringify의 세번째 파라미터인 2는 JSON의 구조에서 들여쓰기를 어떻게 할 것인가를 의미한다. 숫자 2는 두 칸 space를 입력하는 것이고 tab을 원하면 "\t"를 넣어주면 된다. 자세한 내용은 아래의 링크를 참조할 ..
Electron + React 데스크탑 앱 개발 (2) 앞의 포스팅에서 언급되었듯이 Electron은 내장된 Chromium에 html, javascript, css로 구성된 화면을 렌더링 하는 방식으로 작동하기 때문에 일반적인 React.js 프로젝트를 생성하는 것과 크게 다르지 않습니다. 프로젝트에 React를 적용하는 방법은 크게 두 가지가 있습니다. 첫번째는 React boilerplate인 create-react-app을 이용하여 프로젝트를 생성한 뒤 이를 Electron에 올리는 방식입니다. 두번째로는 React, Babel, Webpack을 설치한 후, 작성된 React 프로그램을 Electron에 올리는 방식입니다. create-react-app을 이용하는 방식은 React를 비롯하여 필요한 라이브러리가 자동으로 설치되고, 설정파일도 사용자가 ..
공적마스크 재고현황 조회 웹 어플리케이션 공공API에 올라와있는 공적마스크 재고조회 API를 이용해서 재고현황 조회할 수 있는 웹앱입니다. https://code0xff.github.io/mask-tracker/ Public Mask Tracker code0xff.github.io 접속하게되면 내 위치에서 500m내에 있는 구매처의 재고 현황을 조회해주고, 검색범위를 선택하여 탐색할 수 있습니다. 결과는 카드형태로 보여지며, 약국명, 약국주소를 보여주고, 배지로 몇 km이내에 있는 약국인지, 현재 몇 개가량이 남아있는지 보여줍니다. 처음 접속시 위치정보 공유에 대한 권한제공에 대해 동의해주셔야 사용이 가능합니다. 추가 정보를 확인하기 위하여 지도에서 보기를 선택하면 카카오맵으로 위치를 확인시켜주며, 정보검색을 선택하면 카카오맵에서 해당 약국의 ..
Electron + React 데스크탑 앱 개발 (1) Electron은 HTML, CSS, Javscript를 사용해 크로스 플랫폼 데스크탑 애플리케이션을 만들기 위해 Github에서 개발한 오픈 소스 라이브러리입니다. Electron은 크로스 플랫폼을 지원하기 위해 Chromium과 Node.js를 1개의 런타임으로 통합했고, Electron을 이용해 작성한 앱은 Mac, Windows, Linux 용으로 패키징할 수 있습니다. 앞서 설명하였듯이 웹 개발자라면 충분히 개발을 시작할 수 있기 때문에 개발에 들어가기 위한 진입장벽이 낮지만, 결과물은 플랫폼과 상관없이 사용이 가능하기 때문에 크로스 플랫폼을 지향하는 많은 데스크탑 어플리케이션이 Electron을 사용하여 앱을 개발하고 있습니다. 대표적인 Electron 앱으로는 Atom, Visual Stud..
Expo로 React Native 앱 개발하기 React Native는 JavaScript와 React 기술을 이용하여 Native 앱을 개발할 수 있는 기술입니다. Ionic 등의 하이브리드 앱은 앱 내부에 Web View를 이용하여 구현되는 방식이지만, React Native는 React와 JavaScript로 구성된 코드를 Mobile 환경에 맞춘 Native 코드로 전환해주는 것이기 때문에 성능상에서 우월하며, 기본적으로 제공되는 API를 거의 제한없이 사용할 수 있습니다. 또한 내부적인 구현이 React와 매우 흡사하기 때문에 기존의 React를 이용하여 front-end 개발을 해왔던 사람이라면 매우 간단하게 React Native 기술을 습득할 수 있고, 이를 이용하여 모바일 앱을 개발할 수 있습니다. 우선 React Native 개발자..
query 결과 csv로 저장하기 Node.js 서버 개발을 하던중 query 결과를 csv로 저장해줘야 하는 일이 있었는데 한글이 포함되어 있다 보니 파일내 한글들이 깨지는 이슈가 있었다. 단순히 query를 날려서 결과를 받아오면 결과물인 json 데이터를 parsing 하여 파일에 ','로 구분자를 두고 write하는 방식으로 구현하였기 때문에 query 결과에서의 한글이 깨지지 않았다면 특별히 문제될 것이 없다고 생각했었다. 실제로 query 결과에서는 한글이 전혀 깨지지 않고 있었다. 하지만 재밌게도 Notepad로 파일을 열면 한글이 정상적으로 보이는데, AcroEdit나 Excel로 파일을 열면 한글이 깨지는 것이었다. 지금이야 재밌지만 개발할 때는 재미없었다. 심지어 Notepad로 열었던 파일을 다시 저장하기만 누르고 다..