hmk run dev

서버리스(ServerLess) 람다를 알기 전에 서버리스 서비스에 아주 간단하게 설명하자면 서버리스는 실제로 서버가 없다는 뜻이 아니라 개발자가 관리해야 할 서버가 없다. 정도로 말할 수 있겠다. 서버리스 기반으로 개발하려면 어떻게 해야 할까? 바로 AWS람다가 매우 좋은 방법이 될 수 있습니다. 람다는 서버를 관리하지 않고도 코드를 실행할 수 있게 해 주는 컴퓨팅 서비스입니다! 직방, 당근마켓 등 큰 기업에서도 사용할 만큼 인기가 치솟고 있습니다! 쉽게 말해 람다는 코드로 이루어진 함수를 실행한다고 할 수 있습니다. 이때 실행되는 함수를 람다 함수라고 한다. 여기서 람다의 장점이 나오는데 코드가 실행되는 시간 동안 요금이 부과되어 EC2 같은 서비스에 비해 비용적으로 이점을 볼 수 있습니다! 람다 함수..

이터레이터 이터레이터는 자바스크립트뿐만 아니라 다른 언어들에도 있는 개념으로, 루프를 생각하면 이해하기 쉽습니다. 배열(array)은 대표적인 이터레이블 객체로서 이터레이터를 사용할 수 있습니다. 이터레이터는 단순히 루프를 수행하는 것이 아닌 현재 어디를 돌고 있는지 확인할 수 있습니다. const arr = [1,2,3] const it = arr.values() 위의 코드를 보면 arr에 values()를 이용해 이터레이터를 생성했습니다. it를 console에 찍어보면 이처럼 이터레이터 객체가 찍힙니다! 이터레이터 객체는 next라는 메서드를 가지고 있고 next를 arr의 개수만큼 사용하면 아래와 같습니다. next()를 호출할 때마다 그다음 값으로 넘어가며 모든 값을 돌고 나면 done이 tru..

npm init으로 생성하거나 직접 작성해 생성 가능! { "name" : "test", "description" : "javascript's test programming.", "keywords" : ["util", "f", "server", "client", "browser"], "author" : "Goorm", "contributors" : [], "dependencies" : [], "repository" : {"type": "git", "url" : "git://gitbub.com/documentcloud/test.git" }, "main" : "test.js", "version" : "1.1.6" } name - 프로젝트 이름 중앙 저장소에 배포 시 version과 함께 필수항목 - url,..

1. ClientX, ClientY 클라이언트 영역(현재 보여지는 브라우저 화면 기준)을 기준으로 가로, 세로 좌표를 제공 clientX - 스크롤은 무시하고 해당페이지 상단을 0으로 측정하여 클라이언트 영역에서 X위치를 반환 clientY - 스크롤은 무시하고 해당페이지 상단을 0으로 측정하여 클라이언트 영역에서 Y위치를 반환 2. OffsetX, OffsetY 이벤트 대상을 기준의 좌표 ex) 화면 중앙의 박스 요소에서 클릭한 위치를 찾으면 박스위 왼쪽 모서리 좌표가 0으로 측정됨 offsetX - 이벤트 대상을 기준으로 상대적 마우스 x좌표 반환 offsetY - 이벤트 대상을 기준으로 상대적 마우스 y좌표 반환 3. pageX, pageY 스크롤을 포함한 전체 문서를 기준으로 x,y 좌표를 반환 ..

webpack이란? - 모듈 번들링이라고 한다. - html 파일에 들어가는 JS파일들을 하나의 파일로 만들어주는 방식을 모듈 번들링이라고 한다. > 쉽게말해 다수의 JS파일들을 하나의 JS파일로 만들어주는 것을 webpack이라고 할 수 있다. 사용하는 이유 - SPA가 나오기 이전 html을 요청해 뿌려서 화면을 보여줬는데 SPA가 등장한 이후 하나의 HTML페이지에 여러가지 자바스크립트 파일이 포함된고 연관되어 있는 JS 종속석 있는 파일들을 하나의 파일로 묶어줘 관리하기가 편하다. - 파일을 컴파일 할 때, 여러 모듈을 읽어오는데 시간이 오래거리는 것을 해결하기 위해 여러 파일을 하나의 파일로 번들링 해준다. > 하나의 JS파일로 만들어 웹페이지 성능 최적화 webpack 설치 1. npm ini..