Comparing Javascript Frameworks

Slide 1

Slide 1 text

Choosing a JavaScript Framework Jennifer Bland

Slide 2

Slide 2 text

2 Who Am I? www.jenniferbland.com @ratracegrad www.youtube.com/c/JenniferBland [email protected] github.com/ratracegrad

Slide 3

Slide 3 text

3 answer at end of presentation Three Truths One Lie I asked Prince Charles for his autograph at a UGA football game I attended Prince Phillips birthday party at Edinburgh Castle I attended Easter mass at Windsor Castle with Queen Elizabeth I attended St Johns College Oxford University with Prince Andrew

Slide 4

Slide 4 text

Get the Code 4 github.com/ratracegrad/choosing-a-javascript-framework

Slide 5

Slide 5 text

Todo Applications 5 demo applications

Slide 6

Slide 6 text

WHAT I WILL NOT COVER and what I will

Slide 7

Slide 7 text

TERMINOLOGY 7 • MVC PaNern

Slide 8

Slide 8 text

TERMINOLOGY 8 • Framework vs Library

Slide 9

Slide 9 text

ANGULAR

Slide 10

Slide 10 text

ANGULAR 10 • IniVally released in October 2010 as AngularJS • Angular 2 was released in May 2016 • New versions are updated every 6 months (May & October) • It is a framework • Supported and maintained by Google

Slide 11

Slide 11 text

ANGULAR 11 • Use Typescript • Built in support for mobile applicaVon development

Slide 12

Slide 12 text

ANGULAR Functionality 12 • Component based architecture • Two way data binding • Dependency InjecVon • Services and DirecVves • Angular CLI

Slide 13

Slide 13 text

ANGULAR PROS 13 • Component based architecture • Unit-test friendly • Maintainability • Typescript • Plaaorm agnosVc philosophy • Google LTS • Provides complete MVC • Angular CLI

Slide 14

Slide 14 text

ANGULAR CONS 14 • Animosity in community from AngularJS to Angular • Complex • Steep learning curve • Slower DOM interacVon

Slide 15

Slide 15 text

ANGULAR USED BY 15 • Google • Forbes • weather.com • healthcare.gov • PayPal • Nike • HBO • General Motors • Sony

Slide 16

Slide 16 text

ANGULAR 16 DEMOSTRATION

Slide 17

Slide 17 text

REACT

Slide 18

Slide 18 text

REACT 18 • IniVally released in March 2013 • New versions are updated annually • It is a library • Supported and maintained by Facebook

Slide 19

Slide 19 text

REACT 19 • Provides just the V in MVC • AgnosVc to your data layer • Implements a Virtual DOM • Uses JSX

Slide 20

Slide 20 text

REACT Functionality 20 • Component based architecture • Props • State

Slide 21

Slide 21 text

REACT PROS 21 • Zero ConﬁguraVon • Virtual DOM • Components • One way data binding

Slide 22

Slide 22 text

REACT CONS 22 • Lack of tests • Have to use other products to create full applicaVon • MulVple ways of creaVng React applicaVon • Have to use React NaVve for hybrid mobile applicaVons • Poor documentaVon • No templates

Slide 23

Slide 23 text

REACT USED BY 23 • Facebook • AirBnb • Uber • NetFlix • TwiNer • Pinterest • Stripe • Walmart

Slide 24

Slide 24 text

REACT 24 DEMOSTRATION

Slide 25

Slide 25 text

VUE

Slide 26

Slide 26 text

VUE 26 • IniVally released in February 2014 • New versions are updated whenever • It is a framework • Not backed by a major company

Slide 27

Slide 27 text

VUE 27 • Provides just the V in MVC • AgnosVc to your data layer • Implements a Virtual DOM • Uses JSX

Slide 28

Slide 28 text

VUE Functionality 28 • Templates • Data-binding expressions • DirecVves

Slide 29

Slide 29 text

VUE PROS 29 • Ease of understanding and development • Small size - fast • Simple integraVon • Great documentaVon • Templates

Slide 30

Slide 30 text

VUE CONS 30 • Scaling an applicaVon • Small ecosystem • No cross-plaaorm mobile

Slide 31

Slide 31 text

VUE USED BY 31 • Alibaba • Baidu • Expedia • Nintendo • Gitlab

Slide 32

Slide 32 text

VUE 32 DEMOSTRATION

Slide 33

Slide 33 text

Conclusion

Slide 34

Slide 34 text

GUIDELINES 34 • Learning Curve • Framework vs Library • Scaling • Mobile needed? • Stability • Community support

Slide 35

Slide 35 text

35 Additional Resources www.codeprep.io www.in5days.tech www.youtube.com/c/jenniferbland

Slide 36

Slide 36 text

36 answer at end of presentation Three Truths One Lie I asked Prince Charles for his autograph at a UGA football game I attended Prince Phillips birthday party at Edinburgh Castle I attended Easter mass at Windsor Castle with Queen Elizabeth I attended St Johns College Oxford University with Prince Andrew

Slide 37

Slide 37 text

37 Who Am I? www.jenniferbland.com @ratracegrad www.youtube.com/c/JenniferBland [email protected] github.com/ratracegrad