본문 바로가기

Frontend/엘리스 SW 엔지니어 트랙87

[ 엘리스 SW 엔지니어 트랙 ] 41일차 TLDR(9주차: 1차 팀 프로젝트) 📍 41일 차 12.21. 화. 프로젝트 6일 차 TLDR 컴포넌트의 리턴값이 1개 이상일 때는 객체로 리턴하자. const getGPSTag = () => ({ GPSLatitude: "GPSLatitude", GPSLatitudeRef: "GPSLatitudeRef", GPSLongitude: "GPSLongitude", GPSLongitudeRef: "GPSLongitudeRef", }); const { GPSLatitude, GPSLatitudeRef, GPSLongitude, GPSLongitudeRef } = getGPSTag(); 라이브러리를 페이지에서 호출하면 함수 parameter로 넘기지 않아도 된다. (전역적으로 호출 가능) JavaScript로 HTML 코드를 다루는 방법 3가지를 .. 2021. 12. 21.
[ 엘리스 SW 엔지니어 트랙 ] 40일차 TLDR 📍 40일 차 12.18. 토. 프로젝트 5일 차 TLDR 비동기 함수가 중첩되어있을 때 return 하려면 return new Promise에 resolve를 넣어주어 꺼내주자. 함수에 단순히 return을 넣고 console.log 찍으면 undefined가 나온다. JS에서 라이브러리 사용 시 npm install 이후 import from으로 불러오기 function getGPSCoordinate(img) { return new Promise((resolve, reject) => { img.addEventListener("load", function () { EXIF.getData(this, function () { const GPSLatitude = EXIF.getTag(this, "GPSLat.. 2021. 12. 18.
[ 엘리스 SW 엔지니어 트랙 ] 39일차 TLDR 📍 39일 차 12.17. 금. 프로젝트 4일 차 TLDR addEventListener의 event 타입 전달 시 on 접두사를 제외하고 사용한다.(예. onchange -> change, onclick -> click, oninput -> input) event 중 change 이벤트는 요소가 포커스를 잃을 때까지 이벤트가 실행되지 않고 다른 곳을 클릭하면 이벤트가 트리거 되는 반면, input 이벤트는 요소가 변경될 때마다 이벤트가 트리거 된다. 자동완성 기능에 addEventListener를 적용할 때 change와 datalist+option을 사용하면 debounce를 적용하지 않아도 된다. (change 이벤트는 요소의 포커스가 잃을 때 적용되기 때문에 글씨가 입력하는 중간에 이벤트가 발생하.. 2021. 12. 17.
[ 엘리스 SW 엔지니어 트랙 ] 38일차 TLDR 📍 38일 차 12.16. 목. 프로젝트 3일 차 TLDR JPG와 JPEG는 같은 압축파일형식이다. 원래는 jpeg로 사용되었으나, DOS 사용 시절 확장자의 길이는 3자로 제한됨으로 인해 jpg로 줄여 사용했다. exif는 디지털 카메라에서 이용되는 이미지 파일 포맷이다. jpg, tiff6.0, RIFF, WAV 파일 확장자에만 사용 가능하다.(JPEG 2000, PNG, GIF에서는 지원하지 않는다.) JPEG2000은 JPEG보다 높은 압축률과 이미지 품질을 얻기 위해 개발되었다. 대부분의 웹 브라우저에서 지원되지 않는다.(현재 safari에서만 사용가능) js import시 오류가 뜨면 다음과 같이 설정하자 "settings": { "import/ignore": [".js$", "node_mo.. 2021. 12. 16.
[ 엘리스 SW 엔지니어 트랙 ] 37일차 TLDR 📍 37일차 12.15.수. 프로젝트 2일차 TLDR Cannot delete branch 'image-upload': branch checkout으로 다른 branch로 옮기고 삭제하기 onload()메소드보다는 addEventListener('load') 사용하기 github는 pull-request, gitlab은 merge-request merge 완료했으면 기존 branch 삭제하고 새로운 branch 생성하기 git branch -D 브랜치명: 브랜치 삭제 input태그에서 debounce 적용하기 input태그에서 datalist는 추천하는 선택지를 나타냄 CSS 방법론: BEM 2021. 12. 15.