background preloader

Web

Facebook Twitter

The Node Beginner Book (Korean version) » A comprehensive Node.js tutorial. 이 문서에 대하여 본 문서의 목표는 Node.js용 애플리케이션 개발을 시작을 할 수 있게 만드는 것입니다. 그리고 함께 알아야 하는 “고급” JavaScript에 관한 모든 것을 다룹니다. 본 문서는 전형적인 “Hello World” 튜토리얼 보다는 더 많이 다룹니다. 상태 당신은 현재 이 책의 최종버전을 읽고 있습니다. 즉, 새로운 버전의 Node.js에 있는 변경사항들을 반영하거나 오류를 수정할 때만 업데이트 합니다. 이 책에 있는 코드 예제들은 Node.js 0.6.11에서 동작하는지 테스트 되었습니다. 대상 독자 이 문서는 저와 비슷한 배경을 가진 독자들에게 가장 잘 맞을 겁니다. 이미 다른 언어에 대한 경험을 가진 개발자들을 대상으로 한다는 말은 데이터 타입이나 변수, 제어구조 같은 것들을 이 문서에서 다루지 않다는 뜻입니다. 하지만, JavaScript에서의 객체나 함수들은 다른 대부분의 언어들에 대응되는 것과 다르기 때문에, 좀 더 자세히 설명하겠습니다. 이 문서의 구조 이 문서를 마치는 시점에, 유저들에게 웹페이지를 보여주고 파일들을 업로드 할 수 있는 완성된 웹 애플리케이션을 가지게 될 것입니다. 이 유스케이스를 만족하기 위해 “충분한 정도”까지만 코드를 만드는 것에서 조금 더 나아가서, “세상을 바꾸는 정도”는 아닙니다만, 간결하지만 완결성있는 프레임워크를 만들어서 우리의 애플리케이션의 다른 부분들로부터 깔끔하게 분리할 겁니다.

우리는 Node.js에서 JavaScript 개발을 하는 것이 브라우저에서 JavaScript를 개발하는 것과 어떻게 다른지를 살펴보는 것으로 시작하려 할겁니다. 다음으로, “Hello World” 애플리케이션을 작성하는 훌륭한 오랜 전통을 따를 생각입니다. 그리고 나서는, 우리가 만들기 원하는 “실제” 애플리케이션의 종류가 무엇인지에 대해 논의하고, 이 애플리케이션을 조립하기 위해 구현해야 하는 다른 부분들을 자세히 살펴보고, 하나씩 이 각각의 부분들에 대해 작업을 시작할 생각입니다. 차례 JavaScript와 Node.js 주의 사항. AeroGear - Open Source Libraries for Mobile Connectivity. Node v0.2.6 한글 번역. v0.2.6 한글 번역 Synopsis 예제 : "Hello World"를 응답하는 Node 웹서버 이 서버를 구동하기 위해서 위 코드를 example.js에 쓰고 node 프로그램을 통해 실행시켜보자. > node example.js Server running at 이 문서에 있는 모든 예제들은 이와 유사하게 실행될 것이다. Standard Modules Node와 함께 컴파일되는 수많은 모듈들의 대부분이 아래 문서화 되어 있다. 예제: var sys = require('sys'); Node는 다른 모듈들과의 확장도 가능하다.

Buffers 순수 자바스크립트는 유니코드와 비슷하지만, 이진데이타에는 좋지 않다. Raw data는 Buffer 클래스의 인스턴스에 저장이 된다. Buffer 객체는 전역이다. Buffer 에서 자바스크립트의 String 객체로 변환할 때는 explicit 인코딩 메소드가 필요하다. Ascii - 7 bit 아스키 데이타에서만 사용된다. New Buffer(size) - size 옥텟만큼의 새로운 Buffer를 할당한다. new Buffer(array) - 옥텟들로 이루어진 하나의 배열만큼 새로운 buffer를 할당한다. new Buffer(str, encoding='utf8') - 주어진 str을 가지는 새로운 buffer를 할당한다. buffer.write(string, offset=0, encoding='utf8') - "string"을 주어진 encdoing을 사용하여 buffer에 쓴다. 예제 : utf8 스트링을 Buffer에 쓰고 프린트하기 buf = new Buffer(256); len = buf.write('\u00bd + \u00bc = \u00be', 0); console.log(len + " bytes: " + buf.toString('utf8', 0, len)); // 12 bytes: ½ + ¼ = ¾ 위의 buffer.write()를 보자. 예제 EventEmitter Streams Global Objects. Node.js란?

