Friday, February 6, 2015

Weekend Reader 6

Agile Critics

The current state of agile is critizised by some more prominent figures:
Martin Fowler: Not Just Code Monkeys

Developers should not just be passive receivers of product backlog items. This is where most Agile transitions fail.



Dave Thomas: The Death of Agile
The first ten minutes are hilarious, where Dave is mocking the commercialisation of Scrum in the past and the new trend of selling “Enterprise Agile”.

Facebook announces React Native

With React Native Facebook invented yet another approach to program mobile applications in JavaScript. They promise to combine the best of native apps and the web. As far as I understood they use native components of iOS/Android (no HTML, no browser, no WebView), but they wrap them in JavaScript/JSX and use the JavaScript runtime on iOS/Android to orchestrate the application including the rendering. A very interesting approach …
However they are not chasing the “pipe dream of write once - run everywhere”. You will write apps dedicated for iOS or Android, however the programming environment will be the same. They call it “learn once, write anywhere”.

On a side note, the React Native presentation comes with a strong statement in favour of native app development and against web/hybrid mobile apps.

Yet Another JavaScript Framework with big Ambitions


Aurelia is a next generation JavaScript client framework, created by Rob Eisenberg, the creator of Durandal. Rob was for a short time part of the Angular team, but he changed his mind and decided to go his own way … the result is a modern framework that builds on ES6 and WebComponents. Sounds interesting, but sceptics might say:

The JavaScript ecosystem is broken

In the interesting article Generation Javascript the desolate state of the JavaScript ecosystem is revealed.

Not every week-end project should be made public and available through Bower. The Javascript community needs to learn to filter itself.

In the same direction goes: Why we should stop using Grunt & Gulp or my own post: Gulp is the Wild West

Client Side Templating: Good or Bad?

There has been some recent discussion about client side templating (like it is done by most modern JavaScript frameworks like Angular, Ember and also React):

The challenge was
- The problem with Angular
- Angular and templating

It reminded me of a debate from some years ago:
- Progressive Enhancement is Dead
- Progressive Enhancement: Still Not Dead,
- Progressive enhancement is faster

This time there was a very interesting reaction:
- Experimentally verified: “Why client-side templating is wrong” .
I like the conclusion that is backed up by data: For typical (line of business) web applications the advantages of the client-side rendering approach outweight the disadvantages by far. For public facing sites, where displaying initial content matters and functionality is only a second aspect, client-side rendering can be slower and optimizations with server-side rendering can be worth the effort.

You should start looking into ES6

ES6 will bring a lot of changes. JavaScript codebases will not look the same once ES6 catches on. Features like the arrow functions, template string and especially generators will change the face of JavaScript substantially.

The following videos give a good introduction to what is coming in ES6.

ES6 the future is now:



Netflix JavaScript Talks - Version 7: The Evolution of JavaScript:



To get started quickly with using ES6 now, this is a good tutorial: Javascript in 2015

Learning Promises

Promises in JavaScript are not the easiest concept to grasp. However due to the asynchronous nature of JavaScript they are a very important concept, that can and should have a major impact on the architecture and structure of JavaScript applications. I learned a lot from the following presentation: Promise-Based Architecture

Tuesday, February 3, 2015

Angular 2.0

When I am teaching my AngularJS workshops, there is usually a question about the future of AngularJS.

The Angular team announced Angular 2.0 at ng-conf Europe . There was quite some buzz after that announcement.

I think most of those reactions were premature. I am pretty sure there will be a sensible migration scenario from Angular 1.x to Angular 2. The Angular team at Google themselves will come up with a migration path as soon as Angular 2 will be better defined. And there is such a big community around Angular, that I am pretty confident that this migration will be pretty well supported and documented.

For current projects, I therefore recommend to use Angular 1.3. I would not wait for Angular 2.0, since it’s future is still pretty unclear and it will take a while until it is released. I would not recommend evaluating another framework just because of the announcement of Angular 2. As I said above, I strongly believe that there will be a viable migration path once Angular 2 is released. Also the concepts that build the fundamament of Angular (like databinding, directives, dependency-injection …) are not changing from Angular 1.x to 2. Therefore if a team learns to write Angular apps now with 1.3, this will be a good investment also for Angular 2.

I recommend to listen to episode 16 of Adventures in Angular for more information and assurance about the future of Angular and the topic of migration.


Saturday, January 3, 2015

My Year 2014

My year 2014 was interesting and brought many changes from a professional and personal perspective.

From the personal perspective …

