Tuesday, August 23, 2016

Modern JS in a nutshell - ES6 Modules - Part 1 (What is ES6 Modules)

Recommended to read first posts :

- What is ECMAScript ? and the Relation Between ES and JavaScript
- JavaScript Module Pattern & Closures: 

- Current JavaScript does not have built-in support for modules,
JavaScript has had modules for a long time. However, they were implemented via libraries, not built into the language. ES6 is the first time that JavaScript has built-in modules.

But The most important work-arounds:
  - Old school Module Pattern Or Closure :
  - CommonJS Modules
  - Asynchronous Module Definition (AMD)
         Writing Modular JavaScript With AMD, CommonJS & ES Harmony: https://addyosmani.com/writing-modular-js/

ES6 Modules to rescue:
- The new version of "EcmaScript 6" or "ES6", offers a number of new features that extend the power of the language.

ES 6 Modules Features
- Modules let you write componentized and shareable code.
- ES6 modules are stored in files. There is exactly one module per file and one file per module.
- Each module is a piece of code that is executed once it is loaded.
- A module can import things from other modules.
- This approach to modules avoids global variables

----------- Normal scripts versus modules -----------

Normal scripts 
ES6 Modules
Default mode
Top-level Variables
local to module
ES6 Modules are singletons. Even if a module is imported multiple times, only a single “instance” of it exists.


- ES6 is not widely supported in today's browsers, so it needs to be transpiled to ES5.
       Transpiling : is a specific term for taking source code written in one language and transforming into another language that has a similar level of abstraction.

- ES6 Module Transpiler:
- You can choose between several transpilers.
The ES6 Module Transpiler is a tool that takes your ES6 module and compiles it into ES5 compatible code.
- We will Use Typescript
Install Using NPM -> "npm install -g typescript"
Compile           -> "tsc helloworld.ts"

-Note: TypeScript can be configured in two different ways: --target es6 or --target es5 --module commonjs.
  If TypeScript is set to target ES6 then it will output ES6 without transpilation. When set to target ES5 with CommonJS modules TypeScript will transpile your ES6 modules into a CommonJS format.

To be continued :)

Thursday, August 11, 2016

Git & Team Foundation (TFVC) Repo as cross platform Version Control With MS Team Services

- I guess We are All know the great VS Code , cross-platform development tool - supporting OS X, Linux, and Windows 
Visual Studio Code runs on Max OS X, Linux and Windows

- In VS Code you can find Visual Studio Team Services extension for Visual Studio Code :
This extension allows you to connect to Team Services

- Tutorial : Walkthrough of the Team Services extension for Visual Studio Code :

Team Foundation as cross platform Version Control:
Unfortunately VS Code Support Git Repo only , but you can use Team Foundation as cross platform Version Control by using Team Explorer Everywhere

Team Explorer Everywhere , contains Cross Platform Command-line Client

Tutorial : Using TFS Online TFVC with command-line TFS utility on Mac

Some Helpful References For More Information :