Ready, Get Set, GO!

guriZzang.com에서 더 많은 html5, canvas의 튜토리얼을 보실 수 있습니다. guriZzang.com 스터디블로그 바로가기 원문 : http://gurizzang.com/view/board/bbsView.asp?menuCode=45&bbsCode=36&bbsSeq=1124 DEMO DEMO

guriZzang.com에서 더 많은 html5, canvas의 튜토리얼을 보실 수 있습니다.guriZzang.com 스터디블로그 바로가기 요소?1DOM표현식으로 id로 요소 선택이 가능합니다. 대체 콘텐츠 ?1234567 current stock price: $3.15 +0.15 태그와는 다르게 ,,등의 요소를 지원하니 않는 브라우저(ie9이하)에서는 대체 컨텐츠를 제공 합니다. 태그 사이의 내용들이 출력이 되며 는 필수 요소 태그 입니다.가령 처럼 로 종료 한다면 뒤에오는 모든 요소들을 대체콘텐츠로 인식하고 출력이 되지 않습니다. guriZzang.com에서 더 많은 html5, canvas의 튜토리얼을 보실 수 있습니다.guriZzang.com 스터디블로그 원문 : guriZzang.com에서 원문보기

guriZzang.com에서 더 많은 html5, canvas의 튜토리얼을 보실 수 있습니다.guriZzang.com 스터디블로그 바로가기 는 HTML 요소 중 하나로서, 스크립트(보통은 자바스크립트)를 사용하여 그림을 그리는 데에 사용됩니다. 예를 들면, 그래프를 그리거나 사진을 합성하거나, 간단한(혹은 복잡할 수도 있는) 애니메이션을 만드는 데에 사용될 수 있습니다.는 Apple의 Mac OS X 대시보드(Dashboard)에 처음 나타났고, 이후 사파리 및 구글 크롬에 적용되었습니다. 파이어폭스 같은 게코(Gecko)를 기반으로 하는 브라우저도 이 요소를 지원합니다. 요소는 HTML5로 알려진 WhatWG Web applications 1.0의 사양에 들어 있습니다. 요소를 사용하는 것이 어려운 일..

textarea태그를 사용시 가로 100%를 주게되면 원치않게 정해진 영역을 넘어가게 된다. 그때 100%를 맞추는 방법 -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; 이 코드를 넣으면 부모Node의 크기에 사이즈가 맞춰진다. 물론..height:100% width:100%를 줘야겠지만..끝

server.js var app = require('http').createServer(handler) , io = require('socket.io').listen(app) , fs = require('fs'); app.listen(80); function handler (req, res) { fs.readFile(__dirname + '/client.html', function (err, data) { if (err) { res.writeHead(500); return res.end('Error loading index.html'); } res.writeHead(200); res.end(data); }); } io.sockets.on('connection', function (socket) { soc..

Node.js의 기본 내장 모듈만을 사용하여 WebSocket 프로토콜을 활용한 서버 및 클라이언트 모듈을 직접 구현하는 것은 WebSocket API를 모두 직접 만드는 것이며 많은 공수가 듭니다. 하지만, WebSocket 역시 여러 사람들에 의해 3rd-party모듈로 쉽게 구현할 수 있습니다.구 중에 가장 많이 사용하고 있는 모듈이 바로 Socket.IO입니다. Socket.IO의 공식홈페이지 http://socket.io/#how-to-use에서 어떻게 Socket.IO를 사용할 수 있는지, 예제와 함께 제공하고 있습니다.먼저 npm으로 Socket.IO를 설치합니다.npm install socket.io Socket.IO는 모든 브라우저 및 모바일 장치의 서로 다른 전송 메커니즘 사이에서도 사..

OS모듈은 많이 사용되지는 않지만 서버의 기본적인 하드웨어 자원들의 정보를 확인할 수 있습니다. OS모듈의 추출방법. var os = require('os'); console.log('------------ OS Module List ------------'); for(var k in os){ console.log(('os.'+k+'()')); } //os.endianness()--엔디언 타입 반환 'BE' or 'LE' //os.hostname()--서버의 호스트 이름 반환 //os.loadavg()--load average에 담긴 정보 반환 //os.uptime()--운영체제 시작된 시간 반환 //os.freemem()--사용 가능 메모리 반환 //os.totalmem()--시스템 메모리 반환 //o..

http:/www.nodejs.orgAn Example : WebServer var http = require('http'); http.createServer(function (req, res) { res.writeHead(200, {'Content-Type': 'text/plain'}); res.end('Hello World\n'); }).listen(1337, '127.0.0.1'); console.log('Server running at http://127.0.0.1:1337/'); var http = require('http'); http모듈이 Node.js 코더로부터 요청(require)되어졌고, http라는 변수에 할당되어 소스에서 활용이 가능한 상태가 됨.앞으로 http 변수를 통해 Node..

Nodejs에는 기본코드를 작성하면 런타임시에 function으로 묶어서 총 5개의 파라메터를 넘겨주면서 run하게 됩니다, exports, require, module는 Node.js 내부의 객체를 다루는 객체이고__filename, __dirname은 자신의 파일이름, 프로젝트의 경로등의 자료로 사용됩니다. Node프로젝트를 생성할때 만들어지는 js파일 > 우클릭 > Debug As > Node Application(function (exports, require, module, __filename, __dirname) { var http = require('http'); http.createServer(function handler(req, res) { res.writeHead(200, {'Cont..

하는 일이 하는 일인지라 구글에서 코드를 찾아 블로그를 다닐 때가 많다. 그러다가 예전에도 어디서 본듯하긴한데 소스를 이쁘게 정리해주는 소스 입력기? 소스 편집기? 코드 입력기?? 뭐 이런 걸 발견했다. 바로 Syntax Highlighter 이름을 몰라서 한참을 찾았었는데 구글링의 힘으로 찾아서 설치/적용 방법을 알게되었다. 차근 차근 따라해보자. 1. Syntax Highlighter Download http://alexgorbatchev.com/SyntaxHighlighter/download 다운로드는 의외로 간단하다. Syntax Highlighter 공식 홈페이지에서 다운로드 받을 수 있다. 위 링크를 클릭하면 큼지막 하게 Click Here to Download. 라고 씌여있다.이 제작자분께서..