kasumil의 코딩 공작소

파일업로드 기능을 구현했다. 서버에 업로드 전에 당연하게 프리뷰를 위해 blob으로 이미지를 만들어 화면에 뿌려줬는데,pc, ios, aos를 구현했다. 근데 이상하게 잘 안된다?aos가 유난히 지랄나는 것. 알고보니 삼성 갤러리에서 사진을 전달할때 정보가 완벽하지 않은 것. aos 파일픽커로 들어가니 끊어지지 않는다. 파일이 깨지는 것도 없음.해당 내용을 보고 서버 업로드로 전환하기로 했는데, 네이버도 분석해보니 업로드 하는 방식으로 구현하고 있더라.그래야 ios, aos 버전업데이트에 영향을 받지 않다보니 그런거 같더라.역시 알아야지 왜 이방식을 쓰는것인지 알겠더라.

개발 중간 식겁한 현상이 있었다. 사진이 추가 되었는데 하단이 클릭되지 않는것..문제는 UAT(유저 액션 테스트- 인수테스트)가 다음날이라는 것...아시바 이거 어쩌지 했는데? ai가 찾아줬다.추가할때 바로 하단에 p태그를 삽입하는 것.그러면 입력공간이 쳐진거라 바로바로 붙을 수 있다.내 경우 onReady={ } 안에 해당 하는 dom이벤트를 감지해서 붙여주는 방식으로 구현했다.

구형폰에서는 잘되는데, 최신폰은 안되더라. 왜? 이런가 봤더니 최신이 맞는 내용.졸라 러프하게 보고 있더라.해결해보니까 이전 코드가 왜 이게 되지 하는 수준이었다...아무튼 사진은 file.arraybuffer()로 가져와서 blob으로 넣어 URL.createObjectURL(blobData)로 만들어 넣어주자.그렇게 해결했더니 ios, aos 모두 잘되더라 ㅎㅎㅎ 2026.01.06 - [취업/React.JS] - [nextjs]파일 업로드는 그냥 서버 업로드가 답이다. [nextjs]파일 업로드는 그냥 서버 업로드가 답이다.파일업로드 기능을 구현했다. 서버에 업로드 전에 당연하게 프리뷰를 위해 blob으로 이미지를 만들어 화면에 뿌려줬는데,pc, ios, aos를 구현했다. 근데 이상하게 잘 안된다..

ckeditor를 이용한 개발중인데, 특이하게도 ckeditor는 뷰어가 없더라.그래서 그게 어딨지 했는데, 찾아보니까 영문이라 찾기가 어렵더라..한글로 문서가 있길래 참조했다.https://velog.io/@oo009pbh/%EC%9D%B4%EC%8A%88%ED%95%B4%EA%B2%B0-CKEditor-5-View-%EC%8A%A4%ED%83%80%EC%9D%BC-%EC%A0%81%EC%9A%A9 [이슈해결] CKEditor 5 View 스타일 적용에디터에서는 리스트, blockquotes, 이미지 정렬 등의 작업을 진행하고 저장을 했지만. 해당 html 코드를 보여줄때 저장한 버전과 다르게 나오는 문제가 있었다.https://ckeditor.com/docs/ckeditor5/latest/instal..

아이폰의 경우 프리뷰를 보여줄때 png의 경우 decode가 터진다는 것을 배우고,내용은 알았는데, 실제로 겪어본 건 처음이었다.안드로이드에서 프리뷰를 보여줄때 리사이징해서 보여줘야한다는 것을 알았다.아무생각없이 프리뷰 원본 사이즈를 blob으로 변환해서 img src로 넣었다가 메모리가 터지더라 OOM떠서 이미지 깨짐 발생.그거보고 뭐지 하다가 되는것보니 리사이징 처리.200px 가로, 세로 넘었을 경우 비율에 맞게 축소해서 리사이징 처리해서 프리뷰로 보여주고 하는 방식으로 구현했더니메모리 문제가 사라졌다