OctoberSkyJs. Mobile | Learn jQuery. Web Development Courses - University Consortium. Here are courses and lectures about technologies used for web development. These topics show you how to create interactive web applications that go beyond static web pages. Resources Tutorial Code lab Code lab Code lab Code lab Code lab Code lab Code lab Code lab Code lab Code lab Code lab Code lab Code lab Code lab Code lab Code lab. Lesson 11: Borders. Borders can be used for many things, for example as a decorative element or to underline a separation of two things. CSS gives you endless options when using borders in your pages.

The width of borders [border-width] The width of borders is defined by the property border-width, which can obtain the values thin, medium, and thick, or a numeric value, indicated in pixels. The figure below illustrates the system: The color of borders [border-color] The property border-color defines which color the border has. The values are the normal color-values for example "#123456", "rgb(123,123,123)" or "yellow" . Types of borders [border-style] There are different types of borders to choose from. The values none or hidden can be used if you do not want any border. Examples of defining borders The three properties described above can be put together by each element and thereby produce different borders. Show example It is also possible to state special properties for top-, bottom-, right- or left borders.

Our Favorite Web Design Templates. Lesson 8: Grouping of elements (span and div) The elements <span> and <div> are used to group and structure a document and will often be used together with the attributes class and id. In this lesson, we will take a closer look at the use of <span> and <div> as exactly these two HTML elements are of central importance with regards to CSS. Grouping with <span> The element <span> is what you could call a neutral element which does not add anything to the document itself. But with CSS, <span> can be used to add visual features to specific parts of text in your documents.

An example of this could be this Benjamin Franklin quotation: <p>Early to bed and early to risemakes a man healthy, wealthy and wise. Lets us say we want what Mr. <p>Early to bed and early to risemakes a man <span class="benefit">healthy</span>,<span class="benefit">wealthy</span>and <span class="benefit">wise</span>.

The CSS belonging to it: Show example Of course you may also use id to add style to the <span>-elements. Grouping with <div> Show example Summary. Progressive Enhancement with CSS. In the previous article in this series, we covered the basic concept of progressive enhancement; now, we can begin discussing how to use it. There are many ways to integrate progressive enhancement into your work using Cascading Style Sheets (CSS), and this article will cover a few of the biggies and get you thinking about other ways to progressively enhance your sites.

Style sheet organization#section1 A lot of web designers and developers don’t think much about how they incorporate stylesheets into their documents, but there is a real art to it. With the right methods, you can immediately gain many of the benefits of progressive enhancement. Use multiple style sheets#section2 There are many benefits to getting a little separation in your styles. Consider taking your main.css file, which contains all of the style rules for your site, and breaking it up into individual stylesheets containing typographic, layout, and color information. Working with alternate media types#section3 adieu. CSS Positioning 101. If you’re a front end developer or a designer who likes to code, CSS-based layouts are at the very core of your work. In what might be a refresher for some, or even an “a-ha!” For others, let’s look at the CSS position property to see how we can use it to create standards-compliant, table-free CSS layouts.

Article Continues Below CSS positioning is often misunderstood. Sometimes, in a bug-fixing fury, we apply different position values to a given selector until we get one that works. The CSS specification offers us five position properties: static, relative, absolute, fixed, and inherit. Get with the flow#section1 First, let’s take a step back to recognize the world we’re working in. Boxes in the normal flow belong to a formatting context, which may be block or inline, but not both simultaneously. Think of a “box,” as described by the spec as a wooden block—not unlike the ones you played with as a young whippersnapper. Static and relative—nothing new here#section2 In action#section6.