Fall in IT.

안녕하세요. 오늘은 Angular5에서 Slick-carousel 사용법에 대해서 알아보겠습니다. 목적Angular5에서 slick-carousel 사용해보기 작업 순서angular-cli를 사용하여 angular5 프로젝트를 생성하고 실행해봅니다.생성한 프로젝트에 slick-carousel 플러그인을 설치하고 적용합니다. angular5 프로젝트 생성 및 실행 (node.js, npm, angular-cli가 설치되어 있다는 가정하에 설명합니다.)angular-cli를 사용하여, angular5 project를 생성합니다. 프로젝트명은 slick-sample-app으로 합니다. - $ ng new slick-sample-app 프로젝트가 생성되면 해당 프로젝트 안으로 진입합니다. - $ cd slick..

최근 만들어진 웹사이트중 가장 심플하게 잘 만들어졌다고 생각하는 kakaobank 사이트를 직접 copy 해보고,어떤 plugin들을 사용했고, 레이아웃은 어떤 방식으로 잡았는지에 대해서 알아보는 시간을 가져보았습니다. 결국, 어떻게 만들었길래 이렇게 이쁠까? 란 궁금증을 해결하기 위해서 직접 똑같이 만들어 보았습니다. 목적kakaobank 사이트와 똑같은 사이트를 구현합니다.구현하면서 필요한 라이브러리 또는 스킬들도 하나하나 정리합니다. 요구사항kakaobank와 최대한(?) 똑같이 만들어야합니다. (따라서, 구현시 사용되는 모든 리소스는 kakaobank의 리소스를 참조하여 개발합니다.)오픈소스로 공개하고 스터디 용으로만 사용합니다. 구축환경angular5를 사용하여 개발합니다. (angular-cl..

안녕하세요.오늘은 webpack의 개념과 사용방법에 대해서 간단하게 알아보도록 하겠습니다. 서버에서 처리하는 로직을 JavaScript로 구현하는 부분이 많아지면서 웹 서비스 개발에서 JavaScript로 작성하는 코드의 양도 늘어났습니다. 코드의 양이 많아지면 코드의 유지와 보수가 쉽도록 코드를 모듈로 나누어 관리하는 모듈 시스템이 필요해집니다. 그러나 JavaScript는 언어 자체가 지원하는 모듈 시스템이 없습니다. 이런 한계를 극복하려 여러 가지 도구를 활용하는데 그 도구 가운데 하나가 webpack입니다. webpack이란?웹팩은 모듈 번들러 입니다. 웹팩은 상호 의존성이 있는 모듈들을 사용해 그 모듈들과 같은 역할을 하는 정적 에셋들을 생성해냅니다. webpack 동작방식각 기능 단위별로 mo..

안녕하세요. 오늘은 npm install 옵션 중 --save와 --save-dev의 차이점에 대해서 알아보도록 하겠습니다. npm 이란?npm은 JavaScript 용 패키지 관리자입니다. npm을 사용하면 JavaScript 개발자가 다른 개발자가 공유 한 코드를 쉽게 재사용 할 수 있습니다. https://docs.npmjs.com/getting-started/what-is-npm npm install 이란?npm install은 지정된 패키지를 기본적으로 의존성에 저장합니다. 또한 몇 가지 추가 옵션을 사용하여 저장 위치 및 방법을 제어 할 수 있습니다../node_modules 디렉터리에 패키지를 설치합니다.https://docs.npmjs.com/cli/install npm install (p..

안녕하세요. 오늘은 Javascript에서 사용되는 "use strict" 란 무엇인지 알아보도록 하겠습니다. use strict란?Strict Mode의 선언방식 입니다.이 문구는 ES5부터 적용되는 키워드로, 안전한 코딩을 위한 하나의 가이드라인 입니다. Strict Mode란?Strict Mode는 코드에 더 나은 오류 검사를 적용하는 방법입니다.Strict Mode를 사용하면, 예를 들어 암시적으로 선언한 변수를 사용하거나 읽기 전용 속성에 값을 할당하거나 확장할 수 없는 개체에 속성을 추가할 수 없습니다.Strict Mode는 ECMAScript 5 버전에 있는 새로운 기능으로써, 당신의 프로그램 또는 함수를 엄격한 운용 콘텍스트 안에서 실행시킬 수 있게끔 합니다. 이 엄격한 콘텍스트는 몇가지 ..