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

Modern Web Toolchain

Sponsored · SiteGround - Reliable hosting with speed, security, and support you can count on. →
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
Modern Angular Apps in 2026
Avatar for Fabian Gosebrink fabiangosebrink
0
21
Why State is the Most Important Part of Your Angular Application
Avatar for Fabian Gosebrink fabiangosebrink
0
82
Angular testing made easy with Jest and Cypress
Avatar for Fabian Gosebrink fabiangosebrink
0
130
Introducing state management into an application with NgRx
Avatar for Fabian Gosebrink fabiangosebrink
0
200
Scalable architectures in Angular with Nx
Avatar for Fabian Gosebrink fabiangosebrink
0
160
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
410
Angular Architectures with NgRx Stores & Effects
Avatar for Fabian Gosebrink fabiangosebrink
0
120

Other Decks in Technology

See All in Technology
AIと新時代を切り拓く。これからのSREとメルカリIBISの挑戦
Avatar for ktykogm 0gm
0
920
GitHub Issue Templates + Coding Agentで簡単みんなでIaC/Easy IaC for Everyone with GitHub Issue Templates + Coding Agent
Avatar for AEON aeonpeople
1
220
小さく始めるBCP ― 多プロダクト環境で始める最初の一歩
Avatar for kekke-n kekke_n
1
410
名刺メーカーDevグループ 紹介資料
Avatar for Sansan, Inc. sansan33
PRO
0
1k
Contract One Engineering Unit 紹介資料
Avatar for Sansan, Inc. sansan33
PRO
0
13k
Cosmos World Foundation Model Platform for Physical AI
Avatar for Takuya MINAGAWA takmin
0
890
Bill One急成長の舞台裏 開発組織が直面した失敗と教訓
Avatar for SansanTech sansantech
PRO
2
380
マーケットプレイス版Oracle WebCenter Content For OCI
Avatar for oracle4engineer oracle4engineer
PRO
5
1.6k
Claude_CodeでSEOを最適化する_AI_Ops_Community_Vol.2__マーケティングx_AIはここまで進化した.pdf
Avatar for 小笠原理久 riku_423
2
570
クレジットカード決済基盤を支えるSRE - 厳格な監査とSRE運用の両立 (SRE Kaigi 2026)
Avatar for capytan capytan
6
2.7k
顧客の言葉を、そのまま信じない勇気
Avatar for yamatai12 yamatai1212
1
350
フルカイテン株式会社 エンジニア向け採用資料
Avatar for FULL KAITEN fullkaiten
0
10k

Featured

See All Featured
Sam Torres - BigQuery for SEOs
Avatar for Tech SEO Connect techseoconnect
PRO
0
190
Unlocking the hidden potential of vector embeddings in international SEO
Avatar for Frank van Dijk frankvandijk
0
170
10 Git Anti Patterns You Should be Aware of
Avatar for Lemi Orhan Ergin lemiorhan
PRO
659
61k
We Have a Design System, Now What?
Avatar for Morgane Peng morganepeng
54
8k
Git: the NoSQL Database
Avatar for Brandon Keepers bkeepers
PRO
432
66k
Noah Learner - AI + Me: how we built a GSC Bulk Export data pipeline
Avatar for Tech SEO Connect techseoconnect
PRO
0
110
CSS Pre-Processors: Stylus, Less & Sass
Avatar for Bermon Painter bermonpainter
359
30k
First, design no harm
Avatar for Per Axbom axbom
PRO
2
1.1k
The Impact of AI in SEO - AI Overviews June 2024 Edition
Avatar for Aleyda Solis aleyda
5
730
GraphQLの誤解/rethinking-graphql
Avatar for sonatard sonatard
74
11k
A Tale of Four Properties
Avatar for Chris Coyier chriscoyier
162
24k
The AI Revolution Will Not Be Monopolized: How open-source beats economies of scale, even for LLMs
Avatar for Ines Montani inesmontani
PRO
3
3k

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