Saturday, March 5, 2016

RSS reader with in NodeJS example

Readline module is used to read and write data in console. Full docs on Readline module in NodeJS
In this example the list of RSS channels from Yandex.news
To call the script you should use type: node --harmony cmd.js

Thursday, March 3, 2016

Displaying icons in angular material app


There are several ways to display icons in angular material application. It's described in the angular material documentation. However my team had problems with making work the svg-based mdIcon directive so we had to investigate what are the other solutions people use.

1) Use icon Font
The simplest way. You need to include link to the font css in <head> tag of your application:
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

2) Use custom directive
Used in this nice Codepen demo: http://codepen.io/kyleledbetter/pen/gbQOaV
File http://cdn.jsdelivr.net/angular-material-icons/0.4.0/angular-material-icons.min.js injects a list of icons and a directive. As a result you get ngMdIcons directive and icons can be included with following syntax in your templates: <ng-md-icon icon="search"></ng-md-icon>
You can customise the amount of icons that you're loading by editing the list in the file.

3) Use template cache
File http://ngmaterial.assets.s3.amazonaws.com/svg-assets-cache.js injects map of named SVG paths and puts it into Angular $templateCache.
Usage in the template:
<md-icon md-svg-icon="alarm" style="color: #0F0;" aria-label="Alarm Icon"></md-icon>
You can customise the amount of icons that you're loading by editing the list in the file.

Tuesday, December 15, 2015

Wednesday, November 18, 2015

Pascal's triangle drawing with JavaScript

Pascal's triangle is a triangular array of the binomial coefficients. It has a a long history and lots of interesting details related to calculus theory. Graphical implementation using svg library RaphaelJS can be fond here: http://codepen.io/shershen08/pen/Gpzzvp?editors=001


Tuesday, October 20, 2015

ReactJs component template


React.createClass({
//inheritance and used 'variables'
        propTypes: {},
        mixins : [],
//lifecycle, occur before an instance of the component is created
        getInitialState: function() {},
        getDefaultProps: function() {},
//lifecycle, occur during the mounting/updating/mounted cycle
        componentWillMount : function() {},
        componentWillReceiveProps: function() {},
        componentWillUnmount : function() {},
//handy to have your custom methods separate and named differently
        _myCustomParseData : function() {},
        _onSelect : function() {},
//min lifecycle method
        render : function() {}
    })
See the Pen jbYMoL by Mike (@shershen08) on CodePen.

Wednesday, September 16, 2015

Polymer project and polymer summit 2015


Polymer is a relatively new web framework by Google designed to leverage the evolving web platform. It has just released version 1.0, previously it was 0.5, the whole project is about 1.5 year old. Polymer in its core makes use of webcomponents specification
Below is short overview of the platform and some notes about the Polymer summit 2015 event.