반응형
반응형

A reactive programming library for JavaScript 


Github : https://github.com/ReactiveX/rxjs


RxJS 5

Reactive Extensions Library for JavaScript. This is a rewrite of Reactive-Extensions/RxJS and is the latest production-ready version of RxJS. This rewrite is meant to have better performance, better modularity, better debuggable call stacks, while staying mostly backwards compatible, with some breaking changes that reduce the API surface.

Apache 2.0 License

Versions In This Repository

  • master - commits that will be included in the next minor or patch release
  • next - commits that will be included in the next major release (breaking changes)

Most PRs should be made to master, unless you know it is a breaking change.

Important

By contributing or commenting on issues in this repository, whether you've read them or not, you're agreeing to the Contributor Code of Conduct. Much like traffic laws, ignorance doesn't grant you immunity.

Installation and Usage

ES6 via npm

npm install rxjs

To import the entire core set of functionality:

import Rx from 'rxjs/Rx';

Rx.Observable.of(1,2,3)

To import only what you need by patching (this is useful for size-sensitive bundling):

import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/of';
import 'rxjs/add/operator/map';

Observable.of(1,2,3).map(x => x + '!!!'); // etc

To import what you need and use it with proposed bind operator:

Note: This additional syntax requires transpiler support and this syntax may be completely withdrawn from TC39 without notice! Use at your own risk.

import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';
import { map } from 'rxjs/operator/map';

Observable::of(1,2,3)::map(x => x + '!!!'); // etc

CommonJS via npm

npm install rxjs

Import all core functionality:

var Rx = require('rxjs/Rx');

Rx.Observable.of(1,2,3); // etc

Import only what you need and patch Observable (this is useful in size-sensitive bundling scenarios):

var Observable = require('rxjs/Observable').Observable;
// patch Observable with appropriate methods
require('rxjs/add/observable/of');
require('rxjs/add/operator/map');

Observable.of(1,2,3).map(function (x) { return x + '!!!'; }); // etc

Import operators and use them manually you can do the following (this is also useful for bundling):

var of = require('rxjs/observable/of').of;
var map = require('rxjs/operator/map').map;

map.call(of(1,2,3), function (x) { return x + '!!!'; });

You can also use the above method to build your own Observable and export it from your own module.

All Module Types (CJS/ES6/AMD/TypeScript) via npm

To install this library via npm version 3, use the following command:

npm install @reactivex/rxjs

If you are using npm version 2 before this library has achieved a stable version, you need to specify the library version explicitly:

npm install @reactivex/rxjs@5.0.0

CDN

For CDN, you can use unpkg:

https://unpkg.com/rxjs/bundles/Rx.min.js

Node.js Usage:

var Rx = require('@reactivex/rxjs');

Rx.Observable.of('hello world')
  .subscribe(function(x) { console.log(x); });

Goals

  • Provide better performance than preceding versions of RxJS
  • To model/follow the Observable Spec Proposal to the observable.
  • Provide more modular file structure in a variety of formats
  • Provide more debuggable call stacks than preceding versions of RxJS

Building/Testing

The build and test structure is fairly primitive at the moment. There are various npm scripts that can be run:

  • build_es6: Transpiles the TypeScript files from src/ to dist/es6
  • build_cjs: Transpiles the ES6 files from dist/es6 to dist/cjs
  • build_amd: Transpiles the ES6 files from dist/es6 to dist/amd
  • build_global: Transpiles/Bundles the CommonJS files from dist/cjs to dist/global/Rx.js
  • build_all: Performs all of the above in the proper order.
  • build_test: builds ES6, then CommonJS, then runs the tests with jasmine
  • build_perf: builds ES6, CommonJS, then global, then runs the performance tests with protractor
  • build_docs: generates API documentation from dist/es6 to dist/docs
  • build_cover: runs istanbul code coverage against test cases
  • test: runs tests with jasmine, must have built prior to running.
  • tests2png: generates PNG marble diagrams from test cases.

npm run info will list available script.

Example

# build all the things!
npm run build_all

Performance Tests

