본문 바로가기

FrameWork73

[이미지업로드] 미리보기 이미지를 업로드하고 업로드한 이미지를 미리보기 하게 하는 것에 대한 내용이다.프로필같이 한장만 업로드 하고 업로드한 것을 바로 미리보는 방법과여러장을 업로드하고 업로드 할때마다 미리보기가 하나씩 늘어나는방법 두가지가 있을 것이다. 큰 골자는 다음과 같다.이미지 등록하라는 내용의 div를 만든다.input태그를 만든다: 파일 업로드용(type=file)div를 클릭하면 input태그가 열리도록(trigger('click')) 한다.input에서 업로드(onchange)되면 FilerReader를 통해 파일을 변환해 변수로 받는다.받은 변수를 img태그의 src로 넣어준다.최종 저장시 firebase에 MY_UTIL.uploadFileToFirebaseStrorage를 통해 firebase에 저장한다. 2024. 10. 27.
[동기&비동기] async await [동기 & 비동기 개념]동기와 비동기는요청된 작업을 순차적으로 처리하느냐 동시에 처리하느냐에 대한 차이다. 예시) 실행해야 하는 작업이 3개가 있다(a, b, c). a는 작업을 완료하는데 10초가 걸린다. b는 작업완료까지 7초가 걸린다. c는 실행 후 완료까지 5초가 걸린다. 동기(Synchronous): 작업에 대해 완료 여부를 따져 순서대로 처리(a, b, c 작업이 완료되기 까지 22초 소요)비동기(Asynchronous): 작업에 대해 완료 여부를 따지지 않고 처리(a, b, c 작업이 완료되기까지 10초 소요) [동기 & 비동기 코드]동기처리와 비동기 처리를 코드로 알아본다. jsfiddle을 통해 작성한 코드는 다음과 같다.// 1. start 출력console.log('start');//.. 2024. 10. 11.
[firebase] 파일 업로드 웹이나 어플을 만들때 사용자가 입력하는 부분은 모두 db에 저장됨.이미지, 동영상, 파일 등도 db에 저장할 수는 있으나 용량을 너무 많이 잡아먹음이는 db를 효율적으로 사용하지 못하게 함 이것을 해결하기 위해 파일들의 경우 firebase를 사용해 저장하고 저장된 firbase의 주소를 db에 저장하는 방식을 사용 [firbase 사용방법]1. 접속: 아래 링크를 통해 접속  Firebase | Google's Mobile and Web App Development Platform개발자가 사용자가 좋아할 만한 앱과 게임을 빌드하도록 지원하는 Google의 모바일 및 웹 앱 개발 플랫폼인 Firebase에 대해 알아보세요.firebase.google.com 2. 우측상단 Go to Console로 들어가.. 2024. 9. 29.
[coolSMS] 문자보내기 서비스 이용 웹 서비스나 어플 서비스에서 문자를 보내야 하는 경우가 있다.(회원가입 인증, 이메일 확인 요청 등)대표적으로 많이 사용 하는 플랫폼이 coolSMS이다. coolsms에서는 문자를 보내는 방법을 restapi방식과 oauth2 방식 으로 구분하여 제공한다.그중 restapi방식을 알아본다.  COOLSMS - 알림톡과 문자메시지 발송, 최고의 안정성 console.coolsms.co.kr [사용방법]1. 회원가입 2. apikey 발급상위 navigation bar에서 개발/연동 > apikey 관리로 들어간다apikey 신청하여 발급 받음apikey와 api-secretkey를 확인 및 별도 저장 3. 적용(spring 기준으로 설명)apikey를 발급받기 위한 nav바에서 개발/연동 > API개발문.. 2024. 9. 29.