Node.js/React 4

【React/PDF편집】fetch, pdf-lib, downloadjs (feat. 한글폰트)

1. Descritpion React에서 PDF 템플릿을 편집하고 다운로드하는 과정입니다. 2. Prerequisite 다음과 같은 Library가 임포트되어야 합니다. import React from 'react'; import { PDFDocument, rgb } from 'pdf-lib'; import fontkit from '@pdf-lib/fontkit'; import download from "downloadjs"; 3. Example 다음과 같은 과정으로 PDF파일에 텍스트를 입력한 후 다운로드 합니다. // PDF와 한글 폰트파일을 서버에서 읽어옵니다. fetch(templateUrl).then(response => { response.blob().then(blob => { const te..

Node.js/React 2023.03.14

【Node.js/React】두 번째 앱을 생성했다. 디버그 코드가 왜 두 번씩 출력되나?

1. What I did? 아래의 명령어를 실행하여 React앱을 생성했다. npx create-react-app 어떻게 jQuery의 all-selector를 구현할까 하고 고민중이었다. 확인해 보지는 않았지만 findDOMNode같은 메소드를 사용하는 것은 배제했다. 그래서 다음과 같은 코드로 테스트를 감행해 봤다. index.js import React from 'react'; import ReactDOM from 'react-dom/client'; import './index.css'; import App from './App'; import reportWebVitals from './reportWebVitals'; const root = ReactDOM.createRoot(document.get..

Node.js/React 2023.02.25

【Node.js/React】자발적인 React코드 생성은 처음이다.

1. I don't know nothing about react(except for a little bit skills) 그래서, 설치 및 환경을 구성하는 메뉴얼을 찾았다. 2. Where 구성에 필요한 설치파일들은 아래의 링크를 통해서 다운로드 했다. Node.js : https://nodejs.org/en/ Visual Studio Code : https://code.visualstudio.com/download 3. How 다운로드 받은 실행파일들을 더블클릭하고 안내에 따라 설치하면 된다. 4. Tutorial 아래의 링크를 참고했다. https://code.visualstudio.com/docs/nodejs/reactjs-tutorial 5. Create first react app by myse..

Node.js/React 2023.02.25