Jedi or Padawan ?

Tech talk presentation on best practices in Client side Engineering

White side or Dark Side ?

All of us here are software engineers which are quite lucky to be in the place we currently are, so how did it start ?

WEB Developer

I started as a Web Developer in a startup in a country which geographical position is a mystery :D, Web

Developer what does it mean ? Means you have to know PHP-Python, JavaScript, HTML4, CSS2 and

constantly invent wheels, reinvent them or even repair.

Was that fun ?

No Way, It was not, hours and hours of debugging, headaches, and when you are there, suddenly client

changes his mind and wants new features, so you have the redo or glue the all shitty code you

produced to get the result.

So how to solve ?

Some developers run to the nearest supermarket to buy glue and start repairing the project producing

even more shitty code, some of them just switch off the phone and hide their steps like professional serial

killers.

No Other way ?

No, there is not, so I decided no to go through any of these paths, I just quit my job and went as a Junior developer in a company where I could learn anything.

Buy Books !

Yes I started to learn books, started to learn from Gurus, spent a lot of money attending different

conventional conferences and learning from people, actively communicating with communities and doing

meetups.

I got the light !

Yes I suddenly realized that I was a complete Padawan on my way to become a Jedi, I started to fight on the light side of

power.

My Friends

I got friends with nouns like Design Patterns, Coding standards,

Documentation, TDD and Frameworks.

My Teachers

Two books changed my life forever and introduced a collection of books to read in future: 1. The Gang of Four2. Douglas Crockford – Javascript the Good parts

Frameworks and how do we eat them ?

Currently on the market there are two most popular Client side Frameworks:1. Backbone2. Angular

Frameworks and how do we eat them ?

Currently on the market there are two most popular Client side Frameworks:1. Backbone2. Angular

Who are they ?

Backbone is a veteran on the market, a lot of Enterprise applications written on it, Angular also is quite mature but got most of the fame during latest releases, Mostly these frameworks bring on board similar ideas, but they have fundamental differences.

Backbone

1. Light2. Custom Templating3. MV – Coll Architecture4. Flexible5. Data binding managed manually

(performance)6. Views are Javascript Objects7. Models are Javascript Objects

Angular

1. Complete application Framework2. Built in templating3. Two way data binding4. Forces its own way to develop apps5. View is a DOM object 6. Model Is a plain JSON object

Which is better ?

Both, Angular provides robust and complete solution for creating applications from scratch, Backbone is a professional tool for porting existing Padawan legacy codes to modern Javascript world

Best Practices in JS

1. Logic less templates2. Dom Manipulation in Directives3. Data and logic manipulation in Services4. Code reuse5. View is a mirror of Model6. Models and Collections should cooperate

with Backend through REST Apis

Do not copy paste

In both whenever View or Controllers implement the same logic with a slight difference means you wrote a bad code, take the difference to external module or service and unify the controller to one.

Loose Coupling

Code is not a family Like one of my mentors said, Classes or Objects should not be connected with each other, they should communicate through Facades or Loaders, so you can kill any at any point and replace and nothing will break.

Do not Hack CSS in JS

We are all lazy, css is boring, sometimes its not possible to solve an issue fast in CSS, but better spend the whole day and implement a solution in CSS than hack it in JS, at the end of the day css does not have runtime errors, JS has, and this is a BUG for us !

Do not show you are the smartest !

This is an irony, some developers want to write overcomplicated code and show that their mind is Brilliant, well that is perfect but remember about new developers who jump on Board, poor padawans they will just not be able to maintain your code, so Keep it simple!

Test Your Code

Test driven Development is one of the main aspects in Engineering and believe me if you think how you will test your code, you will remember about loose coupling, no chaining functions no complicated calls, only return statements and Promises.

Document Your code

Both in Backbone and Angular you have to document your code, in Angular it is NG-Docs, in Backbone preferably JS-docs, and document it so people jump on board do not spend days to understand 5 lines of code, this saves time, money and health on much more pleasant tasks !

USE CSS precompilers

Well this was a light for me, write logic in CSS and compile it, no need to prefix stuff, classes and mixins solve all your problems, so Precompilers want you, use them !

USE Git

Some people thing GIT is overwhelming, well its not, believe me if you live in a place where electricity is switched off every hour, you would like to Keep in it Git, or if you have 20 developers working on same feature, this is pain, Git solves it !