VueJS 2.x

I’m trying to use VueJS (Front) + Ruby On Rails 5.x in Backend. I will talk about Rails in some next post… maybe聽馃槅


Why VueJS? well, this project have short scope and like any startup project, must be fast! so, I found Vuetify an amazing library with material directives ready to use. I just has created some Vue component’s, stores and all has been fast since then. The docs is easy to understand and to apply. I just have created the following structure:


Note Templatevuetify.vue component. This is the «common template». The notifications components is attached聽to this聽component for all common messages. All rest it’s same! 馃榾 you know:


<template lang="html">
    <v-navigation-drawer temporary v-model="drawer" :mini-variant="mini" dark :hide-overlay="true">
      <v-list class="pa-0">
        <v-list-tile avatar tag="div">
              <img src="avatar.jpg" />
              <v-list-tile-title>Homero Thomson</v-list-tile-title>
              <v-btn icon dark @click.native.stop="mini = !mini">
      <v-list class="pt-0" dense>
         <v-divider light></v-divider>
         <v-list-tile v-for="item in items" :key="item" @click.native="redirectTo(item.goTo)" v-if="item.roles.includes(currentRole)">
               <v-icon light>{{ item.icon }}</v-icon>
                <v-list-tile-title>{{ item.title }}</v-list-tile-title>
    <v-toolbar fixed light>
        <v-toolbar-side-icon light @click.native.stop="drawer = !drawer"></v-toolbar-side-icon>
    <main class="mh1000">
          <template slot="main-content-notification-success">
          <template slot="main-content-notification-error">
          <template slot="main-content-notification-warning">
          <template slot="main-content-notification-info">
       <v-container fluid>
              enter-active-class="animated fadeInRight"
              <slot name="main-content"></slot>


In api folder we have all request to API using the official library for Vue: Axios. These small objects just call to API and return any response. All treatment of exceptions or error handles is allocated in stores. In stores I included the Notifications, so all the components is mainly independent of all request and errors on responses.
All necessary and recurrent data is stored in each ‘store’, so the application don’t need re-call to API for get data. Later of this, all looks very fast and simple to code level.

After聽use VueJS 2.x I can say that have the magic of AngularJS 1 and some ReactJS concepts, like components. The learning curve is considerably less than AngularJS 1.x and of course of ReactJS, you know… just I needed 2 days with this tutorial and 1 day for apply Vuetify and some customizations.

The most popular questions for Vue is: is Vue scalable for larger apps? I don’t sure 馃聽I mean, how big are we talking about? I guest it works and we keep simple code and fast application. But definitely it’s much better than AngularJS in many respects.

Do you know to Fattoruso musicians family? You should!聽馃榾



MavensManager: features for Poker Mavens

Mavens Manager

I developed a new product for Poker Mavens聽of Briggsoft Works: MavensManager.

MavensManager is a backend for owners of Poker Rooms with Poker Mavens developed with CakePHP 3.xx (API) and AngularJS (Front End). Jackpot, Rake in realtime, Stats and an Affiliate system are some of the features.

Each user can view all the reports and histories of the game, and get stats for know trends of their business.

Remembering good music


Cut the middleman in Programmatic Advertising

Taggify聽just launched a new platform that allow get your own bidder within a few minutes! You can get 1 to N bidders and distribute your endpoints selecting the location based on supply and latency.

Other great features: Up to 12000 QPS per instance and with Real-Time access to metrics!

Bamboo is a聽conductive pipe with no intermediaries, programmatic media buying through Real Time Bidding!

More in:


Using AngularJS on CakePHP 3

In this last week I have been working in a new project聽聽using CakePHP 3 , MySQL and other tools when MongoDB and the framework AngularJS. I worked with CakePHP in the version 2 and have found some new nice improvements.

The first sorprise is the new ORM, in this version Cake separe the Tables of the Entities. The tables objects (as聽the older «Models» objects) allow make CRUD operations with database data, define relations, etc. But the Entities allow define the behavior and functionality of the an instance.

For some integrate AngularJs in CakePHP 3, I used a structure as follow:

------------/MyApp <-- Name of your app
------------------/controllers //<-- your controllers here
------------------/directives // <-- your directives here
------------------/lang // <-- translate files (ngTranslate)
------------------/modules // <-- your modules here
------------------/services // <-- your services/factories heres
------------------/app.js // <-- define the app AngularJs here
------------------/angular.min.js // <-- Angular file

After you must add in the html聽tag聽of your default layout (usually in CakePHP 3: scr/Template/Layout/default.ctp):

<html 聽data-ng-app="MyApp" id="ng-app">

