반응형

전체 글 946

PDF 이미지를 BASE64 파일로 저장

/** * @file index.js * @install npm i pdf-export-images * @desc PDF에서 이미지 추출하여, Base64로 변환후 텍스트 파일로 저장 */ // Step. PDF 이미지 추출 라이브러리 선언 (Import) import { exportImages } from 'pdf-export-images'; // Step. File System 라이브러리 선언 (Import) import fs from 'fs'; // Step. "test.pdf"에서 이미지 추출해서 "./output" 폴더에 순서대로 저장 // 조건 #1. output 폴더가 있어야 한다. // 조건 #2. pdf내 이미지는 이미지여야 한다. exportImages('test.pdf', 'outpu..

개발 창고/Web 2022.11.29

PDF 이미지 추출하기

※ 해당 글은 아래 Library를 참조하여 작성되었습니다. https://github.com/mablay/pdf-export-images GitHub - mablay/pdf-export-images: Export images from PDF files via CLI Export images from PDF files via CLI. Contribute to mablay/pdf-export-images development by creating an account on GitHub. github.com /** * @file index.js * @install npm i pdf-export-images * @desc PDF에서 이미지 추출 */ // Step. PDF 이미지 추출 라이브러리 선언 (Impo..

[SQL] 연산자

연산자의 종류 크게 연산자에는 5가지의 연산자가 존재합니다. 구분 연산자 연산자의 의미 비교 연산자 = ex. A = B A와 B가 같으면 True, 다르면 False > ex. A > B A가 B보다 크면 True, 작거나 같으면 False >= ex. A >= B A가 B보다 크거나 같으면 True, 작으면 False 100 NOT IN (list) ex. A IN (B, C, D, E) A가 B, C, D, E 중 하나인 경우 False, B, C, D, E 중에 없으면 True A != B AND A != C AND A != D AND A != E IS NOT NULL ex. A IS NULL A가 NULL인 경우 False, A가 NULL이 아닌 경우(공란 포함) True 연산자의 우선순위 우선..

[React] Component에서 useParams 사용하기

import React, { Component } from "react"; import { useParams } from "react-router-dom"; function withParams(Component) { return (props) => ; } class CustomComponent extends Component { constructor(props){ super(props); const val1 = props.params.val1; // useParams()로 넘어온 val1 const val2 = props.params.val2; // useParams()로 넘어온 val2 this.state = { val1:val1, val2:val2 }; // Component state에 저장 } r..

[Javascript] JSON Object - Key 개수 구하기

var jsonObject = { key1:"AAAA", key2:"BBBB", key3:9999, key4:"가나다라" }; var jsonObjectKeys = Object.keys(jsonObject); var jsonObjectKeysLength = jsonObjectKeys.length; console.log("jsonObject\n" + jsonObject); console.log("jsonObjectKeys\n" + jsonObjectKeys); console.log("jsonObjectKeysLength\n" + jsonObjectKeysLength); 만약 첫 번째 줄처럼 jsonObject가 있고, 각각의 키가 있다면 이 중에서 키 값만을 추출하기 위해 Object.keys(JSON객체..

개발 창고/Web 2022.11.07

[React] String to Html 렌더링

import React from "react"; class App extends React.Component { render(){ let html = "Hello, World"; return ( 그냥 넣는 경우 {html} dangerouslySetInnerHTML을 적용한 경우 ) } } export default App; React에서는 XSS 공격을 막기 위해 일반적으로 사용되는 {} 형태의 렌더링 시에 HTML을 단순 텍스트 형태로만 출력합니다. 때문에, 태그에 사용된 것처럼 dangerouslySetInnerHTML를 활용해줘야 html 태그를 적용하여 표현해 줄 수 있습니다. 이는 db에서 불러오는 html형태의 태그를 불러올 때 활용가능하며, span 대신에 다른 element를 활용해도 상..

[React] 절대경로 사용하기

// jsconfig.json { "compilerOptions": { "baseUrl": "src" } } 프로젝트의 root에 jsconfig.json을 만들고 위 소스를 입력해준다 CRA (Create React App)을 하다 보면 아래와 같이 트리구조의 폴더로 파일들이 관리되는 경우가 많습니다. 만약 pages > common > SearchAddress라는 파일에서 utils > CommonUtils의 파일을 활용하려면 별도의 설정이 없는 경우 아래와 같이 import 해야 합니다. 3번 라인처럼 선언한 경우 위와 같은 탐색 순서대로, CommonUtils를 찾게 된다. 하지만 만약 폴더의 깊이가 더 깊어진다면, ex) src > pages > common > search > addres > ..

[JSP] Header 정보 가져오기

위와 같이 페이지를 생성하면 아래와 같은 결과를 가져올 수 있습니다. 이 중에서 첫 번째로 중요한 부분은 위와 같이 해더 정보의 key들이 담겨있는 Enumeration을 파라미터로 받기 위하여 해당 jsp로 import를 해야 합니다. 이후에 body에서 위와 같이 request를 통해 header key 목록을 받은 후, loop를 통해, request.getHeader(key) 를 통하여 값을 반환받을 수 있습니다. 위 내용에서 보면 key 목록으로 host, coneection, pragma, cache-congtrol, sec-ch-ua,... 등을 받아서 request.getHeader를 통해 localhost:8080, keep-alive, no-cache, "Google Chrome... ..

개발 창고/Web 2022.11.06

Navigation - GNB, LNB, SNB, FNB

Navigation : 특정 페이지로 이동을 위해 정의된 영역 GNB (Global Navigation Bar) : 사이트 상단 공통 메뉴 영역 : 주로 로고, 통합검색, 1뎁스 메뉴, MY MENU 등이 포함됩니다. LNB (Local Navigation Bar) : 현재 1뎁스 메뉴 또는 제공되는 서비스에 해당하는 2차 메뉴 영역 : 주로 2뎁스 메뉴들이 여기에 포함됩니다. SNB (Side Navigation Bar) : 메인 메뉴, 서브 메뉴를 제외한 나머지 사이드 메뉴, 기타 메뉴 바 : 주로 메뉴 트리가 여기에 포함됩니다. FNB (Footer Navigation Bar) : 하단 메뉴, 하단 로고, 주소, 카피라이팅 영역 : 주로 사이트명, 로고, Copyright, 주소 관련 사이트, 인증..

개발 창고/Web 2022.10.14
반응형