Luźne spojrzenie na to jak obecnie wygląda rozpędzony świat front-endu oraz propozycje rozwiązań problemów bycia z nim na bieżąco.

1. Jak nadążyć za
światem front-endu?
Tomasz Dziuda
infoMEET Kraków - 25.02.2017

2. Źródło: https://medium.com/@ericclemmons/javascript-fatigue-48d4011b6fc4

3. Źródło: https://hackernoon.com/how-it-feels-to-learn-javascript-in-2016-d3a717dd577f

4. Źródło: http://www.2ality.com/2016/02/js-fatigue-fatigue.html

5. Przyczyna problemu

6. HTML

7. HTML
CSS JavaScript

8. HTML
CSS JavaScript
AJAX
SEO Microdata

9. HTML
CSS JavaScript
AJAX
SEO Microdata
SASS
Workflow
Automation
Tools
RWD

10. HTML
CSS JavaScript
AJAX
SEO Microdata
SASS
Workflow
Automation
Tools
RWD
Accessibility
Motion DesignSPA
Progressive
Enhancement
Performance
WebComponents NPMJSX
REST

11. HTML
CSS JavaScript
AJAX
SEO Microdata
SASS
Workflow
Automation
Tools
RWD
Accessibility
Motion DesignSPA
Progressive
Enhancement
Performance
WebComponents NPMJSX
Houdini
TypeScript
Web WorkersService Workers
CSSX
NativeScript
Offline-first
REST

12. "In programming, there is often an obsession with
using the latest and greatest technology.
Programmers view the use of edge technology as
its own badge of honor, and are quick to throw
away legacy applications."
Źródło: https://signalvnoise.com/posts/3933-a-love-for-legacy
https://tommcfarlin.com/latest-and-greatest-technology/

13. Źródło: http://blog.bitovi.com/longevity-or-lack-thereof-in-javascript-frameworks/

14. Ironia losu
ES2015 wprowadziło klasy do JavaScript,
więc nadeszła moda na...
programowanie funkcyjne ;-)

15. Ironia losu
ES2015 wprowadziło klasy do JavaScript,
więc nadeszła moda na...
programowanie funkcyjne ;-)

16. Rozwiązania problemu

17. 2009: jQuery === JavaScript

18. 2009: jQuery === JavaScript
2013: AngularJS === JavaScript

19. 2009: jQuery === JavaScript
2013: AngularJS === JavaScript
2016: React === JavaScript

20. Źródło: http://vanilla-js.com/
Najmniejszy i najwydajniejszy framework

21. Nie sztuką jest nauczyć się podstaw
10 frameworków
Sztuką jest umieć odtworzyć na swój
sposób ich główne idee działania

22. Nie sztuką jest nauczyć się podstaw
10 frameworków
Sztuką jest umieć odtworzyć na swój
sposób ich główne idee działania

23. two-way data-binding
currying
closures
Temporal Dead Zone
Virtual DOM
hoisting
promises
AJAX
JSON
JSON-P
Regular Expressions
prototypes
inheritance
partial application
module pattern
progressive enhancement
localStorage
functional programming
chaining
callback
dirty checking
Web Components

24. Prowadzenie bloga

25. Źródło: https://github.com

33. Niech ktoś przefiltruje to za mnie!

34. Źródło: http://javascriptweekly.com/

35. Źródło: http://javascriptweekly.com/
Źródło: http://webtoolsweekly.com/

36. Źródło: http://react.statuscode.com/

37. Źródło: http://esnextnews.com/

38. Źródło: http://dailyui.co/

39. Źródło: https://www.apichangelog.com/

40. Źródło: https://www.apichangelog.com/
Zbiór ciekawych newsletterów:
http://codecondo.com/weekly-newsletters-front-end-developers/

41. Zarządzanie dużą liczbą newsletterów

42. Potencjalnie
ważne
Potencjalne
odpady
Zarządzanie dużą liczbą newsletterów

43. Potencjalnie
ważne
Oznacz jako przeczytane
Potencjalne
odpady
Zarządzanie dużą liczbą newsletterów

44. Potencjalnie
ważne
Oznacz jako przeczytane
Potencjalne
odpady
Sprawdzane raz
na 3 dni
Sprawdzane raz
na tydzień
Zarządzanie dużą liczbą newsletterów

45. Źródło: https://getpocket.com/

46. Źródło: https://getpocket.com/
999+

47. Prawdopodobnie nigdy nie wykorzystamy 90% *
rozwiązań o których czytamy...
... ale warto wiedzieć, że są i jakie problemy
rozwiązują.
* wartość z kapelusza podana jedynie w celu lepszego zapamiętania, że chodzi o zdecydowaną większość ;-)

48. Prawdopodobnie nigdy nie wykorzystamy 90% *
rozwiązań o których czytamy...
... ale warto wiedzieć, że istnieją i jakie problemy
rozwiązują.
* wartość z kapelusza podana jedynie w celu lepszego zapamiętania, że chodzi o zdecydowaną większość ;-)

49. Środki przymusu
bezpośredniego

50. Źródło: http://dziudek.github.io/wp-links/
Źródło: http://dziudek.github.io/dev-links/

51. Źródło: https://www.enki.com/

52. Źródło: http://www.codewars.com/

53. Źródło: http://rosalind.info/

54. Źródło: http://es6katas.org/

55. Źródło: http://codepen.io/

56. Źródło: http://sideprojects.in/

58. Dlaczego projekt poboczny
warto napisać w Electronie?
( http://electron.atom.io/ )

59. Wsparcie dla najnowszych standardów
Źródło: http://jlord.us/essential-electron/

60. Wsparcie dla najnowszych standardów
Źródło: https://kangax.github.io/compat-table/es6/

61. Aplikacje w Electronie to głównie SPA

62. Dostęp do systemowych API daje ciekawe możliwości
Źródło: https://getkap.co/

63. Podważaj swoją wiedzę

64. Źródło: http://caniuse.com/

65. Źródło: https://www.chromestatus.com/features

66. Źródło: https://dev.modern.ie/platform/status/

67. Źródło: https://platform-status.mozilla.org/

68. Źródło: https://webkit.org/status/

69. Historia wersji przeglądarek:
https://upload.wikimedia.org/wikipedia/commons/7/74/Timeline_of_web_browsers.svg
6 tygodni
~6 tygodni
evergreen

70. Nie bój się ludzi

72. Efekt Krugera-Dunninga
Pewnośćsiebie
Wiedza

74. Polecam: http://www.slideshare.net/ferrantes/the-human-element-47816358

75. Podsumowanie

76. Zachowaj zdrowy rozsądek

77. Opanuj dobrze podstawy Vanilla JS

78. Analizuj rozwiązania zastosowane w narzędziach
których używasz

79. Zdobywaj i podważaj swoją wiedzę regularnie

80. Dziel się zdobytą wiedzą z innymi

81. Nowe technologie testuj w projektach pobocznych

82. Pytania?

83. tomasz@dziuda.com
@dziudek
http://dziudek.pl
http://www.slideshare.net/dziudek
Tomasz Dziuda