Create a new folder called «Element» and a file «angular.ctp»:

 //echo $this->Html->script('MyApp/lang/translates.en', array('inline' => false));

 //Angularjs Inclusion
 echo $this->Html->script('angular.min.js', array('inline' => false));
 //print the modules that are dependencies for our app 
 echo $this->Html->script('MyApp/modules/ngTranslate', array('inline' => false));
// echo $this->Html->script('MyApp/modules/ui-bootstrap-0.11.0.min', array('inline' => false));
 echo $this->Html->script('MyApp/modules/ui-bootstrap-tpls-0.13.0.min', array('inline' => false));
echo $this->Html->script('MyApp', array('inline' => false));

And include this in default.ctp (or in default layout):

<?php echo $this->element('includes/angularjs'); ?>

With this configuration, you are ready for聽write new controllers, models, directives and services for your聽application. For example for this project, I writed a functionality for an message system:

<div class="modal-content">
   <div class="modal-header">
       <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
       <h4 class="modal-title" id="actionsModalLabel"><?php echo __('Write a message'); ?></h4>
   <div class="modal-body">
      <form class="form-group" role="form">
         <select class="form-control" ng-model="DashboardCtrl.recipient">
            <option ng-repeat="affiliate in DashboardCtrl.affiliates" value="{{}}">{{}}</option>
   <div class="modal-footer">
      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      <button type="button" class="btn btn-primary">Save changes</button>

In the main section I added the ngController:

<div class="row" ng-controller="DashboardController as DashboardCtrl">


I will continue writing about this project. The next thing to explain is how to integrate MongoDB 馃檪

Now… you know… MUSIC!


Leading a team

There are many ways for lead a development team. Some of them require a work of long term, and other are more practical. The long term is not viable, because the members of a team in this sector is changing constantly.

I know three ways for lead a team that is succesfull if we combine them:

Leader with direct orders
table-militar-startupThis dictatorial way can be used when a project is in crisis, about to fall. In this case the team need a decisive leader and with personality. Also is helpful when must be a make radical changes. Sometimes the members resist to radical changes, or to new labor policies.

If you have member without compromise or enthusiasm you would up the team with this way. But this not good to long term, because some people can be desmotivated.

The coach leader

coaching-leaderThe coach leader is a technical referent that cooperates with all the team. He take desicions together with all members. Using this method, you should share the knowledge and generate feedback constantly . Each step is explained and discussed with the workteam, empathy and enthusiasm and promoting the personal growth.

The risk of this is the聽low productivity because the under聽control.


The director

director-leaderWorking of this mode聽the leader shows the way, directs the activities and monitors all process but doesn’t participating directly. Supports all their trust in your team. This is useful in teams with high degree of motivation and compromise. In short: direct and delegate.

The great disadvantage of this is that team feel that their leader is not actively part of the team and no commitment as equals.

You must combine this ways, depending of the circumstances. Anyway, be honest, listen of your team, delegate and respect regardless of the technique used, is the most important… for me 馃檪


Before starting a new application for Start Up projects

Many times is thought that when starting a new start up project, we must be quick in gather the requirements, quick in development process, quick in test process… etc. We must devote specially attention and time to the requirement process. This step is the more important, and this step is decisive for the success or failure of the project.

I thought some fast tips for starting a new start up project:

  • Gather information about the customer company:
    • Objectives, services, products. Is a USP? (Unique Selling Proposition).
    • Competitors.
    • Define the targeted audience for the new application (age, social sector, etc).
  • Access to the application (devices, resolutions, etc)
  • What likes/dislikes of the other applications.
  • Define the limit for the plan project: final date, resources

checking list start up

This few points seem fast, but it is a round trip with the customer of many meetings before starting the new project. In each meeting the customer will define new features and flows, and the original idea will mutate.
Mutate a started application can be very difficult, or not viable, for that reason define this points before of start is the best way of avoid the failure.

Define first… take five聽馃檪


Documenting start up projects

In software engineering聽become independent the聽people of the processes is not an easy task. Even more in 聽start up聽projects.聽We can know some methods and practices that we are likely to lead to success,聽but we are never entirely sure and that’s because every project and every workteam is a world in itself.聽However, we can always limit to the maximum the errors and failures following simple practices and processes that will help us not to trip over the same stones.

Why document?

One of the advantages of having trained leaders in the workteams聽is that we can count on your experience.聽They will remember cases and situations that led to the triumph of their teams聽and recognize those practices that led to fail. One of the problems is that in the development market and start up solutions, the workteams聽are disassembled and technologies and processes become obsolete quickly.road to success documenting
When a challenge arises or聽a new project appears, the聽first thing we do is look for documentation about it.聽Seems that there is always someone who has taken the trouble to share and document information.聽We have to document in detail our successes and to apply it despite the time, techonologies and workteams.聽We analyze and write what led us to a happy ending, or failure to learn from it.聽But also for others who continue to the project,聽or who entering the team to have everything needed to adapt and continue working -which means cost savings when it comes to bring in a new member-.聽It’s very common to see people coming and going every day in the聽development companies,聽and is more common to see companies lose the control of their projects by this constant employees flow.