Run npm run build_perf or npm run perf to run the performance tests with protractor. Run npm run perf_micro to run micro performance test benchmarking operator.

Adding documentation

RxNext uses ESDoc to generate API documentation. Refer to ESDoc's documentation for syntax. Run npm run build_docs to generate.

Generating PNG marble diagrams

The script npm run tests2png requires some native packages installed locally: imagemagickgraphicsmagick, and ghostscript.

For Mac OS X with Homebrew:

  • brew install imagemagick
  • brew install graphicsmagick
  • brew install ghostscript
  • You may need to install the Ghostscript fonts manually:
    • Download the tarball from the gs-fonts project
    • mkdir -p /usr/local/share/ghostscript && tar zxvf /path/to/ghostscript-fonts.tar.gz -C /usr/local/share/ghostscript

For Debian Linux:

  • sudo add-apt-repository ppa:dhor/myway
  • apt-get install imagemagick
  • apt-get install graphicsmagick
  • apt-get install ghostscript

For Windows and other Operating Systems, check the download instructions here:




...

반응형
반응형

 Rx.js - 웹 프론트엔드 개발자의 얕고 넓은 Rx 이야기 ReactiveX



1. Rx를 지탱하는 세 가지 키워드 

2. 요즘 들어 왜 자주 보일까? 

3. 함수형 리액티브 프로그래밍 

4. 웹 프론트엔드, 그리고 RxJS


...

반응형
반응형

[Angular2] Angular2 - http://www.angular2.com/
































































good!

...

반응형
반응형

[Node.js] npm 소개와 설치


이제 자바스크립트 라이브러리를 찹아보면 왠만하면 node.js에 들어가있다. 

결국 서버사이트로 가는거지. 


내장 http서버 라이브러리를 가지고 있기 때문에 설치만 하면 뚝딱 웹서비스가 돌아간다. 

이걸 서비스에 언제 적용할지가 문제.


npm이란 Node Package Modules의 약자다. Node.js에서 사용가능한 모듈들을 패키지화시켜 모아놓은 것이다.


이것을 설치하고 나면 나중에 업데이트도 쉽고 좋다. 


npm 홈페이지 : https://www.npmjs.org/



물론 개별 설치해서 사용해도 된다. 


Node.js 다운로드 사이트 : http://nodejs.org/download/


Guide :  https://nodejs.org/en/docs/guides/



-----------------------------------------------------------


http://mean.io/


MEAN Stack 을 선호하기도 한다. 


Mongodb + Express + Angularjs + Nodejs




...

반응형
반응형

[Node.js] 실시간 멀티채팅 구현하기!  - http://jinblog.kr/156



Node.js - https://nodejs.org/en/


Socket.io - https://socket.io/



Github 공개된 소스 : https://github.com/devjin0617/nodejs-socket.io-chat-example



nodejs-socket.io-chat-example

this is chat example using nodejs with socket.io

how to run

npm module install:

console$ cd /path/to/project
console$ npm install
  1. start socket.io server

using port 50000

console$ npm run socket
  1. start simple web server
console$ npm run web

using port 8000

  1. open your browser and connect to localhost:8000

...

반응형
반응형

wordcloud2.js




Create a tag cloud/Wordle presentation on 2D canvas or HTML.

This library is a spin-off project from HTML5 Word Cloud.

Visit the demo page

Simple usage

Load wordcloud.js script to the web page, and run:

WordCloud(document.getElementById('my_canvas'), { list: list } );

where list is an array that look like this: [['foo', 12], ['bar', 6]].

Options available, see API documentation for detail.

Algorithm

Before putting each word on the canvas, it is drawn on a separate canvas to read back the pixels to record is drawn spaces. With the information, wordcloud.js will then try to find a place to fit the word that is closest to the start point.

Testing

Tests are available with QUnit and grunt. To setup environment for testing, run npm install and manually install SlimerJS of your platform.

Use grunt test to ensure all options can be set without JavaScript error.

Use grunt compare --base-commit=gh-pages to compare your proposed fix with gh-pages branch.

Acknowledgement

The developer would like to thank Chad Jensen for sponsoring the work on image masking on the demo page.


반응형

+ Recent posts