I just came home from Weblica, the very first ever developers conference in my Međimurje county. All in all, a very good conference and I hope this is just the first one in the years to come! The entrance was free and every attendee got a T-Shirt. Since I was active with questions I got a nice tiblica with an USB instead of meat inside 🙂 as you can see on the featured image above. Below are my notes and some pictures, and a friend of mine uploaded few videos (including me using Oculus Rift) on youtube playlist.

ECMA Script 6 – the future is JavaScript

• Presenter Ratko Ćosić, MCSD, MCSE, MCITP, …
• JavaScript was the language of 2014
• ES6 (Harmony) features:
  • array functions (var sq = x => x*x)
  • block level scope (by using keyword let)
  • classes

    class Shape {
        id; x; y;
    
        constructor (id, x, y){
            this.id = id;
            this.name (x,y);
        }
    }

  • inheritance (extends keyword)
  • modules (kind of a merge between CommonJS and AMD, support for import, export)
  • promisses – similar to jQuery Deffered object
  • constants
  • new regular expression functions
  • new Math functions
  • symbols
  • typed arrays
  • default parameters
  • generators
  • map objects
  • collections (let s = new Set();)
  • better support for strings with for example backticks (`), includes(), startsWith(), endsWith() functions
• Transpilers => conversion of JS from one version to another (Traceur, 6to5, Babel, TypeScript?
• TypeScript – superset of JS, compiles to JS (ES5)
  • Angular2 uses TypeScript!
  • short types, interfaces, generics
• Open question: will SPA frameworks (Angular, Ember, Aurelia) be needed when we’ll have ES7???
• Browsers will be the new OS-es!
• picture time!:
  

node.js (sa sirom i vrhnjem)

• Presenter Davor Tarandek, Tria d.o.o.
• io.js uses the newer V8 engine than does node.js
• asynchronity is hard to grasp
• pm2 is awesome and it overpassed forever module
• I actually wrote three rather extensive posts on the topic of the MEAN stack, that’s why I have so little notes from this lecture
• picture time!:
  

Ember.js in practice

• Presenter Nikola Begedin, Coder.ly
• convention over configuration
• ember-cli is the thing
• allows ES6 syntax (Babel transpiler mentioned earlier)
• uses npm and bower
• ember is not ember-cli (is what the Ember team recommends)
• Some cool tools they use
  • Error reporting – Sentry
  • Task tracking – Asana
  • For chat – Slack
  • Heroku, Mandrill, Stripe, Amazon S3, Cloudfront, KissMetrics, Segment, NewRelic, CodeClimate, …
• Recommended books to start Ember – Ember CLI 101 (google for it, it’s suppose to be free ;), if not, don’t mind spending a buck or two)
• Talking Code podcast on iTunes
• picture time!:
  

Modern web using Microsoft tools

• Presenter Miroslav Popović
• Microsoft Studio vOld = .NET, 2003, 2005, 2008, 2010
• Change started with ASP.NET MVC
• 2012/2013 – Interface design, new web editor, GIT
• HTML support – full HTML5 IntelliSense, code snippets, data-* attributes
• JS – ECMA Script 5 support, strict mode support
• CSS – IntelliSense CSS3 validation, color selection, vendor prefixes, CSS drag/rop
• Browser Link
• Other stuff: CoffeeScript coloring, Mustache, Handlebars, Knockout bindings, Angular Directives, LESS and SASS preprocessors, TypeScript
• Community Edition FREE for up to 5 devs?!
• WebEssentials
  • open source extension for VS
• 2012/13 VS added Node.js based tools
  • static bundling & minification, image optimization & sprite generating, JS Hint, Source maps, LESS/SASS and CSS preview, CoffeScript preview
• Visual Studio 2015
  • new web structure
  • package managers – NuGet, npm, bower, jspm
  • client side build tools – MSBuild, Grunt, Gulp, TaskRunner Explorer
• Visual Studio Code – doesn’t (yet) support plugins like Sublime Text for example, but that’s a TODO
• Other cool tools: Resharper, SideWaffle, Github for VS, Chutzpah (Jasmine, Qunit, Mocha)
• picture time!:
  

Effective software team collaboration

• Presenter Zvonimir Juranko, Colombio
• Colombio app
• dare to disagree
• 85% of people fear the conflict with their boss
• The Marshmallow Challenge
• LEAN canvas
• be prepared to fail!
• genchi genbutsu – try it out yourself!
• make a MVP (minimum viable product) and build upon that
• picture time:
  

Oculus Rift – virtual reality for everyone

• Presenter Tibor Kozjak, Infenso d.o.o.
• there are some issues to be solved still
• price around 500$ with shipping to Croatia
• I tested the device after the talk and I guess in my case the verdict is “it’s really not for everyone, since I’m probably feeling sick and dizzy still :O”
• picture time!:
  

Hope to see you next year!

edit: A cool video made by the organisers after the conference:

Weblica 2015 from TICM on Vimeo.

Touch Pianist is an awesome free app which

is a musical toy / instrument that allows the user to perform hard-to-play classical piano music favorites (from composers like Beethoven, Mozart, Bach, Satie, Debussy to name a few) just by tapping the rhythm of the piece’s par

From developers point of view, the app was made using Pixi.js. Since this raised quite a buzz, I’m expecting to see Attack of the Clones 😉

Recently I bought a years worth subscription over at Pluralsight (here’s my portfolio of passed courses), and here I’ll be posting my notes from the courses that I attended. Please note that this is not meant to be as a sort of tutorial, just as the name says – notes for myself :). However, one could get some useful content from these posts as I’m noting things that catch my attention.

Here are my notes from the WebGL and Three.js fundamentals course. I rated the course 4/5 and all in all it’s a good introduction to WebGL with Three.js.

//rant: I passed the exam with the whopping 100%, and actually I feel that since Pluralsight is very famous and all that, that they could improve on the quality (it’s just too easy and does not go into detail) of these certification tests.

var scene = new THREE.Scene(); //acts like a container of all items

var renderer = new THREE.WebGLRenderer(); //how our content will be displayed on the page (WebGL, Canvas or SVG renderers)

It uses a Cartesian cordinate system (x,y,z). If you don’t specify the position- it will be positioned at (0,0,0).

It has a perspective and ortographic camera:

camera = new THREE.PerspectiveCamera(
35, =>fov
window.innerWidth / window.innerHeight,
1, => near
1000 => far planes
);

You can use your dev tools console (Chrome) or Firebug (Firefox) and access items if you properly export the objects in the code (return {scene: scene}); code snippet in the listing below):

//app.js file
var example = (function(){

    "use strict";
    
    var scene=new THREE.Scene(),
    renderer = window.WebGLRenderingContext ? new THREE.WebGLRenderer() : new THREE.CanvasRenderer(),
    light= new THREE.AmbientLight(0xffffff),            
    camera,        
    box;

    function initScene(){
        renderer.setSize( window.innerWidth, window.innerHeight );
        document.getElementById("webgl-container").appendChild(renderer.domElement);

        scene.add(light);
                          
        camera = new THREE.PerspectiveCamera(
        35,
        window.innerWidth / window.innerHeight,
        1,
        1000
        );
                            
        camera.position.z= 100;            
        scene.add( camera ); 

        box = new THREE.Mesh(
        new THREE.BoxGeometry(20,20,20),
        new THREE.MeshBasicMaterial({color: 0x00FF00})
        );

        box.name="box";   

        scene.add(box);

        render();
    }

    function render(){
        box.rotation.y +=0.01;
        
        renderer.render(scene, camera); 
        requestAnimationFrame(render);        
    }

    window.onload = initScene;
    
    return {
        scene: scene
    }

})();

//HTML file
<!DOCTYPE html>

<html>
    <head>
        <title>WebGL with three.js Fundamentals</title>       
    </head>

    <body>
    	<div id="webgl-container"></div>
    	
    	<script src="scripts/three.js"></script><!--DL this from official site-->
    	<script src="scripts/app.js"></script>
    </body>
</html>

Accessing it from Chrome Console as mentioned above:

var a = example.scene.getObjectByName('box');
a.position.x = 10;
a.position.set(0,2,2);

• Degrees to radians formula: radians = degrees *pi/180
• Meshes – geometry + material
• use stats.js
• different existing controls: FlyControls.js, OrbitControls.js
• Collision detection
• Raycasting – returns objects that are on some other objects “ray” and Box3.
• Physics: PhysiJS is a wrapper for Ammo.js which is a port of C++ Bullet
• Supports gravity, mass property, friction, restitution (bounciness)

Cool 3D frogger game made by the author: https://github.com/alexmackey/threeJsFrogger

I was testing Jenkins and as it doesn’t support localhost addresses I found Localtunnel, which, and I qote,

allows you to easily share a web service on your local development machine without messing with DNS and firewall settings.

Localtunnel will assign you a unique publicly accessible url that will proxy all requests to your locally running webserver.

You can  install it via npm:

npm install -g localtunnel

Then, start your project on some local port (for example 1337), and make sure all works well locally. Now, request a tunnel to your local server:

lt --port 1337

And you should get an output like:

your url is: https://awesome.localtunnel.me

You can use this link now and any requests to that url will be routed to your service on port 1337.

I’m a big fan of Stack Overflow and I tend to contribute regularly (am currently in the top 0.X%). In this category (stackoverflow) of posts I will will be posting my top rated questions and answers. This, btw, is allowed as explained in the meta thread here.

My question was:

I have a domain www.example.com and I have set .htaccess file to redirect all example.com to www.example.com

Now, I made (through my plesk 10 interface) a subdomain abc.example.com and what I would like is to also have www.abc.example.com so I entered (also in plesk) this:

www.abc.example.com.    CNAME   abc.example.com.

But it’s not working. Do I need to reload/restart dns?(if so, please tell me how?) Or do I just need to wait certain time for this until it propagates?

Since my mentioned CNAME didn’t work, I also added the .htaccess (which might be wrong (I know, not much of a server person 🙁 )) in the abc folder which looks like this:

RewriteEngine on
RewriteCond %{HTTP_HOST} !^abc.example.com$
RewriteRule ^(.*)$ http://abc.example.com/$1 [R=301]

but with no luck, so please shed some light.

I found the solution myself in the end:

In Plesk I made one subdomain.domain.com pointing to lets say abc folder, and then I added the www.subdomain.domain.com also through Plesk but pointed it to the same abc folder. Then I added the .htaccess file inside this abc folder (where all other files for this subdomain reside) which now guarantees that all requests to subdomain.domain.com get redirected to www.subdomain.domain.com. Here is my .htaccess file:

RewriteEngine On    
RewriteCond %{HTTP_HOST} !^www.subdomain.domain.com$ [NC]    
RewriteRule ^(.*)$ http://www.subdomain.domain.com/$1 [R=301,L]

Hope this will help someone beginning with this stuff like me.

Just to note, the credit for the idea of pointingthe www.subdomain inside the same folder goes to user Bryan White on serverfault

My notes from the book Brain rules for baby by John Medina:

Babies develop an active mental life in womb. Stressed mom, stress baby. Eat right, stay fit.

Newborns remember sounds they were exposed to when they were still in the womb. 

Baby will love to eat with mother ate during pregnancy.

Larger babies are, to a point, smarter.

Mothers can boost baby brain development by proper gain weight, balanced diet, modern exercise and stress reduction.

Happy marriage, happy baby.

I’m spiteful of my husband because he gets to sleep through the night. My daughter is nine months old and she still wakes up three times a night. My husband sleeps right through and then wakes up so exhausted.

Children have never been good at listening their parents, but they have never failed to imitate them.

Mothers milk is the silver bullet. Breast-feeding makes baby smarter.

Speak to your children as much as you can.

Do not tell them they are smart! Praise the effort, not IQ!!!

Make the child understand that the mistakes occur because the lack of effort, and not from the lack of ability.

The amount of TV a child should watch before the age of two is zero. But, after the age of five it is good, but only those shows that teach them.

No T’s in kids rooms! Research shows these kids scored way worse than those kids that don’t have TV in their rooms.

Brain loves exercise.

Intellectual pressure (expecting too much too early stage) can actually hurt your child intellectual development.

I’m all about advancement, but this just kinda starts to freak me out, fearing that we just may end up as in the movie Surrogates. But, it’s so cool 🙂 – can’t wait to see how will they make fighting games for it. Yeah, I’m sure pr0n industry will have it’s market for it too 😉

So, I guess, it’s just as with everything “groundbreaking” – shut up and take my money 🙂 But, on a more serious note – we just may wanna keep our vigilant eye open…

edit: Today (9.05.2015), on a developers conference in my hometown I tried out Oculus Rift, and  all I got to say is that I’m still feeling dizzy and sick, so yeah, this just may not be for everyone – not for me that’s for sure :/.

This error come up when I tried to use the debugging tools for Node.js program using Visual Studio Code, as outlined in their official tutorial.

The solution was quite easy actually – on a Mac all I had to do was run the following command:

brew install mono

You’ve all heard the news – Microsoft made a free editor for developers called Visual Studio Code. You can download it from the official page here. The cool thing is that it works on Windows, OS X, and Linux, with support for IntelliSense, debugging, and GIT.

It’s worth making a distinction between Visual Studio 2015 which is still the full integrated development environment (IDE), while Visual Studio Code is “just” an editor – but from what I saw so far, a good one.

For the past 26 weeks I’ve gone through the MaxCapacity program 2 times (2 * 12 weeks + 2 weeks rest time between), and I can tell you that the program is all but easy. I really like it, but no matter what others say – I don’t recommend it for beginners (I did, and it didn’t work out so well). So, if you can’t do like 10 pushups straight, there’s really no sense in trying this workout as it will leave you disappointed.

The app (Android and iOS) is free to download, so this is a review in a way to say thanks to the author Samy Peyret (you can support him by buying his book on Amazon).

So, the main breakdown is pretty simple; you have to exercise only for 16 minutes, 3 times a week for 12 weeks. Honestly, if you don’t have 16 minutes for exercise, then something is seriously wrong, but that’s another topic… Exercises are very well planned and they grow in toughness as the weeks go by. Main idea is that in 3 weeks you do the same set of 4 different exercises on Monday, a different set of 4 exercise on Wednesday and  a different set of 4 exercise on Friday. You rest on Saturday and Sunday.

First week is a 50/10 regime, meaning that you are doing the exercise for 50 seconds and then you rest for 10 seconds – you should log your best (usually the first set) score. Second week is a tabata (20/10) regime, and here you should log your weakest score (usually one of the last sets – here you have 8 sets since the exercise is only 20 seconds long). The twist comes in the third week where you have to beat the time and do the calculated amount of repetitions ([max 1st week score + min 2nd week score] * 3) as fast as you can – and if you can do it below 16 minutes, you Rock.

I logged each and every set (you can download the full excel file: MaxCapacityTrainingLog), and as you can see it turns out that the second time I got to do the exercises, I did them with a whopping 24.32% increase in number of repetitions, so yeah – it works in only 16 minutes 3/week! The 24% increase is the average of all the exercises, some of course vary as you can see in the aforementioned excel file. The biggest advancement I noticed was with the diamond pushups, where I did a 150% increase in number of repetitions for the max count, and 135% in total sum!

So, to sum up – very much thanks to the author for making this a free resource. If you like it, you can support him by buying his book on Amazon.

An example of the first week the first time I went through the program compared to the second time I went through it:

Monday
[table id=1 /]

Wednesday
[table id=2 /]

Friday
[table id=3 /]

Give it a try and hit me back with your numbers and let me know what you think!

App idea alert!: Maybe a good idea would be to make a repository of scores so that one could see where he stacks up between others!?