# Blob

프로필 이미지 업로드, 미리보기
프로젝트 진행중 마이페이지 작업을 하는데 이미지 업로드에 대한 내용을 정리하려고 한다. 이미지 업로드 버튼을 누르면, 모달창이 뜨고, 해당 모달창 안에서 이미지 미리보기후 이미지를 업로드 하는 방식을 사용하려고 한다. 구현 모달사용하기 이전에 포스팅했던, 모달hoo

[MariaDB] 데이터 타입과 비교연산자, 논리연산자, 검색패턴, 타입변환
\-DESCRIBE 테이블명;\-128 ~ 127범위, 1바이트java의 byte와 매핑4bytejava의 int타입과 매핑8bytejava의 lon타입과 매핑UNSIGHNED타입을 사용하여 양수만 표현가능표현값 2배로 증기TINYINT UNSIGNED 이렇게 사용한다

Data URL과 Blob: 이미지 데이터 처리 (문제 해결)
개요 > admin 페이지 개발 중, React-quill 에디터를 통해 붙여넣은 사진을 파일 형태로 서버에 업로드해야 했다. 이때 발생한 에러와 그를 해결하는 과정을 함께 살펴보자. (quill-image-drop-and-paste 공식문서를 참고하였다.) htt
구름 아카데미 후기 - 7
처음에 만들었던 대로 배열과 반복문을 해서 테이블을 만들어도 가능했다.열단위로 나누어서 첫번째는 첫칸을 비우고 알파벳만 그 다음부터는 첫칸에 숫자 값을 넣어서 반복문을 실행한다.셀을 클래스로 만들어 필요한 값을 지정한다. 클래스를 잘 안써서 객체 정도까지 밖에 생각못

Git은 내부적으로 어떤 구조를 가지는가? (.git)
git이 어떻게 내부적으로 git의 기능들을 구현하였는지, 그 내부 구조를 살펴본다.먼저 아래 설명을 하기 위해 해싱에 대해 먼저 설명을 해볼 것이다.해싱은 어떠한 데이터를 고정된 길이의 해시 값으로 변경하는 것으로, git에서는 해시 값을 통해 git에서 관리하는 오

이미지 크롭 기능 구현하기(blob, base64)
Curb프로젝트 진행 당시 게시물 사진을 업로드 하는데 문제점이 발생하였다. 클라이언트가 올리는 사진에 대해 특정한 사이즈가 요구 되는데 이 비율에 맞추지 못하면 이미지의 특정 영역을 보일 수가 없었기 때문이다. 이를 위해 다른 sns를 확인하면 이미지를 크롭하거나 잘

Oracle 데이터 타입
Oracle 자료 12~14 테이블의 생성 ~ 자료30: 시퀀스 6.7.sql Oracle 데이터 타입 null 허용 여부: null 또는 not null default값: 0 또는 오늘날짜 시간 제약 조건: primary key는 (중복 불가) Oracle
proxyMiddleware(express.Router) 사용 시 파일 다운로드 주의사항
엑셀 다운로드 API 를 통해 엑셀 다운로드 기능 구현 중 아래 문제가 발생했다.API 서버로 Download API 요청 시 응답 데이터와 Proxy 서버로 Download API 요청 시 응답 데이터가 다른 문제어떤 환경 문제로 인해 해당 프로젝트는 이런 구조로 되

spring boot 이미지 저장 (feat.제발 상대경로 사용하지 마세요)
이미지 파일을 사용자로 부터 입력 받아 처리하기 까지 매우 복잡하여 정리를 해본다.그러면 다음과 같이 input 요소가 생긴다처음에 이미지를 JSON 형태로 고칠려고 했으나 불가능.JSON을 formData객체에 함께 담아서 보내줘야 한다.‘files’를 찾지 못한다⇒

[글마디 프로젝트] 글마디 카드 PNG 다운로드 및 공유 기능 구현 회고
글마디 프로젝트를 기획하면서 유저가 자신이 기록해 두고 싶은 구절을 업로드하는 것 뿐만 아니라 카드 형태의 사진으로 저장하기도 하고, 주변 사람들에게 공유하기도 할 수 있다면 좋을 것 같다는 생각을 했습니다. 이 글은 자바스크립트의 blob과 html-to-image,
TIL
둘 다 현재 웹 페이지에서 HTML body 요소를 가리키지만, 서로 다른 방법을 사용하여 액세스합니다.document.body는 document 객체의 속성으로, 현재 웹 페이지의 body 요소에 대한 참조를 반환합니다. 이 속성은 JavaScript를 사용하여 bo
TIL43-02 Blob 의 활용, 이미지 파일 전송
Blob을 이해하기 전에 FormData에 대한 이해가 필요하다.FormData는 HTML form 요소를 통해 전송되는 데이터를 캡슐화하기 위한 JavaScript의 인터페이스다.FormData 객체를 사용하면 파일 업로드와 같은 이진 데이터를 포함하는 AJAX 요청

blob 형태의 자료를 input 태그에 넣기
Vue로 만든 프로젝트를 리팩토링 중 만난 오류 아닌 오류 기존의 사이트에서는 이렇게 @chage 이벤트를 활용해 파일 정보를 받아와 미리보기 형태로 출력되도록 코드를 구성했다. 그 후 폼 데이터를 생성하여 생성한 폼 데이터에 파일 객체를 할당하고 서버에 요청을 보내

[javascript] Blob 과 Canvas를 이용해 이미지 Crop 하기
blob, canvas에 대해 이해해 보고 javascript에서 이미지 업로드시 정방형으로 자르는 예제 코드를 작성해보았습니다.

[NodeJs] 발음 정확도 평가 정리
기업 협업 진행 중 발음 정확도 평가 기능을 구현해야 했다. 대략 설명하면 영상에 나오는 대사를 유저가 따라 녹음하고 그에 대해 발음의 정확도를 평가해 점수를 나타내 주어야 한다. 구현 과정에서 꽤 시간이 걸려서 한 번 정리해보고자 한다. 시작 유저가 녹음한 음성
Blob 이해해보기
회사 동료분이 맡은 프로젝트에서 blob을 사용하여 로직을 구현 중인데 처리에 대해 고민하신다고 하셨다. 흠.. 생각해보니 나는 blob을 모르잖아..? 하는 아찔한 깨달음과 함께 blob을 공부해보기로 했다.그럼 가보자고~!Binary Large Object의 약자로