# thumbnail

13개의 포스트
post-thumbnail

[ Tip ] Velog 유저를 위한 Thumbnailer 사이트

Velog에 블로그 글을 옮길 때 저는 항상 Adobe의 After Effects를 사용해서 직접 썸네일을 제작했습니다. 그러다가 단순 노동이라는 사실을 깨닫고 직접 만들기로 결정하였습니다. Custom 기능은 없지만 심플하다는 장점이 있습니다. 추가로 아이콘도 삽입할 수 있으며, 이미지 형식은 JPG이고 크기는 1920 x 1080입니다. 많은 이용 바랍니다! > # 링크 https://thumbnailer.jwkwon0817.me 위 링크로 안들어가지면 아래 링크크로 시도해 주세요. https://thumbnailist.netlify.app

4일 전
·
0개의 댓글
·
post-thumbnail

썸네일추출 worker 서비스

지난 포스팅에 SNS, SQS를 활용한 비동기 썸네일추출 환경을 구성했다. 위 사진을 보면 worker-thumbnailator 라고 이름을 정의했는데, 처음에는 worker 서비스였다. 썸네일 추출 서버를 개발하는 도중에 큰 문제가 발생해 worker-thumbnailator 로 수정하고 별개의 서비스로 구성했다. 그 과정에 대해 기록하려고한다. 우선 썸네일 추출 이벤트가 어떻게 워커프로세스에 전달되는지부터 설명한다. FE에서 이미지를 묶어서 api서버에 업로드 요청하면 api 서버에서 사내 minio 저장소에 이미지를 업로드하고,

2023년 7월 26일
·
0개의 댓글
·
post-thumbnail

Thumbnail Maker

리액트 프로젝트 🎨기획의도🎨 블로그를 3년 이상 운영해 오면서 한 가지 느낀점이 있었습니다. 예전에도 언급했지만 글을 쓸 때 이미지가 있으면 개행 효과와 함께 글의 집중력을 높여준다고 느꼈기에 썸네일을 글 상단에 넣기 시작했습니다. 확실히 글에 생기를 불어주는 역할을 하고 있지만, 한 가지 문제점이 있었습니다. 바로 썸네일 제작이 쉽지는 않다는 것이었습니다. 저는 그래픽 툴을 다룰 줄 모르기 때문에

2023년 6월 29일
·
0개의 댓글
·
post-thumbnail

# Glide thumbnail 적용기

Glide는 구글에서 지원하는 공식 라이브러리이다. 이미지, Gif를 imageView에 로드할때 주로 사용한다. 자체적인 캐싱정책을 가지고 있다. 여러가지 리소스들을 이미지뷰에 보여줄 수 있다. 추가적인 기능들 File변환 URL로 부터 파일을 생성할 수 있다. placeholder 로딩되지 않았을때의 이미지를 설정할 수 있다. .placeholder(R.drawable.placeholder) + Error일때의 이미지를 설정할 수 있다. Radius RequestOption을 이용하면 이미지뷰의 라운드를 줄 수 있다. RoundedCorners() Mask 이미지뷰가 들어갈 마스크를 설정할 수 있다. MaskTransformation(R.drawable.mask) scaleType 이미지가 보여질 scaleType을 설정할

2022년 6월 21일
·
0개의 댓글
·
post-thumbnail

GCP, Cloud functions으로 Trigger 만들기

코드캠프를 6주간 하는 동안, 지금까지는 어려운게 없었다고 생각을 했고 과제보다는 내가 해보고 싶은 것을 구현하는 것에 목적을 두면서 수업을 따라가고 있었다. 그러던 와중 이미지를 업로드하는 것에 대한 것을 배우게 되었고, 그것의 과제로 한개의 사진을 올렸을 경우 여러가지의 크기로 변환하는 작업을 하는 것을 받게 됐는데 아, 더럽게 고생했고 정말 고통스러웠기 때문에 미래의 나를 위해서라도 올려두는 글이다. 웹사이트에 사진이 없는게 말이 된다고 생각해? 모두가 같은 생각을 할 것이다. 그렇다는 것은 기본적인 시스템 이라는 것이고, 자료 또한 엄청 많다고 생각해서 과제를 받고 금방 하겠지. 라는 생각을 했다. >근데 웬걸, 자료가 더럽게 없었다. 나 혼자만 못했으면 내 실력이겠거니 했는데 모든 인원이 다 찾는데도 안나오는 것을 보면 아마도..... (진짜 별로 안쓰나?) 일단 AWS 쪽의 자료가 엄청 많이 쏟아졌고, google이지만 firebase를 이

2022년 4월 20일
·
0개의 댓글
·
post-thumbnail

SpringBoot with JPA 프로젝트(M:N) 4.이미지 업로드,썸네일,이미지삭제

📚 공부한 책 : 코드로배우는 스프링 부트 웹프로젝트 ❤️ github 주소 : https://github.com/qkralswl689/LearnFromCode/tree/main/mreview2022 1.파일업로드 > 스프링부트 파일업로드 설정 방법 1) 파일 업로드라이브러리 등록(commons-fileupload) 2) Servlet3 버전부터 추가된 자체적인 파일 업로드 라이브러리 이용 -> 사용할 것 1-1.properties 설정 1-2.Controller 작성 > uploadFile()메서드는 파라미터로 MultipartFile 배열을 받도록 작성한다 -> 배열을 활용하

