Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Modern Web Toolchain

Avatar for Fabian Gosebrink Fabian Gosebrink
October 22, 2017
Technology
0
90

Modern Web Toolchain

Slides for my talk about the modern web toolchain

Avatar for Fabian Gosebrink

Fabian Gosebrink

October 22, 2017
Tweet

More Decks by Fabian Gosebrink

See All by Fabian Gosebrink
Why State is the Most Important Part of Your Angular Application
Avatar for Fabian Gosebrink fabiangosebrink
0
74
Angular testing made easy with Jest and Cypress
Avatar for Fabian Gosebrink fabiangosebrink
0
120
Introducing state management into an application with NgRx
Avatar for Fabian Gosebrink fabiangosebrink
0
180
Scalable architectures in Angular with Nx
Avatar for Fabian Gosebrink fabiangosebrink
0
150
My Biggest Angular Mistakes and How To Avoid Them
Avatar for Fabian Gosebrink fabiangosebrink
0
260
[iJS Munich] Better Angular Architectures with Libraries and Nx
Avatar for Fabian Gosebrink fabiangosebrink
0
160
Mastering State Management in Angular with the NgRx Signal Store
Avatar for Fabian Gosebrink fabiangosebrink
0
400
Angular Architectures with NgRx Stores & Effects
Avatar for Fabian Gosebrink fabiangosebrink
0
120
Angular Testing made easy with Jest and Cypress
Avatar for Fabian Gosebrink fabiangosebrink
0
120

Other Decks in Technology

See All in Technology
Snowflake Industry Days 2025 Nowcast
Avatar for tak takumimukaiyama
0
130
20251222_サンフランシスコサバイバル術
Avatar for ponponmikan ponponmikankan
2
140
NIKKEI Tech Talk #41: セキュア・バイ・デザインからクラウド管理を考える
Avatar for Ryosuke Sekido sekido
PRO
0
230
TED_modeki_共創ラボ_20251203.pdf
Avatar for AIxIoTビジネス共創ラボ iotcomjpadmin
0
150
AWSインフルエンサーへの道 / load of AWS Influencer
Avatar for WHIsaiyo whisaiyo
0
230
2025-12-27 Claude CodeでPRレビュー対応を効率化する@機械学習社会実装勉強会第54回
Avatar for Naka Masato nakamasato
4
1.2k
AI駆動開発ライフサイクル（AI-DLC）の始め方
Avatar for ryansbcho79 ryansbcho79
0
200
2025年のデザインシステムとAI 活用を振り返る
Avatar for Tech Leverages leveragestech
0
360
20251218_AIを活用した開発生産性向上の全社的な取り組みの進め方について / How to proceed with company-wide initiatives to improve development productivity using AI
Avatar for yayoi_dd yayoi_dd
0
730
Strands AgentsとNova 2 SonicでS2Sを実践してみた
Avatar for Yuuki Yamashita yama3133
1
2k
Microsoft Agent Frameworkの可観測性
Avatar for tomokusaba tomokusaba
1
120
「もしもデータ基盤開発で『強くてニューゲーム』ができたなら今の僕はどんなデータ基盤を作っただろう」
Avatar for AEON aeonpeople
0
250

Featured

See All Featured
Paper Plane (Part 1)
Avatar for Katie Cordina Lindsey katiecoart
PRO
0
2.2k
Test your architecture with Archunit
Avatar for Yoan thirion
1
2.1k
The browser strikes back
Avatar for Jono Alderson jonoalderson
0
220
Mind Mapping
Avatar for Hélio Medeiros helmedeiros
PRO
0
40
Getting science done with accelerated Python computing platforms
Avatar for Jacob Tomlinson jacobtomlinson
0
79
Lightning Talk: Beautiful Slides for Beginners
Avatar for Ines Montani inesmontani
PRO
1
410
AI: The stuff that nobody shows you
Avatar for John Nunemaker jnunemaker
PRO
1
29
Lessons Learnt from Crawling 1000+ Websites
Avatar for Charles Meaden charlesmeaden
PRO
0
970
Building AI with AI
Avatar for Ines Montani inesmontani
PRO
1
580
Music & Morning Musume
Avatar for Bryan Veloso bryan
46
7k
Leveraging LLMs for student feedback in introductory data science courses - posit::conf(2025)
Avatar for Mine Cetinkaya-Rundel minecr
0
93
The Impact of AI in SEO - AI Overviews June 2024 Edition
Avatar for Aleyda Solis aleyda
5
680

Transcript

  1. The modern web toolchain @FabianGosebrink

  2. Fabian Gosebrink

  3. @FabianGosebrink

  4. None

  5. The modern web toolchain

  6. None
  7. None
  8. None
  9. None
  10. None
  11. None
  12. None
  13. None
  14. None
  15. None
  16. None
  17. None
  18. None

  19. > npm install rimraf -g

  20. > npm install rimraf

  21. None
  22. None
  23. None
  24. None

  25. > yarn add ...

  26. None
  27. None
  28. None
  29. None
  30. None
  31. None
  32. None
  33. None
  34. None

  35. ES5 ES6 TS

  36. > npm install typescript

  37. > tsc myTypescriptFile.ts

  38. None
  39. None
  40. None
  41. None

  42. Root Child Child GrandChild GrandChild

  43. None
  44. None

  45. SystemJS

  46. None
  47. None

  48. // import the entire utils object with CommonJS var utils

    = require('utils ); var query = 'test'; utils.ajax('https://api.example.com?search=' + query) .then(handleResponse);

  49. // import the ajax function with an ES6 import statement

    import { ajax } from 'utils'; var query = 'test ; // call the ajax function ajax('https://api.example.com?search=' + query ) .then(handleResponse);
  50. None
  51. None
  52. None
  53. None

  54. > npm install webpack-dev-server --save-dev

  55. None

  56. Ahead-of-time (AOT) vs. just-in-time (JIT)

  57. None
  58. None
  59. None
  60. None
  61. None

  62. Testing

  63. Protractor Jasmine Karma

  64. J asmine Behaviour Driven Development Fast

  65. Karma Test runner Spawns browser & runs tests Also on

    CommandLine
  66. None
  67. None

  68. Pr otr actor End-to-end test framework Runs in a real

    browser Test like a user
  69. None
  70. None
  71. None

  72. How do you keep up 2 date?

  73. None

  74. Conferences!

  75. None
  76. None

  77. https://github.com/FabianGosebrink https://offering.solutions https://swissangular.com @FabianGosebrink