Tools
vs
Frameworks

- Differences / Advantages

- Limitations
- What you can learn from using them

DISCLAIMER

- Every project has its own aim and reason

- These are my own observations

- The aim of this pres. is just to learn from it

Jaume TLL

JS dev - Riffstation (Fender)

(mostly front-end)

bichotll

- 8 years working on the web

- no university studies

- PHP-JS "full-stack" -> JS front-end

my experience with:

Organization

paper/csv

⇩

SCRUM

⇩

Jira

⇩

Trello

⇩

⇩

my experience with:

PHP

plain PHP

⇩

Wordpress

⇩

CodeIgniter

⇩

Symfony2

...

I gave up

⇩

my experience with:

Javascript

global/simple

⇩

AngularJS

⇩

Phonegap

⇩

BackboneJS

⇩

⇩

⇩

React

⇩

Phonegap

⇩

Ember

⇩

React/Flux

Observations

Basic / Global

csv / paper

plain code

- Too simple

- I want/need more

- Security

- No order / standard

- Gets stuck / Has a limit

- Bad control of dependencies

- Testing

PROS

CONS

- So straight forward

- It works for basic stuff

Frameworks

"Jira"

Symfony2

- Can be harshly opinionated

- Limited dynamism

- Your project depends on it

- Need to learn/study it

- May be heavy (too many tools)

- You need to follow the "gang"

- Can be targeted by hackers

- You need reliable plugins/addons...

PROS

CONS

- Community

- Offer good resources

- Structured

- Follow standards

- Have a path to follow

- Work for overall projects

- Security (if up to date)

- Testing help/boilerplate

AngularJS

Ember

WordPress

Phonegap

...

Tools / Modules

"Trello"

React / Riot / Vue / Polymer

- You need experience

- Freedom can become anarchy

- It can be insecure

PROS

CONS

- Modular

- Dynamic

- Infinity resources

- Freedom

Real Front-end
examples

Ember

Modules and tools

View system

State managment

Handlebars / Glimmer

React, Preact, Mustache, Riot, Vue, Polymer, Moon...

Scaffolding

Ember Data, Service, Observables, "Flux"

Flux (Redux, Reflux, MobX) RxJS, Observables, Service

Task management

Yeoman, Many others...

Ember cli

Ember cli (Broccoli)

Grunt, Gulp, Browserify, Webpack...

Testing

(or Angular...)

Ember (Qunit)

Tape, Mocha, Jasmine...

Others

Mostly ember + addons

Others...

Play.riffstation.com
(Ember app)

- Updates make tests fail

- API does not use 100% REST protocol:
We had to adapt Ember Data or implement observable services

- I "can not" use Flux: No official implementation. Not much info... Everyone uses Ember Data.

- I "can not" use Mocha: No official implementation. Simple unit testing is too simple.

- I don't have hot loading: Slow development

- No canvas components - There is in react and other libs

- Big hassle to port the code to any other solution because of Ember's standards

...

⇩

...

⇩

We (company) started to work with React

...

⇩

The Front-end
JS world
and its numbers

- jQuery is the most used

- AngularJS still used but going down
- React going up and up
- Vue taking over Ember

JS survey

stateofjs.com
2016

Usage

similartech.com
~Aug 2017

Conclusion

Start basic

- Feel the hunger/need for something else
- Make a mess

Use/observe frameworks

- Enjoy them

- Learn from them

- Feel their limitations

Use modules

- Be dynamic

- Be/Feel secure (Important!)

- Be organized

Usage in a timeline

Start basic

Use / observe
frameworks

Use tools /modules

Me and my
modules

Never forget

- Read (blogs, books, podcasts...)

- Try / Share

- Testing

- Keep yourself up to date

- Don't get stuck

- Be organized