본문 바로가기

Canvas API2

썸네일 생성기를 리뉴얼 했어요 지금으로부터 약 1년 전, 블로그 포스팅에 사용하기 위해 썸네일을 생성해주는 프로그램을 만들었습니다. 이때 만든 프로그램을 지금까지도 만족스럽게 쭉 써오고 있었는데, 몇 가지 불편한 점이 있었으나 기술적인 역량이 부족하여 손대지 못하고 있었습니다. 🚩 이전에 만들었던 썸네일 생성기 제작기 썸네일 생성기를 만들었어요 (Thumbnail generator) 이번에 우아한테크코스를 진행하며 생각해오던 목표 중 하나가 기술적으로 성장해서 이전에 진행했던 프로젝트들을 리팩토링 하는 것이었습니다. 현재까지 가장 많이 사용했었고, 앞으로도 계속 사용할 예정이며 직접 사용하며 느꼈던 불편점들이 명확했던 썸네일 생성기가 첫 번째 대상이 되었습니다. 현재 프로젝트의 문제점 우선 기술스택부터 점검하였습니다. 기존의 썸네일 .. 2022. 12. 12.
Canvas API 사용해보기 이번에 사이드 프로젝트를 다시 설계하는 작업을 진행하며 처음으로 Canvas API를 직접 사용하게 되었습니다. 이전에는 라이브러리를 통해 Canvas를 간접적으로 다루어 잘 몰랐었는데, 참 특이하면서도 재미있는 API라는 생각이 들었습니다. 이번 포스트에서는 Canvas API의 기본적인 사용법부터 사용하면서 직접 겪었던 문제들까지 함께 공유해보도록 하겠습니다. Canvas API Canvas API는 주로 2D 그래픽 요소를 그리기 위해 사용됩니다. 간단한 도형 뿐 아니라 이미지를 추가하거나 편집하는 용도로도 많이 사용되며, jpg, png, base64 등 다양한 형식으로 출력이 가능합니다. 예시로 이렇게 사용할 수 있습니다. HTML Javascript const canvas = document... 2022. 12. 9.