해당 포스트는 https://courses.wesbos.com/account/access/5d760ba285f96c03c1e5725d/view/194128542 를 기반으로 작성되었습니다. 이번 예제는 Geolocation인터페이스를 사용해 웹에서 실시간 위치 정보 수집하기 입니다. Geolocation.watchPosition() 사용하기 Geolocation.watchPosition()? 장치의 위치가 바뀔 때마다 자동으로 호출할 처리기 함수를 등록할 때 사용합니다. 선택적으로 오류 발생 시 사용할 콜백 함수도 지정할 수 있습니다. 매개변수 success : GeolocationPosition 객체를 입력 매개변수로 사용하는 콜백 함수 error(option) : GeolocationPositionE..

해당 포스트는 https://courses.wesbos.com/account/access/5d760ba285f96c03c1e5725d/view/194128542 를 기반으로 작성되었습니다. 이번 예제는 웹에서 음성 인식 추출 API( Web Speech API ) 사용하기 입니다. 기본으로 제공해주고 있어 별도의 작업 없이 사용할 수 있습니다만, 아쉽게도 Chrome에서만 제공되는 걸로 알고 있습니다. 만들어볼 예제 설명 이러한 웹 사이트를 만드는 예제입니다. 필요 기능을 분석해보자면, 사이트에 접속하는 순간 부터 음성 인식은 시작되어야 하며, 흐름이 끊기는 순간 문단이 바뀝니다. 실시간으로 음성 인식 텍스트 결과 값이 그대로 표시됩니다. 예제 시작 코드 Wesbos님께서 시작 코드를 제공해주시고 계십니..

해당 포스트는 Inflearn AngularJS 강좌를 기반으로 작성되었으며, 언급되는 개념 및 실습 과정을 담았습니다. 따라서, 코드는 단계적으로 작성되어 이전 코드와 연결되어 있습니다. > AngularJS 학습(1) 포스트 보러가기 > AngularJS 학습(2) 포스트 보러가기 AngularJS Service Controller의 분리 이전 포스트에서 Controller, Directives, app을 분리했었는데 이번엔 Controller 내부의 코드를 분리하는 작업을 할 것이다. Controller의 역할 Data 관리 기능 View 관리 기능 이 두가지를 분리할 것인데, Data 관리(조작)하는 부분을 Angular의 Service 기능을 사용해서 분리할 것이다. Angular Service..

해당 포스트는 Inflearn AngularJS 강좌를 기반으로 작성되었으며, 언급되는 개념 및 실습 과정을 담았습니다. 따라서, 코드는 단계적으로 작성되어 이전 코드와 연결되어 있습니다. AngularJS AngularJS 1. AngularJS 개념 개발 환경 구성 2. Controller index.html로 시작하기 module & controller & 출력하기 3. 내장 Directive ng-repeat ng-filter ng-Click Filter Button 1. AngularJS 개념 공식 페이지의 Coceptual Overview를 보면 개념들이 정의되어 있다. Directives : 확장된 HTML로, custom 속성과 elements를 뜻함 directives를 사용해 직접 태그..

프론트엔드 개발자 되기 Front-end Load Map 기초를 배워요 웹 개발 준비하기(환경 갖추기) 웹사이트의 외관은 어떻게 할까요? 파일 다루기 웹사이트의 구조 파일 경로 파일 경로를 위한 일반적인 규칙들 간단한 예제 프론트엔드 개발자 되기 회사에서 한번도 해본 적 없는 프론트엔드 개발을 맡게 되었다. 참고로 html, css 모두 간만 본 단계이고 제대로 된 학습을 진행하지 못했다. 기본이 중요하다고 생각하는 스타일이기 때문에 이론 공부부터 차근차근 시작해볼까 한다. Front-end Load Map 내가 참고한 Front-end load map은 다음과 같다. 해당 포스트에서는 기초를 배워요 부분만 다뤄볼까 한다. 나는 MDN web docs을 토대로 학습을 진행했다. 기초를 배워요 웹 개발 준..