본문 바로가기

0x01 Programming

#HTML5의 새로운 요소(hgroup,article,section) 헤드라인을 여러 개로 묶을 필요성이 있을 때 사용하는 hgroup 요소 만일 페이지에 산발적으로 여러 개의 헤드라인을 묶어 줘야 할 필요가 있을 경우 HTML5에서는 다음과 같이 hgroup 요소를 이용할 수 있습니다. 쏭군 블로그열심히 살아가는 88만원 세대의 이야기 최근 올라온 글최근에 올라온 글을 시간 순으로 표현합니다. 봉사활동나도 그들도 짠했던 이야기 자전거 구입싼 녀석을 구하기 위한 사투 스토리위젯 사이드바개인적으로 좋아하는 위젯들 모임 태그의 사용 예 앞서 과거에 사용되던 방식을 사용하는 것도 괜찮습니다. 그러나 HTML5에 추가된 요소 덕분에 이 예제 코드와 같은 방식으로도 헤드라인 태그를 사용할 수 있게 되었습니다. H1이나 H2와 같은 높이 단계에 있는 헤드라인 요소들도 이제는 문서의 .. 더보기
#CSS3 배경지식 쌓기 만약 팀 내에 웹페이지를 디자인하여 PSD를 만드는 디자인 팀과 이 PSD를 웹페이지로 만들어 내는 UI개발팀이 따로 있다면 아래와 같은 갈등이 있기 마련입니다. 멋진 효과를 내기 위해 투명 PNG핵, 나아가 과도한 마크업과 불필요한 CSS 코드, 더 심각한 경우에는 온갖 스크립트와 CSS 핵까지 동원 해야하는 경우가 있습니다. CSS2.1에서 CSS3로의 변화 단편적인 예를 들기는 했지만 CSS3를 마음껏 사용할 수 있는 브라우저가 널리 이용된다면 이 문제는 해결될 것입니다. 현재는 익스플로러 9 이 CSS3를 본격적으로 지원할 예정이고, 웹킷 기반의 크롬이나 사파리에서는 CSS3 속성을 상당 부분 지원합니다. 그리고 오페라나 파이어폭스 역시 중요한 CSS3 속성을 많은 부분 지원하고 있는 상황입니다... 더보기
#HTML5 문서계층 구조 HTML문서 계층 구조는 구조를 중시하는 트리구조와 아웃라인과 컨텐츠 구성을 중시하는 두가지로 나누어 볼수 있습니다. 구조를 중시하는 트리구조 위의 코드와 같은 구조를 가진 문서가 있다고 가정합시다. 쉽게 설명하기 위해 다른 코드는 생략하였습니다. 박씨 집안의 시조가 박혁거세이듯이 부분을 제외하고 이 문서에 있는 모든 태그들의 시조는 입니다. 요소는 문서의 모든 요소들을 담고 있습니다. 말을 만들자면 시조태그인 셈입니다. 는 요소의 자식태그입니다. 반대로 에게 태그는 부모태그입니다. 한 계층 차이가 나기 때문입니다. 그러면 이 예시에서 와 의 관계는 어떻게 될까요? 에게 요소는 손자태그입니다. 반대로 에게 요소는 할아버지 뻘이 됩니다. 아웃라인과 콘텐츠 구성을 중시하는 구조 이미 HTML 페이지를 마크업.. 더보기
# Observer Pattern JavaScript Pattern 중 BehaviorPattern 중 하나인 Observer Pattern을 주제로 작성한 PPT 더보기
#4. 기본 내장 모듈 "Node.js 문서는 어디에 있나요?" http://nodejs.org/docs/latest/api/index.html 1. os Module Method Name Description hostname() 운영체제 호스트 이름 type() 운영체제 이름 platform() 운영체제 플랫폼 arch() 운영체제 아키텍쳐 release() 운영체제 버전 uptime() 운영체제가 실행된 시간 loadavg() 로드 애버리지 정보를 담은 배열 totalmem() 시스템 총 메모리 freemem() 시스템 사용 가능 메모리 cpus() CPU정보를 담은 객체 getNetworkInterfaces() 네트워크 인터페이스 정보를 담은 배열 2. url Module Method Name Description par.. 더보기
#3. Node.js의 전역객체 1. Node.js의 전역 변수 변수이름 설명 __filename 현재 실행 중인 코드의 파일 경로를 나타냅니다. __dirname 현재 실행 중인 코드의 폴더 경로를 나타냅니다. example) console.log('filename',__filename);console.log('dirname', __dirname ); 2. Node.js의 전역 객체 객체 이름 설명 console 콘솔 화면과 관련된 기능을 다루는 객체입니다. exports 모듈과 관련된 기능을 다루는 객체입니다. process 프로그램과 관련된 기능을 다루는 객체입니다. 더보기
#2. Node.js 개요 1. Node.js 배경사 Javascript : 1994년 넷스케이프사 브랜든 아이히가 만든 프로그래밍 언어2008년 구글이 크롬 웹브라우저 베타 버전 발표를 시작으로 속도 혁명이 일어남.C++로 개발된 V8 스크립트 엔진의 코드가 오픈소스화 되면서 Client Side가 아닌 다른 영역에서도 쓰자는 의견이 많아짐.CommonJS프로젝트로 알려진 ServerJS 프로젝트의 시작으로 Node.js 개발 2. Node.js 특징 이벤트 기반 비동기 방식예) 시장에서 물건을 살때 대기표만 받고 기다리다가 때가 되면 물건을 받는 방식. 처음에는 각 가게를 돌면서 대기표를 받고 대기 번호를 부를 때까지 대기. 대기 번호를 부르는 이벤트가 발생하는 순간 물건 취득.3. Node.js를 사용하는 애플리케이션 더보기
#Composite Pattern JavaScript Pattern 중 Structure Pattern 중 하나인 Composite Pattern을 주제로 작성한 PPT 더보기
# 4. 클래스 다이어그램과 분석 클래스 모델의 작성 클래스 다이어그램 : 시스템을 구성하는 기본 단위인 클래스의 내부 구조, 즉 클래스의 속성과 연산, 클래스 간의 관계를 표현한다. 클래스 다이어그램의 관계 요약 연관관계 : 클래스 A와 클래스 B는 연관관계를 가지고 있다. 포함관계 : 클래스 B는 클래스 A의 부분이다. 일반화관계 : 클래스 B는 클래스 A의 하위 클래스 이다. 의존관계 : 클래스 A는 클래스 B에 의존한다. 인터페이스 실현 관계 : 클래스 B는 인터페이스 A를 실현한다. 인터페이스 의존관계 : 클래스 A는 인터페이스 B에 의존한다. 클래스와 객체 객체는 상태와 행동을 가지는 개별적인 실체이다 클래스는 유사한 객체들의 묶음이다. 객체는 특정 클래스의 실체다. 클래스는 오직 한가지 유형의 대상과 개념만을 나타낸다 클래스의 이름은 명확하고 .. 더보기
#4. Behavior Diagram Usecase Diagram : 다이어그램은 시스템의 요건을 명시하기 위해 사용 개발 주기 초기에 주로 사용자의 기능적 요구사항을 기술하는 데 사용 구성요소 : 유스케이스, 액터 유스케이스 정의서 : 유스케이스의 상세한 절차 수행과정을 기술한 문서 시퀀스 다이어그램 : 개체사이에 송수신하는 메시지를 시간의 흐름에 따라 나열한 다이어그램 구성요소, 인터렉션, 인터렉션 참조, 생명선, 제어초점, 인터렉션 연산자, 객체 , 메시지 커뮤니케이션 다이어그램 : 객체간의 관계와 주고받는 메시지를 함께 표현한 다이어그램 구성요소 : 객체, 메시지 인터렉션 오버뷰 다이어그램 : 인터렉션 다이어그램간의 처리흐름관계를 비주얼하게 보여주는 다이어그램 타이밍 다이어그램 : 시간이 지나감에 따른 상태 변화를 표현하는 다이어그램.. 더보기