When making decisions in a team,聽forms of work are chosen or聽agreements are made,聽is important to write and document a methodical way.聽All agreed and discussed at each meeting must be captured to take it as reference聽and guide for our daily work.聽Is very easy that the words are carried by the wind, and the responsible persons are hidden behind this fact.聽When the agreement is documented聽we have a record and evidence that聽sometimes it helps to keep the wheels on the road.
This documentation of agreements and meetings is also valid for customers, they also must be able to refer to everything discussed and agreed in an easy way and anytime.

How to document start up projects?

document shared start upThe customers want efficient and simple products, but mainly聽they want it fast and at low cost. Document takes time,聽therefore increases directly on the cost of the final product.聽Find the balance between a relatively detailed documentation and the time available to apply聽is one of the challenges of development of agile applications companies.

There are many methodologies to implement at low cost聽but in any case it requires a number of practices in the development process聽and a series of complaints from developers too :).聽In any case you will need:

  • An initial documentation to clarify the proccesses of documentation of projects.
  • A control process that ensures that all member of the teams follow the documentation process.
  • A quick and easy way to write processes, meetings, agreements, technologies used, way to application and activities taking place.
  • A tool easy to learn and does not require lot time of聽maintenance.

This is how a policy of documentation in your workteam聽will allow you the projects become independent to the people,聽learn from your mistakes and repeat your success.

Now, as always for closing I leave a new auditory adventure 馃檪


Organization of start up developer apps

Articulate a developer workteam is not should a easy task. Again… in the start up projects all is fast and should be practice for get the final product to customer quickly.

First, we need choose a methodology for organize the work. All the team should know in details all process of work. The way most choosed usually is the Scrum. Why scrum? because es very easy of apply聽even the dumbest person can work with scrum methodology and not needed many roles. An聽simplified way of Scrum should be have:

  • A Product Manager: He has contact with the customer. Manage the available resources. Document their needs and guide to the workteam to the final product.
  • A Project Manager: Define the scope of the each iteration. Defines the roles and controls the process are complies聽as: documentation, responsabilities, delivery times, etc.
  • Testers: He test the quality of each element of the system. Defines the standard and the process of quality. He controls that each part complies with聽the correct programming methodologies.
  • Developer team: Generally, all does this. The mentioned roles, they haven’t much time for programming, but usually participate in the developer process.


meeting-start-upA system of comunication is essential. Forums, internal messages system (chat), tracker system (fundamental) and a series of regular meetings. The meetings of team is particulary important, this allow to the all team analyzes, shares, talk about the problems or detours and take some decisions together. 聽Any member of the team should can request a meeting for talk about contingences, new ideas or new challenges.


motivation-start-upThe motivation is the heart of the team. Many enterprises leaving aside this aspect, instead apply more control systems focusing the motivation in the member with the highest roles. But the point is that all the team must be motivated, with energy and especially聽considering what the customer wants.

This point has become the most sensitive for some聽development companies. They are dedicating considerable time and resources for obtain motivated teams. Is very common see games rooms,聽training events, special benefits,聽extensive聽and comfortable places of work with high technology in the development companies.

Personally, I think like any worker -in a ideal world- each member of the team must have a competitive salary, be heard聽and love what do.

For you… «First Circle»


Estimation for start up projects

In the market of the development of applications for start up business, the estimation of the projects is one of the most crucial tasks. It depends largely the success or failure of all the project. Detours, delays, incidentals and other external factors affect the development time and in the start up world there is not time for a complete planification of project.
However, it’s our duty devote time and effort required for find a way of standardize the estimation process. Why standardize? for reduce the effort whenever a new customer appears. The standardization processes allows invest the effort once.

There are many techniques for the estimation. But, I have some shortcuts for start up projects that usually consider:

  • Define some available resources:
    • Size of workteam.
    • Capacity of the members of team -each member of the team should have a different weighting of the time effort-. For this reason we have take a standard time unit, and weighting each member according to their abilities, e.g. 1 hour for Technical Leader = 1.4 hours for SSr. developer.
    • Available technology.
  • Divide the project in small tasks, as small as possible.
  • Add 5% for testing tasks. Each part must be tested and revised.
  • Add 2% for documentation of the most important elements.
  • Add 5% for planification and organization of the workteam (meetings, analysis of the system flow, etc).
  • Add 10% for contingency and possibles delays.

Once we have define this, we create a small guide for follow each time we have to estimate.

And now… Fabiana Cantilo