I had two great vacations: I was literally beginning the year under water on a great dive trip in Raja Ampat. Diving with oceanic mantas was something I will never forget:

And my mountainbiking vacation in Colorado/Utah was another extraordinary experience:

However the probably much more profound event in my personal life came in October with the birth of our first child:

From the professional perspective …

I started to do much more teaching in 2014. My engagement at the Berner Fachhochschule was expanded and I am teaching a mayor part in the new CAS (Course of Advanced Studies) “Multiplatform Development with HTML5” and a smaller part in the CAS Mobile Application Development.

During the year I was giving quite a lot of inhouse courses for JavaScript development and AngularJS. These courses range from 1 day bootcamps to 4 day workshops. I held courses for UBS, BIT, Puzzle ITC, Glue, IMS AG, ESGroup and I could again give my JavaScript Bootcamp twice at the ch/open Workshoptage.

I enjoy working in the emerging space of “JavaScript as a serious application platform” so much, that I quit my job as a architect at my former employer. I am now working as a freelance developer and trainer with my own company.
The adoption of JavaScript in enterprise application development is the area I am currently focusing on.

In the typical educational institutions JavaScript is still pinned to the space of “Web-Design”. Apart from that there are almost no public courses to learn professional JavaScript development. Thats where I try to offer my inhouse courses: I specifically target typical enterprise environments and enterprise developers (Java or .NET) and I try to show the similarities between the modern JavaScript ecosystem and the traditional enterprise plaforms and also the pitfalls of JavaScript. I am offering courses for professional JavaScript development, for AngularJS, for React and for architecting modern html5 based frontends for enterprise systems. But I always tailor my courses to the specific needs of the individual team.

For the coming months I have already engagements for courses at Postfinance and at Mobiliar and I am looking forward to work with more teams. If you are interested in setting up a JavaScript/AngularJS/React course or coaching for a development team, please contact me.

There are also public courses scheduled, where I will be teaching:

Starting from April I will also be looking for opportunities to work hands-on in interesting projects. Of course my preference would be to work in projects where JavaScript and enterprise systems intersect.

Wednesday, December 31, 2014

Gulp is the Wild West

TL;DR This post described how I implemented asset processing with Gulp in a .NET project.

enter image description here

I am working on a .NET web application using Nancy in the backend and AngularJS in the frontend.
I decided to use a frontend-build based on Gulp. Frontend builds based on Grunt or Gulp have a lot of momentum right now, and this seems a better option for me than some .NET based tools like Cassette or SquishIt

By the way: if you have a node based frontend build you can run it on each Azure deployment like described here.

My requirements were the following:

  • For development the project should be runnable from VisualStudio without having to trigger a frontend build. That means that all the frontend assets have to be present at development time and referenced from my .cshtml files.
  • For release the frontend assets should be processed (concatenated, minified, revisioned …) by a frontend build. This build also needed to manipulate the .cshtml files, since they must reference the processed assets.

I started with gulp-usemin:

gulp.task("usemin", function() {
    return gulp.src("./Views/*.cshtml")
        .pipe(usemin({
            js: [ngAnnotate(), uglify(), rev()]
        }))
        .pipe(gulp.dest("Dist/"));

});

This was nice and easy and worked well … until I had some more requirements …

The problem:
With gulp-usemin you have not access to the stream in a pipeline. So you are limited to list some tasks that should be performed. If you want to do something more fancy, you are out of luck. In my case I wanted to add the output of angular template cache to my main js file after it has been concatenated and minified…
In my case I wanted to append another JavaScript file that contains my angular templates (generated with gulp-angular-templatecache)

So I started looking for another solution… thats where I discovered that I am in the Wild Wild West: gulp-usemin2, gulp-spa, gulp-asset-transform, gulp-inject, gulp-rev-replace, gulp-useref, gulp-rev-all, gulp-rev-collector … all seem somehow to do something similar, documentation is minimalistic and you can waste a big amount of time to find the right plugin combination that works for you.

I ended up with the following combination of plugins:

var gulp = require("gulp");
var ngAnnotate = require("gulp-ng-annotate");
var templateCache = require("gulp-angular-templatecache");
var uglify = require("gulp-uglify");
var addsrc = require("gulp-add-src");
var concat = require("gulp-concat");
var rev = require("gulp-rev");
var minifyCSS = require("gulp-minify-css");
var useref = require("gulp-useref");
var filter = require("gulp-filter");
var revReplace = require("gulp-rev-replace");
var order = require("gulp-order");

