시각화를 배우고 정리합니다

NPM : package.json 파일 생성하기 package.json 파일을 만드는 방법은 간단하다. 터미널에 npm init을 입력하면된다. npm init 그러면 npm은 몇가지 이에대한 질문은 하게되어있다. 영어 질문은 언제나 당황스럽기마련이다. 다행스럽게도 기본 답변이 함께 제공된다. 특별한 내용이 없다면, 엔터키를 누름으로써 각 질문에 대한 답을 해나갈 수 있다. npm init을 실행하면 위 사진과같은 형태로 몇가지 질문이 나온다. (여기서 name이 'eg1'이라고 나온 이유는, npm init을 실행한 현재 폴더이름이 eg1이기 때문이다. 어느폴더에서 실행하는지에 따라 이름은 달라진다.) name : 이 프로젝트의 이름version : 현재 생성하는 npm 파일의 버전. 이전에 따로 배포..

Javascript ▶ Gulp 설치하기이번 글에서는 (대부분의 경우 아주 간단하지만), 경우에 따라서는 엄청 애를 먹는ㅜㅜ 이 'Gulp'를 설치하는 방법에 대해 정리해보려고 한다. 1. install gulp globally만약 이전에 gulp를 global로 설치한 적이 있다면, 다음 코드로 삭제 후 진행한다. 이는 오래된 버전과 충돌하는 것을 막기 위함이다. npm rm --global gulp 2. 프로젝트 경로로 초기화 npm init 3. gulp를 설치한다 : in your project devDependency npm install --save-dev gulp 4. gulpflle.js를 프로젝트의 root 단계에 생성한다. var gulp = require('gulp'); gulp.ta..

자바스크립트 - 프로토타입이란?(나를 포함하는) 초급 개발자의 경우, 알아야할 것들이 한 두개가 아니다보니, 개발에 바로 쓰여야할 중요한 개념이아니고서야(사실 모르면서 개발에 써본적이 매우 있다.) 그냥 못본척 지나쳐버리는 개념들이 굉장히 많다. 나에게 이 Prototype 개념역시 그 중에 하나이다. 이전까지 대-충 알아왔지만, 한번도 깊게 기술적인 내용을 들여다 본적은 없었기에, 이번 기회를 통해 제대로 정리해보고자 이렇게 글로 정리하고있다.* 그래서, 이 글에서 살펴볼 내용 : 자바스크립트의 '프로토타입' 개념 왜 프로토타입을 알아야 할까?프로토타입 관련 개념이 자바스크립트에서 OOP를 구현하는데 있어 기본 바탕이 되기때문이다. *OOP란, object-oriented programming의 약자로..

▶패럴랙스(parallax)기능과 기술을 구성하는 원리실제 패럴랙스(parallax) 라는 단어는 변경을 의미하는 그리스어 parallaxis 에서 파생된 것이다. 인간의 눈에 가까이 있는 물체일수록 더 큰 시차를 가지고 있다. 이것은 달리말해 가까운물체가 멀리있는 물체보다 더 빠른 속도를 갖는 것처럼 보일 수 있음을 의미하기도한다. 웹페이지의 패럴랙스(parallax)기능은 어떤 원리로 만들어지는가? 웹디자인의 관점에서보면, 이는 가장 일반적으로 오브젝트 또는 배경의 레이어화를 통해 얻을 수 있다. 또한 이것은 웹페이지의 스크롤과 애니메이션의 속도로 깊이에 대한 착시를 이끌어낼 수 있다. 기술으로, 패럴랙스(parallax)효과는 고정된 뷰포트(viewport)에서 화면의 배경이미지 외의 다른 전경 요..