Fall in IT.

안녕하세요. 오늘은 ES6에서 기본적인 것들 몇가지에 대해서 알아보겠습니다. ES6 기초 문법let 키워드를 사용한 블록 스코프 변수 생성const 키워드를 사용한 상수 선언펼침 연산자와 나머지 파라미터화살표 함수 let 키워드 사용법 ex ) var 사용시function test() { if(true) {var b = 20;}console.log(b);}test(); 실행 결과 : 20 ex ) let 사용시function test() { if(true) {let b = 20;}console.log(b);}test(); 실행 결과 : b is not defined (ES6 표준인 let 키워드를 사용하길 권장하지만, 현재(글을 작성하는 시점)에는 var보다 퍼포먼스가 떨어질 수 있습니다.) const ..

안녕하세요. 오늘은 Git 커맨드에 대해서 간단히 알아보겠습니다. 특정 GUI Git 클라이언트를 사용하는 것도 좋으나, 운영체제(OS)에 종속적인 경우가 있습니다.따라서, Git command 에 익숙해진다면 운영체제에 종속적이지 않게 어디서나 자유롭게 깃을 사용할 수 있습니다. $ git init- 현재 디렉터리를 Git repository로 설정하는 명령어 .gitignore 파일 생성하기 $ git status- Git repository 상태를 보여주는 명령어 $ git add- working directory 에 있는 파일을 staging area로 이동시키는 명령어- $ git add - $ git add . : 현재 디렉터리의 모든 파일을 staging area로 이동시키는 명령어 $ gi..

안녕하세요. 오늘은 자바에서 입출력, 즉 I/O에 대해서 용어정리부터 사용방법에 대해서 간단하게 정리해보도록 하겠습니다. 입출력이란?I/O란, input / output의 약자로 컴퓨터 내부 또는 외부의 장치와 프로그램간의 데이터를 주고받는 것을 의미 합니다. 스트림이란?자바에서 입출력과 같이 데이터를 주고 받는데 사용되는 연결통로를 의미 합니다.스트림은 하나의 스트림으로 입력과 출력을 동시에 처리할 수 없기 때문에, 입출력을 위해서는 두개의 스트림이 필요합니다.바이트기반 스트림입니다. (스트림은 바이트 단위로 데이터를 전송하며 입출력 대상에 따라 여러 종류의 스트림이 있습니다.) 스트림 종류FileInputStream/FileOutputStream, ByteArrayInputStream/ByteArra..

안녕하세요. 오늘은 간단하지만 html에서 빈번하게 사용되는 label태그에 대해서 알아보겠습니다. label태그란?label 태그는 입력 양식창(input, button, textarea 등)을 설명하는 이름표입니다.label 태그에 적힌 텍스트를 선택하면, label과 연결된 입력 양식창이 선택됩니다. label태그 속성for : label태그와 입력양식창을 연결할때 사용합니다. 연결한 입력 양식창의 id를 사용하여 연결합니다. 예제소스 ROOT1 ROOT2 - label 적용 전에는 체크박스 상자를 눌를 경우에만 선택이되는데, label 태그를 적용한 후에는 ROOT2 텍스트를 선택해도 체크박스가 선택됩니다. 참조http://www.w3schools.com/tags/tag_label.asp

안녕하세요. 오늘은 인터프리터언어와 컴파일언어에 대해서 알아보겠습니다. 인터프리터란?인터프리터(interpreter, 해석기)란 소스코드를 바로 실행하는 컴퓨터 프로그램 또는 환경을 말한다. 소스코드를 목적코드로 옮기는 컴파일과 대비된다.인터프리터는 소스코드를 한줄 한줄 읽어들이면서 실행하는 프로그램 입니다. 인터프리터 실행과정인터프리터에서는 번역과 실행이 동시에 이루어집니다. 즉, 별도의 실행파일이 존재하지 않습니다. 컴파일이란?컴파일(compile)이란 소스코드에서 목적코드로 옮기는 것 을 말합니다.컴파일 과정컴파일을 하게 되면 실행가능한 파일(프로그램)이 생성됩니다.이러한 프로그램을 목적프로그램이라고도 하고, 컴퓨터 하드웨어(cpu)가 알아 들을 수 있는 기계어로 번역되었다는 의미에서 바이너리 파일..

안녕하세요. 오늘은 맥에서 마크다운언어를 html로 간편하게 변환하는 방법에 대해서 알아보겠습니다.(웹에 올릴 글을 빠르게 작성할 수 있기 때문에 많이 마크다운 편집툴을 많이 사용합니다. 이를 html 언어로 변환하는 방법에 대해서 알아보겠습니다.) 사용방법마크다운 편집툴에서 작성한 글 입니다. 맥의 기본 텍스트 편집기에 복사해 넣습니다. 우클릭후에 서비스 > Markdown to Html을 사용하여, html로 컨버팅합니다. 결과 화면입니다, 적용방법Application 폴더에 있는 Automator 앱을 실행합니다. 도큐멘트 유형 선택 화면에서 서비스를 선택합니다. 좌측 상단에, 셸 스크립트 검색하고 우측으로 드래그합니다. 셸 스크립트 부분에 /usr/bin/perl을 선택합니다. 상단에 출력이 선택..

CSS 라이브러리 fontello 사용하기 안녕하세요.오늘은 CSS 라이브러리 중 하나인 fontello에 대해서 알아보겠습니다.fontello는 icon fonts generator 입니다. 쉽게말해서, 여러 아이콘을 폰트로 제공하는 서비스입니다. fontello를 이용해서 아이콘을 웹페이지에 삽입하는 방법 http://fontello.com/ 사이트에 접속합니다. 원하는 아이콘을 선택합니다. 우측 상단에 Download webfont를 클릭합니다. 다운된 파일을 압축을 풀고, 해당 폴더를 내 프로젝트에 추가하고, css폴더안에 fontello.css파일의 경로를 잡아줍니다. 폴더안에 demo.html파일을 오픈하고, 우측 상단에 show codes를 누릅니다. 해당 코드를 css에 사용하여 아이콘을 ..

안녕하세요. 오늘은 윈도우 PC용 키보드를 MAC에서 사용할때 편하게 사용하도록 설정하는 방법에 대해서 알아보겠습니다. 일반 키보드와 애플키보드의 차이점애플키보드 - 컨트롤 / option(alt) / command 순으로 키보드가 배열되어 있습니다. (좌측하단에 키보드배열)윈도우키보드 - 컨트롤 / 윈도우 / alt 순으로 키보드가 배열되어 있습니다. (여기서, 윈도우 키는 command키로 사용됩니다.) 키보드 배열을 동일하게 설정하는 방법환경설정 > 키보드로 들어갑니다. 보조키를 선택합니다. 해당 키보드를 선택합니다. option키는 command키로, command키는 option키로 서로 반대로 설정합니다.완료! 모두 즐거운 코딩하세요~

안녕하세요. 오늘은 웹페이지를 만들때, 기본이 되는 레이아웃을 잡을때 사용하는 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)..