gulp.task("angular-templates", function(){
    return gulp.src(TEMPLATES_SOURCES)
        .pipe(templateCache(TEMPLATES_JS, {module: "moonwalk", root: TEMPLATES_ROOT}))
        .pipe(gulp.dest("Temp/"));
});

gulp.task("release-assets", ["angular-templates"], function() {
    var assets = useref.assets();
    var jsFilter = filter("**/*.js");
    var moonwalkFilter = filter("**/" + MOONWALK_JS);
    var cssFilter = filter("**/*.css");

    return gulp.src("./Content/**/*.cshtml")
        .pipe(assets)               // Concatenate with gulp-useref
        .pipe(jsFilter)
        .pipe(ngAnnotate())         // Process javascript sources to add dependency injection annotations
        .pipe(uglify())             // Minify javascript sources
        .pipe(jsFilter.restore())
        .pipe(cssFilter)
        .pipe(minifyCSS())          // Minify CSS sources
        .pipe(cssFilter.restore())
        .pipe(moonwalkFilter)       // Filter the moonwalk.js source file, which is generated above by useref
        .pipe(addsrc("Temp/" + TEMPLATES_JS))// Add the templates.js to the stream, which is generated by a seperate task
        .pipe(order(["**/" + MOONWALK_JS, "*.js"]))// Order stream, so that templates.js is appended to moonwalk.js (needed, since templates depend on the angular module)
        .pipe(concat(MOONWALK_JS))// Concat the existing moonwalk.js and the templates.js into moonwalk.js
        .pipe(moonwalkFilter.restore())
        .pipe(rev())                // Rename the concatenated files
        .pipe(assets.restore())
        .pipe(useref())             // Replace the original references in the cshtml with the concatenated and processed resources by usemin
        .pipe(revReplace({replaceInExtensions:[".cshtml"]}))         // Replace the usemin generated resources with the reved resources
        .pipe(gulp.dest("Dist/"));
});

And by the way: This thread about running tasks synchronously is representative for Gulp (final verdict: “This will be fixed in gulp 4”) … welcome in the wild wild west!

Sunday, December 21, 2014

Weekend Reader, Week 51

IMG 0221

Rob Ashton speaks at the .NET user group

I never met Rob, but I think he is a very interesting character in the programming space.

His episode as a “journeyman programmer” is mind blowing and I suggest to every enterprise programmer to have a look at it: "The software journeyman's guide to being homeless and jobless.” (or if you have a plural sight subscription you can watch the production: Change it Up where Rob Conery does an extensive interview with Rob).

Rob will be speaking on January 7th in Bern and on January 8th in Luzern about "Frameworkless development with NPM and React” - a very interesting topic in my opinion. And of course not at all related to .NET programming :-). So I hope to see some non .NET programmers at the event...

While we are at it, here are some further interesting posts of Rob Ashton:

 

Software engineering in practice

Very nice presentation by Marc Hofer about Agile software development.

 

Which Silicon Valley company has the best intern perks?

So the myths are true, there are companies that do a lot for their employees ...

 

From Open (Unlimited) to Minimum Vacation Policy

… perks are not without problems:

Netflix has it, Virgin has it: Unlimited vacation policy … but not everything that shines is gold:

The cause was intended to be noble, as we didn't want to get into the way of people taking time off as much time as they need to recharge.[…] Two years later, this idea turned out to be a failure, and we're changing our vacation policy.

 

Letter To A Young Programmer Considering A Startup

Startups are not that sexy any more according to:

A startup job is the new office job. Startup culture is the new corporate culture.

Here is also a recent production of Swiss radio SRF about the “disillusion of startups” (in German): Start-up-Firmen: Der Traum vom nächsten Facebook

 

The State of JavaScript in 2015

The JavaScript world seems to be entering a crisis of churn rate. Frameworks and technologies are being pushed out and burned through at an unsustainable speed.

 

More developer tidbits:

 

Friday, December 19, 2014

Presentation: Java & JavaScript - Best Friends?

Jjs

Last week I was invited again to give a talk at the annual developer day of Swiss Railways (SBB).

As every year the conference was a great event with many great sessions and interesting discussions during the breaks.

My talk was about how JavaScript can fit into a Java ecosystem.

Tuesday, December 2, 2014

There is something about JavaScript - My Slides from the Choose Forum 2014

JavaScript
I was very honored that I was invited to speak at the Choose Forum 2014 along with Michael FeathersErik Doernenburg and Adam Tornhill.
These were the slides for my talk “There is something about JavaScript”:

Related Posts Plugin for WordPress, Blogger...