Fall in IT.

ionic 프로젝트 중에 "ionic build ios" 실행시 아래와 같은 에러 발생시 해결 방법입니다. 에러 원인Xcode 설치 또는 업데이트 후 앱을 한번도 실행하지 않았을 경우 발생 합니다. 해결방법Xcode를 실행하여, Xcode license 동의에 확인을 체크하면 해결됩니다. 모두 즐거운 코딩하세요~

안녕하세요. 오늘은 웹페이지를 만들때, 기본이 되는 레이아웃을 잡을때 사용하는 css의 position에 대해서 알아보겠습니다. 엘리먼트의 위치(position)를 지정하는 방법static (default값)relative (상대적 위치)absolute (절대적 위치)fixed (고정적 위치) staticposition을 설정하지 않았을때, 기본적으로 적용되는 값 입니다. (고정값) relative특정 엘리먼트가 현재 속한 위치에서 left, right 등의 값에 따라 상대적인 위치를 변경할때 사용합니다.부모 엘리먼트를 기준으로 상대적으로 움직입니다.예제 : http://codepen.io/leedu/pen/kkbvYO absoluteposition값이 relative인 부모를 기준으로 움직입니다. 만약..

안녕하세요. 오늘은 PNG와 SVG 이미지의 차이점에 대해서 간단하게 알아보도록 하겠습니다. SVG란?스케일러블 벡터 그래픽스(Scalable Vector Graphics, SVG)는 2차원 벡터 그래픽을 표현하기 위한 XML 기반의 파일 형식으로, 1999년 W3C(World Wide Web Consortium)의 주도하에 개발된 오픈 표준의 벡터 그래픽 파일 형식이다. SVG 형식의 이미지와 그 작동은 XML 텍스트 파일들로 정의 되어 검색화·목록화·스크립트화가 가능하며 필요하다면 압축도 가능하다. (위키피디아)svg는 벡터(vector) 이미지를 표현하기 위한 포맷으로 w3c에서 만든 벡터 이미지 표준입니다. PNG란?포터블 네트워크 그래픽스(Portable Network Graphics; PNG)..

안녕하세요. 오늘은 Mac OS에서 런치패드(launchpad)에서 한페이지당 보여지는 응용프로그램 개수를 설정하는 방법에 대해서 알아보겠습니다. 적용방법터미널 app을 실행합니다.다음 명령어를 입력합니다. - defaults write com.apple.dock springboard-columns -int (가로줄)숫자 - defaults write com.apple.dock springboard-rows -int (세로줄)숫자 - killall Dock 예제 - 가로 9, 세로 8 적용 샘플 실행 결과 모두 즐거운 코딩하세요~

안녕하세요. 오늘은 아이맥 Finder에서 숨김파일 보이게 하는 방법에 대해서 알아보겠습니다. 아래 명령어를 터미널에 입력합니다.[Mac] Finder에서 숨김 파일 보기defaults write com.apple.finder AppleShowAllFiles YES && killall Finder [Mac] Finder에서 숨김 파일 안 보이게 하기defaults write com.apple.finder AppleShowAllFiles NO && killall Finder

안녕하세요. 오늘은 Base64에 대해서 알아보겠습니다. Base64란?컴퓨터 분야에서 쓰이는 Base 64 (베이스 육십사)란 8비트 이진 데이터(예를 들어 실행 파일이나, ZIP 파일 등)를 문자 코드에 영향을 받지 않는 공통 ASCII 영역의 문자들로만 이루어진 일련의 문자열로 바꾸는 인코딩 방식을 가리키는 개념이다. Base64 동작방식base64는 8bit의 데이터(바이너리)를 6bit의 크기로 표현합니다. 따라서 24bit를 단위로 하여 3개의 문자에서 4개의 문자를 얻게 되는 것입니다. 위와 같이 abc를 base64 인코딩 하여 YWJj를 얻을 수 있게 됩니다. 여기서 6bit의 이진수는 아래의 base64 table을 이용하여 문자로 바꿔줍니다. base64 인코딩 24bit 단위인데 인..

안녕하세요. 오늘은 반응형 웹페이지 디자인의 핵심 기술인 media query에 대해서 알아보겠습니다. media query란?최근 트렌드인 반응형 웹앱을 만들기 위한 CSS 기능입니다.화면의 종류와 크기에 따라서 디자인을 달리 보여줍니다. 예제소스넓이가 500px 이하일 경우는 body 태그의 배경색을 green으로 설정하는 코드. @media(max-width:500px) { body { background-color: green; } } 넓이가 500px 이상일 경우 body 태그의 배경색을 green으로 설정하는 코드 @media(min-width:500px) { body { background-color: green; } } 예제소스 2 결론엘리먼트들의 크기나 위치를 쉽게 설정할 수 있어, 레이..

안녕하세요.오늘은 Ionic Framework에 대해서 소개하도록 하겠습니다.(다음글에서는 간단하게 Ionic Framework를 사용하여 Hybrid App을 개발해보도록 하겠습니다.) 하이브리드 앱이란?하이브리드 어플리케이션(이하 하이브리드 앱)은 HTML5, CSS, JavaScript와 같은 웹 기술로 웹 어플리케이션을 만들고, 이를 네이티브 컨테이너로 감싼 네이티브 어플리케이션을 말합니다. (Corodva/PhoneGap처럼 네이티브와 연결해주는 도구를 이용하면 카메라, 가속도계, 위치정보, 연락처 같은 네이티브 기능에 접근할 수 있습니다.) 네이티브앱을 만들지 않고, 하이브리드앱을 만드는 이유는?개발비용과 개발시간을 줄여줍니다.네이티브 언어보다 학습 곡선이 낮습니다.(하이브리드 앱의 가장 큰 ..

안녕하세요. 오늘은 AnuglarJS에서 img 태그 안에 ng-src 디렉티브에 설정된, url (이미지 경로)에 대해서 reload하는 방법을 알아보겠습니다. 필요한 상황이미지 서버에서 이미지가 변경 되었는데, 경로는 그대로인 경우 reload가 필요합니다. ng-src reload 방법기존의 url에 현재 시간과 같은 변경이 있는 값을 더해줍니다. 예제소스 angular.module('ngSrcDemo', []) .controller('AppCtrl', ['$scope', function ($scope) { var imageUrl = "http://example.com/img.png"; $scope.imageSource = imageUrl + "?cb=" + new Date().getTime(); ..

안녕하세요. 오늘은 AngularJS 1의 기초개념에 대해서 알아보겠습니다. AngularJS란?AngularJS는 구글에서 만든 자바스크립트 프레임워크로, 2009년에 발표되었습니다.AngularJS는 자바스크립트로 만든 client 측 MVC/MVVM 프레임워크로 모던 단일 페이지 웹 애플리케이션 개발의 정수이다. AngularJS 특징자바스크립트로 작성할 코드량을 줄여준다. - Dom을 선택하고 조작하는 자바스크립트 코드를 작성하지 않아도 됩니다.양방향 데이터 바인딩이 가능합니다. - 모델의 데이터와 뷰 데이터가 양방향 데이터 바인딩이 되어, 모델이 바뀌면 뷰 데이터도 같이 변경 됩니다.HTML, CSS, 로직 등의 개발 영역을 명확하게 분리해줍니다. - 기존 자바스크립트에서는 Dom 조작과 이벤트..