Per ardua ad astra.

Image 컴포넌트들어가며Next.js에서 기본으로 제공하는 Image 컴포넌트에 대해 정리해본다. Image 컴포넌트개념Next.js에서 다양한 퍼포먼스 기능과 편리한 설정을 지원하는 컴포넌트 이미지 컴포넌트를 이용하면 이미지 불러오기 작업을 최적화할 수 있다. 또한 이미지 크기 조정, 지연 로딩(Lazy Loading)을 지원하며, WebP와 같은 최신 이미지 형식이 자동으로 처리된다. 다양한 기기와 화면 크기에 맞게 이미지 크기를 유동적으로 조절할 수 있다. 사용 방법기본 사용법next/image 모듈을 불러와서 사용한다.import Image from 'next/image';export default function Home() { return ( Next.js Image E..

HTML 코드를 이미지로 변환하는 방법 (Html2Image) 들어가며 Html2Image 패키지를 이용하여 간단하게 HTML 코드를 이미지로 변환할 수 있다. 방법 Html2Image 패키지 설치하기 > pip install html2image 예제 코드 다음과 같이 3가지 방법으로 HTML 코드를 이미지 파일로 만들 수 있다. HTML 문자열(String) → 이미지 HTML 파일(.html) → 이미지 URL → 이미지 from html2image import Html2Image hti = Html2Image() html = ' A title Some text.' css = 'body {background: red;}' # 1. screenshot an HTML string (css is o..

파이썬의 내장 함수를 이용하여 이미지 불러오고 표시하기 들어가며 파이썬에서 기본적으로 제공되는 내장 함수를 이용하여 이미지를 불러온 후, 출력해보자. 방법 파이썬에서 이미지를 불러오고 표현하려면 requests, io, PIL 모듈(파이썬을 설치할 때 포함되는 내장 함수이다.)을 불러오면 된다. import requests from io import BytesIO from PIL import Image image_url = 'https://storage.googleapis.com/petbacker/images/blog/2017/dog-and-cat-cover.jpg' image = Image.open(BytesIO(requests.get(image_url).content)) image 설명과 ..

함수의 개념 관계(Relation)는 두 집합의 원소들 사이의 대응을 정의한 것이다. 함수는 입력과 출력이 일대일로 대응하는 관계의 한 형태이다. 함수(Function : $f \; : \; A \rightarrow B$) 집합 `A` 에서 집합 `B` 로 가는 관계가 성립할 때, 집합 `A` 의 임의의 원소 `a` 에 대하여 집합 `B` 의 원소 `b` 하나가 대응되는 관계 함수 용어 정리 : 원상(Preimage), 상(Image), 정의역(Domain), 공역(Codomain), 치역(Range) 집합 `A` 에서 집합 `B` 로 가는 함수 $f \; : \; A \rightarrow B$ 에 대하여, ① 원상(Preimage) : 집합 `B` 의 원소 `b` 와 대응하는 집합 `A` 의 원소 `a..