해당 이슈는 ckeditor5 사용중 발견한 이슈다.해당 문제가 원인이 무엇인지 몰라 매우 애먹고 있다.아마도 해당 이슈는 ios내부 webkit버그로 인해서 preview를 못 보여주는게 문제인듯?그래서 해당 내용을 preview가 감지되지 않을때 주입하는 방식으로 재현하려고 하는데, 정확한 원인은 webkit 버그라 해당 이슈를 확인하려고 확인하였다. 해당 이슈 발생시 img태그에 src, alt가 붙지 않아서 프리뷰로 뜨지 못하고, 이미지는 업로드 되었으나, 해당 내용으로 갈아끼우지 못하는 듯 해서 발생.해당이슈는 굉장히 오래걸린 이슈였다 왜냐하면 lifecycle을 공부해야했기에.input에 인입하는 순간 blob으로변환되고, 미리보기하면서 업로드하는데, 미리보기가 터지면서 업로드는 정상으로되어..

심플업로드 아니고 커스텀이니 알아서 알아들어요.extraPlugins는 적용안됩니다. 해당 내용을 적용하려면 업로드 시작에서 강탈해야하는데, 안그러면 에디터 자체에서 폐기해버려아무 반응없음.실행순서가 input -> click-> editor -> plugin 이라 너무 늦음.해당 이벤트는 CKeditor onReady 자체에 적용해야합니다.그래야 이벤트를 강탈 가능.해당 라이브러리는 @ckeditor/ckeditor5-react를 사용함// utils/ckeditor.ts// MIME → 확장자 변환 (있으면 유지)export function mimesToExts(mimes: string[]) { const mapping: Record = { 'image/jpeg': 'jpeg', 'ima..

코드리뷰하면 코드와 자기를 동일시하는 하는 사람 있어서 짜증난다.내가 상대를 욕하길 했나 뭘했나.. 코드 문제 있으니 이거 개선해달라고 했는데자기에 대한 공격으로 생각하면 참... 당황스럽다.저도 저연차에 그런때가 있었지만 이제는 아닌데 나보다 고연차분이 그러면 참…뭐지 싶은…물경력이란게 이런건가? 사건 발생의 원인은 레이아웃 전용 컴포넌트에 로직 변경으로 인해서 뒤로가기 컨펌모달 넣었더니,특정 페이지에서 사이트가 터진다길래 타입스크립트 빌드문제도 없는데 왜 터지나 확인해보았다.나에게 해당 문제 해결을 요청한 특정페이지 담당자가 레이아웃 전용컴포넌트를 페이지에 호출해서 터짐…사유는 추측하자면 해당 페이지 전용으로 새로 만들기 싫어서인듯..근데 왜 본인 잘못을 내 잘못처럼 이야기하면서 주석처리했다고 말하는..

현재 SI업체에서 재직중인데 프로젝트 진행내용 작성. 프로젝트명 : ㅍㅊ작업자 : 나 및 백엔드(사수), 보조 프론트(사수)진행일 : 2025-08-01~09-241. 웹앱에서 select box들이 checked 적용이 되어있지않아, 선택해도 해당 내용이 선택되어 보이지 않은 부분 수정2. i18n 적용 잘못되어 있는 부분 수정3. 신규 고도화 작업 페이지들 atomic구조로 프로젝트 진행 적용. ㄴ 레거시 코드를 유지하기 위해서 내가 작성하는 부분만 추가하고 그외에는 유지. ㄴ hook 폴더에 페이지별 호출 구조로 해당 내용 추가(예약기능이라면 service/reservation, hooks/reservation/create or edit) - page - template ㄴ ..

아수스 젠북을 아주 우연치 않게 아파트 분리수거장에서 득템했다.22년도에 나온 아주 새삥급... 16gb 제품!이전 유저가 고장난듯 싶어 m.2 ssd만 적출하고 버린 듯한데, ssd만 껴보니 모두 정상작동 되는 줄 알았다.그런데, 점검해보니 wifi 고장났다고 생각해서 버린듯... 랜카드가 고장났나 싶을정도로 나도 의심했는데, 아주 지랄맞게도 윈도우 10에서 설치가 안되서 찾아보니,asus에서도 만들었던 자체 설치프로그램에서도 안잡히더라. 이걸 랜이 고장났나하고 고민해보다가 장치관리자에 들어가보니설치안된 카메라, 지문인식 등등등 떠 있더라... 그래서 장치관리자 내 해당 랜카드를 선택 후 펌웨어를 밀어넣으니, 장치관리자로 펌웨어를 강제로 잡더라.https://kbench.com/software/?q=n..