Upgrade to Pro — share decks privately, control downloads, hide ads and more …

PostCSS & BabelJS

Artur
June 16, 2016

PostCSS & BabelJS

About this tools ;)

Artur

June 16, 2016
Tweet

More Decks by Artur

Other Decks in Programming

Transcript

  1. Preprocessors A preprocessor is a program that takes one type

    of data and converts it to another type of data. In the case of HTML and CSS, some of the more popular preprocessor languages include Haml and Sass. Haml is processed into HTML and Sass is processed into CSS.
  2. Transpilers Transpilers, or source-to-source compilers, are tools that read source

    code written in one programming language, and produce the equivalent code in another language. Languages you write that transpile to JavaScript are often called compile-to-JS languages, and are said to target JavaScript.
  3. What we have for CSS Preprocessors like sass, less, stylus,

    myth, they all have: variables, inheritance, mixins, importing, nesting.. but we want more!
  4. PostCSS http://postcss.org/ PostCSS can do the same work as preprocessors

    like Sass, Less, and Stylus. But PostCSS is modular, 3-30 times faster, and much more powerful. v5 supports custom syntaxes
  5. PostCSS stats 88,794 downloads in the last day 523,980 downloads

    in the last week 2,254,276 downloads in the last month
  6. What we have for JS You've probably heard about CoffeeScript

    and TypeScript. CoffeeScript provides syntactic sugar for a number of features not yet native to JavaScript, while discouraging some of JavaScript's "bad parts". TypeScript is more drastic, adding classical object-oriented semantics to a fundamentally different language. Anything you can write in JavaScript, you can write in CoffeeScript or TypeScript. Examples of transcompiled languages include Closure Compiler, Haxe, Dart, TypeScript and Emscripten.
  7. BabelJS https://babeljs.io/ ES2015 and beyond Babel has support for the

    latest version of JavaScript through syntax transformers. These plugins allow you to use new syntax, right now without waiting for browser support.
  8. BabelJS stats 22,458 downloads in the last day 130,380 downloads

    in the last week 528,961 downloads in the last month