2022년 3월 12일
·
0개의 댓글
·

썸네일 후처리 구현 (easy-thumbnails)

파이썬/장고 웹서비스 개발 완벽 가이드 with 리액트 강의를 듣고 정리한 글입니다. 인스타그램은 이미지를 크롭해서 저장하기 때문에 출력시 후처리가 필요없다. 만약 우리 프로젝트에서 크롭처리가 되지 않은 이미지를 입력받았고 이를 크롭해서 보여주고 싶을 수도 있을 것이다. 이 때 easy-thumbnails 라이브러리를 활용하면 손쉽게 이미지를 후처리해서 보여줄 수 있다. 본 포스팅에서는 여러 크기로 저장된 이미지를 일정 크기로 크롭해서 출력하는 코드를 작성해본다. easy-thumbnails 설치 및 장고 프로젝트에 추가 django 버전 확인 poetry의 경우 의존성을 확인한다. django 4.0으로 설치할 경우 아래 오류를 볼 수 있

2022년 1월 4일
·
0개의 댓글
·
post-thumbnail

벨로그 썸네일 수정법

제목밑에 보이는 수정버튼을 누른다. 수정하기를 누른다. 재업로드를 눌러서 원하는 파일로 썸네일을 설정한다. 끝!

2021년 10월 17일
·
1개의 댓글
·

[Android, Kotlin] 영상/비디오 Thumbnail을 Bitmap으로 추출하기

운영하는 서비스 개발 중 URI를 통한 영상/비디오의 Thumbnail(썸네일)을 추출하여 준비시켜놓아야 했기에 MediaMetaDataRetriever를 통해 썸네일 추출 방법을 찾아보고 적용해보았다. 1. MediaMetaDataRetriever를 통한 URI 영상/비디오 썸네일 추출 1) MediaMetaDataRetriever란? 구글 공식 문서에서는 'MediaMetadataRetriever 클래스는 입력 된 미디어 파일로부터 프레임 메타 데이터를 검색하기위한 통일 된 인터페이스를 제공한다.'라고 설명하고 있다. 미디어 파일에는 영상 혹은 이미지의 사이즈, 크기, 회전 여부 등 다양한 MetaData가 내재되어 있는데, MediaMetaDataRetriever는 이러한 정보를 꺼내주는 역할을 하는 것이다. 실제로, 운영중인 서비스에서 영상의 길이, bitrate, 사이즈 등을 확인하기 위해 MediaMetaDataRetriever를 사용하였다.

2021년 9월 4일
·
1개의 댓글
·

CH9 Photo 앱

개요 >1. [models.py] ::: 썸네일 기능을 위해, 사용. (( 실제로는 sorl-thumbnail, django-imagekit, easy-thumbnails 이용 ) [admin.py] ::: inline 클래스 이용 —> 앨범(pk) 추가/수정시, 하위(inline)으로 FK인 Photo 테이블 추가 FK인 PhotoInline ( 그 전에 admin 하면, 3가지 1) admin.ModelAdmin 2)list_display 3)@admin.register(모델명) urls.py view.py temeplate > velog 짱이다... 진짜 좋다. notion 에서 갈아탐. 시리즈로 묶이고, 제목이 목록화돼서, 우측에 뜨는 것이 넘 좋다 이건 알아야겠다. # 으로 제목, > 로 코멘트 models.py :ThumbnailImageField admin.py Album의 FK인 PhotoInline 사용

2021년 6월 11일
·
0개의 댓글
·

python pillow resize, thumbnail 사용 시 이미지 rotate되는 문제 해결

1. 문제 정의 python pillow라이브러리를 통해 thumbnail을 만들었는데, 몇몇 결과 사진이 아래 예시처럼 rotate되는 현상이 발생함. (모든 사진이 그런건 아니고 특정 사진에서만 rotate됨) 2. 원인 스택오버플로우 글에서 원인을 찾았다. > When a picture is taller than it is wide, it means

2021년 6월 8일
·
0개의 댓글
·
post-thumbnail

Django Image Thumbnail

이미지 회전 문제 스마트폰에서 촬영한 사진을 Django 서버에 업로드 하고 해당 이미지를 썸네일로 받을 경우 이미지가 의도하지 않는 방향으로 회전하는 문제가 발생한다. 아마 스마트폰으로 촬영한 이미지의 Exif metadata의 Orientation값이 적용되지 않아 의도한 방향으로 출력되지 않는 문제일 듯 해결 썸네일을 자동 생성하는 코드의 processors에 processors.Transpose() 를 추가하면 의도하는 방향으로 회전된 이미지를 사용할 수 있다 1 글 1 고양이

2021년 4월 20일
·
1개의 댓글
·
post-thumbnail

Django-thumbnail

📚likelion 9th의 django 강의 필기 📑Django thumbnail 썸네일 파일 지정 용이 파일 용량 관리 파일 부류에 효율적 1. media 설정 이 링크로 들어가서 media부분 따라하기👉 media 바로가기 2. imagekit 설치하기 3. setting.py 4. models.py 수정 5. html

2021년 2월 17일
·
0개의 댓글
·