결과화면 보기 박스오피스 사이트 : AJAX 통신, Movie API 사용 2017-01-04 코드 리펙토링 : 익스플로러(IE)에서는 for of문이 인식되지 않아 일반 for문으로 처리하였습니다. 하단에 설명 추가 특징 및 기능1) 영화진흥위원회가 제공하는 영화 API사용: 로컬 서버에서는 구현이 잘 되고 있으나 github의 gh-pages에서는
AJAX(Asynchronous Javascript And XML) 개념Javascript가 XML을 만나면서 비동기 통신을 한다. -> 요새는 XML보다는 JSON으로 하지만 이름은 그대로 사용하고 있다고 하네요. ^^XML은 자유롭게 마음대로 정할 수 있지만 무겁고 구조화가 어렵다는 단점이 있습니다. 이를 해결하기위해 JSON 등장! 비동기 통신
JavaScript를 배운다는 건…core(문법), core library(기본 제공 함수 등), BOM, DOM이 중 DOM에 대해 정리해보겠습니다. DOM(Document Object Model)노드, 스타일, 속성, 이벤트, 위치 및 크기 등을 다룰 수 있는 다양한 기능이 포함되어 있습니다.※ 노드 : HTML 웹페이지 구성요소의 가장 작은 단위
JavaScript를 배운다는 건…core(문법), core library(기본 제공 함수 등), BOM, DOM이 중 BOM에 대해 정리해보겠습니다. BOM(Brower Object Model)웹 브라우저를 구성하는 객체들이 포함되어 있습니다. Window 객체Javascript 실행시 가장 상위에 존재하는 객체입니다.웹 페이지의 정보에 접근하거나
Arrow functions(애로우 펑션, 화살표 함수 표현식)화살표 함수 표현식(arrow function expression)은 함수 표현식(function expression)에 비해 구문이 짧으며(예제 1.)this, arguments, super 또는 new.target을 자체 바인딩하지 않습니다(예제 2.). 메소드가 아닌 함수에 가장 적합하며
ES6 변수, 상수 선언 키워드let : 정의된 블록내에서만 존재하는 변수 선언 (지역 변수)const : 위와 동일, 상수(변하지 않는 값) 선언 var : ES6문법 이전부터 사용하던 변수 선언 (전역 변수) 1234var x = 'global'; // 전역 변수let y = 'global'; // 지역 변수cons
AngularJS 도입 선택 가이드 - Naver D2 예전에 관리했던 블로그를 살펴보는데 참 재밋네요 :)그 당시에도 앵귤러에 관심이 있어서 링크해두었던 글입니다.
javascript30.com | github 소스 영어로 진행하는데도 재미있게 알아들을 수 있는 신선한 라이브코딩식 강의! 처음엔 30 Day Vanilla JS Coding Challenge라고 되어있기에 문제를 하나씩 던져주고 해결하라고 하는건가? 라고 생각했는데, 동영상으로 라이브코딩처럼 진행하는 방식입니다. Vanilla JS, 즉, 라이브러
Node Version Manager webpack이 자꾸 안되었던 이유가 node.js의 버전때문이었습니다. 하아 ㅜㅜ 지금이라도 알았으니 다행.. ^^gulp + webpack 설정으로 사용하고 싶어, 스터디 팀끼리 서로 정보 공유하며 씨름하다 결국엔 성공했습니다. ^^ 씐나씐나 ~~~ Windows 환경에서 NVM을 설치하여 node.js 버전을
해당 코드가 있는 Github 바로가기01해당 코드가 있는 Github 바로가기02 Nesting(중첩)중첩은 반복을 제거하고 스타일링에 분명한 DOM관계를 보여줌으로서 코드를 효율적으로 만듭니다. 확장자가 SCSS, SASS 일 때 문법이 다른데,SCSS파일의 경우는 기존의 CSS의 문법과 동일합니다.123456.parent { color:
해당 코드가 있는 Github 바로가기01해당 코드가 있는 Github 바로가기02 CSS로 style 코드를 작성하다보면 반복사용 하는 것들을 한번에 관리하면 좋겠다는 생각을 하게 됩니다.이럴 때 사용하면 좋을 문법이 sass의 변수입니다. 나중엔 mixin, 함수 개념등을 알면 좋은데 우선 변수만 잘 써도 일이 확 줄어드는 것을 알 수 있습니다. 조으
앵귤러 개발자가 놓치기 쉬운 10가지 사실들 - 김정환님 블로그 포스팅을 보며 앵귤러 코드 리펙토링하고 있습니다.저 글 뿐 아니라 앵귤러 세미나내용도 있으니 우리 썬쓰 SunS(스터디 팀)끼리 열심히 해볼 생각입니다. ^^저도 차근차근 실력쌓아서 도움되는 블로그를 만들고 싶네요. :)
12월 9일 금요일. UN 인권의 날 기념 - 2016 정보접근성 기술 컨퍼런스에 다녀왔습니다.집에서 먼 거리에 있어 상암쪽은 살면서 두번째네요~결론은.. 눈 비비며 먼 길 다녀온 보람이 있었다는 것입니다. ^^ 특히 우리 프론트엔드 개발스쿨의 야무쌤 파트였던 WAI-ARIA부분은 예전부터 알고 싶던 기술이었기 때문에 더 귀를 쫑끗하며 들었습니다.한국 웹
Hong’s portfolio - sli.do 바로가기Github 소스 바로가기 포트폴리오 주제강의 중 실시간으로 질문, 답변을 받는 서비스 포트폴리오 개발 기간2016-11 ~ 공부하며 코드 리펙토링 중입니다. 특징 및 기능반응형 웹 : 데스크탑, 테블릿, 모바일에 대응하여 적절한 view를 보여줍니다.JSON파일의 data를 불러옵니다. (그룹 이름,
결과화면 보기 | Github 소스 바로가기 개발 기간2016-07 특징 및 기능그리드 시스템에 따른 반응형 웹데스크탑 대응은 10컬럼, 모바일 대응은 2컬럼 그리드 시스템을 사용하였습니다. 코드 설명grid-responsive.css모바일 대응 : .unit-s-1-2 ~ .unit-s-11-12데스크탑 대응 : .unit-l-1-2 ~ .unit-l