Picking the right side for your front-end battles

Over the last few years, the focus of web development innovation has shifted towards client side development. New JavaScript frameworks are constantly crying for our attention and it has become a challenge to pick the right one that suits you.

Guust has been struggling with these choices and will share his experience with you. He'll introduce you to some of the major JavaScript frameworks (Angular2, Ember, React) for client side development and explain their pros and cons.

For sure he'll lure you to join his side!

You can find the slides with the notes on:
http://www.guustnieuwenhuis.be/presentations/picking-the-right-side-for-your-front-end-battles/

Transcript

1. Guust@Orangelark.be Guust Nieuwenhuis www.orangelark.be
   front-end battles
   Picking the right sidE
   

   View Slide

2. About me
   G u u s t N i e u w e n h u i s
   F u l l S t a c k We b D e v e l o p e r
   @ O r a n g e L a r k
   L i v i n g i n K o r t e n b e r g ( B E )
   B o o t s t r a p , J a v a S c r i p t ,
   C F M L , M u r a C M S
   

   View Slide

3. Guust@Orangelark.be Guust Nieuwenhuis www.orangelark.be
   front-end battles
   Picking the right sidE
   

   View Slide

4. View Slide

5. View Slide

6. View Slide

7. The Problem?
   The Browser’s historical limitations and incredible rate of improvement
   

   View Slide

8. The Sides
   And many more…
   

   View Slide

9. Angular 2
   • F r a m e w o r k P l a t f o r m
   • Ve r s i o n 2 j u s t r e l e a s e d
   = > a c o m p l e t e r e w r i t e
   • C o m p o n e n t - b a s e d a r c h i t e c t u r e
   • J a v a S c r i p t , Ty p e S c r i p t o r D a r t
   • B a c k e d b y G o o g l e
   

   View Slide

10. Angular 2
    Angular 1 Angular 2
    

    View Slide

11. Angular 2
    

    View Slide

12. Angular 2
    • F r a m e w o r k P l a t f o r m
    • Ve r s i o n 2 j u s t r e l e a s e d
    = > a c o m p l e t e r e w r i t e
    • C o m p o n e n t - b a s e d a r c h i t e c t u r e
    • J a v a S c r i p t , Ty p e S c r i p t o r D a r t
    • B a c k e d b y G o o g l e
    

    View Slide

13. Ember
    • C o n v e n t i o n o v e r c o n f i g u r a t i o n
    • Ve r y o p i n i o n a t e d
    • H a n d l e b a r s f o r t e m p l a t i n g
    • N i c e r e l e a s e p a t h
    • B a c k e d b y t h e c o m m u n i t y
    

    View Slide

14. Ember
    

    View Slide

15. Ember
    • C o n v e n t i o n o v e r c o n f i g u r a t i o n
    • Ve r y o p i n i o n a t e d
    • H a n d l e b a r s f o r t e m p l a t i n g
    • N i c e r e l e a s e p a t h
    • B a c k e d b y t h e c o m m u n i t y
    

    View Slide

16. Ember
    

    View Slide

17. Ember
    • C o n v e n t i o n o v e r c o n f i g u r a t i o n
    • Ve r y o p i n i o n a t e d
    • H a n d l e b a r s f o r t e m p l a t i n g
    • N i c e r e l e a s e p a t h
    • B a c k e d b y t h e c o m m u n i t y
    

    View Slide

18. React
    • O n l y t h e V i n M V C
    • C o m b i n e w i t h F l u x , B a c k b o n e o r …
    • D O M m a n i p u l a t i o n
    • C o m p o n e n t s
    • B a c k e d b y F a c e b o o k
    

    View Slide

19. React
    

    View Slide

20. React
    • O n l y t h e V i n M V C
    • C o m b i n e w i t h F l u x , B a c k b o n e o r …
    • D O M m a n i p u l a t i o n
    • C o m p o n e n t s
    • B a c k e d b y F a c e b o o k
    

    View Slide

21. How to choose?
    • F o r y o u p r o j e c t
    • B e s t f i t f o r p r o j e c t
    • P o p u l a r i t y
    • F o r y o u
    • S t y l e
    • O p p o r t u n i t i e s
    

    View Slide

22. So… Do you join My Side?
    Ember
    

    View Slide

23. Pedrillo
    • S a a S
    • F o r M u s i c O r c h e s t r a ’s
    • A l m o s t i n b e t a
    • Tr a n s i t i o n t o E m b e r
    w w w. p e d r i l l o . b e
    

    View Slide

24. Guust@Orangelark.be Guust Nieuwenhuis www.orangelark.be
    Thank you!
    Questions?
    

    View Slide