Konzepte, Technologien und Trends der modernen Front-End Entwicklung

Konzepte, Technologien und Trends der modernen Front-End Entwicklung

Der schnelllebige Wandel im Bereich Front-End Entwicklung sowie die Menge an existierenden Teilbereichen erschweren es vor allem angehenden Front-End Entwicklern Schritt zu halten und den Überblick nicht zu verlieren. Darüber hinaus wirkt es sich nicht nur auf die Entwickler selbst, sondern auch auf diejenigen, die mit ihnen zusammenarbeiten, aus und erschwert somit die Kommunikation untereinander.

Das Thema Front-End Entwicklung hat sich bereits seit einigen Jahren als eine eigene Sparte in der Web-Entwicklung etabliert. Dabei basiert diese facettenreiche Sparte auf weit verbreiteten Technologien wie HTML, CSS oder JavaScript, welche ebenfalls ihre eigene Weiterentwicklung erfahren. Hinzu kommen grundlegende Konzepte und ein sich in immer kürzer werdenden Abständen verändernder Technologie-Stack.

Um Unklarheiten zu beseitigen und entstehender Verwirrung entgegenzuwirken wird in diesem Vortrag ein gemeinsames Verständnis der vielfältigen Aktionsbereiche eines Front-End Entwicklers als Grundlage geschaffen. Darauf aufbauend werden besonders wichtige Bereiche im Rahmen des Vortrags so weit wie möglich vertieft.

--
Die Präsentation wurde im Rahmen der cosee TechTalks gehalten. Die Videoaufzeichnung sowie alle weiteren Talks, findest du auf https://talks.cosee.biz/

Ba2bca2786990966e913649efc0026cd?s=128

Thomas Wedler

March 29, 2018
Tweet

Transcript

  1. Konzepte, Technologien und Trends der modernen Front-End Entwicklung Thomas Wedler

    | cosee thomas.wedler@cosee.biz
  2. None
  3. 1. Definition
 2. Konzepte
 3. Basics
 4. Tools

  4. http://www.homerswebpage.com/

  5. https://rightmessage.com/

  6. None
  7. None
  8. „A Front End Developer is Aware“ by Chris Coyier from

    CSS-Tricks https://css-tricks.com/front-end-developer-aware/
  9. „A front end developer is aware of design.“ https://css-tricks.com/front-end-developer-aware/

  10. „A front end developer is aware of the back end.“

    https://css-tricks.com/front-end-developer-aware/
  11. „A front end developer is aware of the network.“ https://css-tricks.com/front-end-developer-aware/

  12. „A front end developer is aware of performance.“ https://css-tricks.com/front-end-developer-aware/

  13. „A front end developer is aware of content strategy.“ https://css-tricks.com/front-end-developer-aware/

  14. „A front end developer is aware of databases.“ https://css-tricks.com/front-end-developer-aware/

  15. „A front end developer is aware of testing.“ https://css-tricks.com/front-end-developer-aware/

  16. „A front end developer is aware of systems.“ https://css-tricks.com/front-end-developer-aware/

  17. „A front end developer is aware of devops.“ https://css-tricks.com/front-end-developer-aware/

  18. „A front end developer is aware of servers.“ https://css-tricks.com/front-end-developer-aware/

  19. „A front end developer is aware of accessibility.“ https://css-tricks.com/front-end-developer-aware/

  20. „A front end developer is aware of the device landscape.“

    https://css-tricks.com/front-end-developer-aware/
  21. Responsive Web Design

  22. https://en.wikipedia.org/wiki/Responsive_web_design

  23. Usability

  24. https://www.nngroup.com/articles/zigzag-page-layout/

  25. Accessibility (a11y)

  26. https://theblog.adobe.com/user-experiences-kat-holmes-transforms-businesses-inclusive-design/

  27. https://foundation.zurb.com/sites/docs/close-button.html

  28. Progressive Enhancement vs. Graceful Degradation

  29. None
  30. None
  31. None
  32. None
  33. None
  34. None
  35. None
  36. None
  37. None
  38. None
  39. None
  40. None
  41. None
  42. None
  43. None
  44. None
  45. None
  46. None
  47. JavaScript Frameworks Angular React Vue.js Typescript Redux Vuex

  48. None
  49. None
  50. None
  51. https://medium.com/javascript-scene/top-javascript-libraries-tech-to-learn-in-2018-c38028e028e6

  52. https://medium.com/javascript-scene/top-javascript-libraries-tech-to-learn-in-2018-c38028e028e6

  53. Bootstrap Foundation Semantic UI CSS Frameworks

  54. CSS Preprocessors

  55. Testing

  56. ESLint Asset Pipeline

  57. None
  58. Über den Tellerrand schauen Basics verbessern Trends verfolgen

  59. Nützliche Links • Front-End Developer Handbook 2018
 https://github.com/FrontendMasters/front-end-handbook-2018 • Web

    Developer Roadmap 2018
 https://github.com/kamranahmedse/developer-roadmap • The Front-End Checklist
 https://frontendchecklist.io/ • Front-End Performance Checklist 2018
 https://www.smashingmagazine.com/2018/01/front-end-performance- checklist-2018-pdf-pages/
  60. Nächster Talk … Kubernetes - Mehr als eine Spielwiese für

    DevOps Nerds <Jannis Schäfer/> April 2018 > blog.cosee.biz > talks.cosee.biz @coseeaner #coseetechtalks