Code Generation with TypeScript

Code Generation with TypeScript

• 1.
  Code Generation with TypeScript 1
• 2.
  Hello, 2 I am Benny. TypeScriptenthusiast and creator of vote4code.com You can follow me on Twitter @bennycode
• 3.
  Berlin.JS! 3 I am Florian. TypeScriptenthusiast and creator of sortjson.com You can follow me on GitHub @ffflorian
• 4.
  4
• 5.
  5 Frontend Backend
• 6.
  6 https://petstore.swagger.io/
• 7.
  7 Generated with Swaxios
• 8.
  8 Code Generation A mechanismto produce [ … ] computer programs [ … ] in some automatic manner.“ wikipedia.org
• 9.
  9 Iteration I
• 10.
  10 Iteration I Trainee Requiresonboarding Requires reviews Requires park walks Doesn’t check syntax
• 11.
  11 Iteration II
• 12.
  12 Iteration II Handlebars Requiresdependency Requires helpers Requires IDE plugin Doesn’t check syntax
• 13.
  13 Iteration III
• 14.
  14 Compiler API Ships withTypeScript Uses AST format Checks syntax Generates valid output
• 15.
  15 Architectural Overview https://github.com/microsoft/TypeScript/wiki/Architectural-Overview
• 16.
  Compiler Phases Code Token Stream 16 Scanner Parser AST https://basarat.gitbook.io/typescript/overview/scanner
• 17.
  17 https://ts-ast-viewer.com/
• 18.
  Code Generation Nodes (AST) A programis basically a sequence of statements. All expressions and statements can be represented as nodes and subtrees. Printer Prints a node and its subtree as-is, without any emit transformations. The result is a stringified version of the source code. Source File A destination file that provides context for the node. Can be written with a wrapper method like ts.sys.write File. 18
• 19.
  19
• 20.
  Thanks! Any questions? Create anissue in our demo repository. 20