Set up i8n for playground samples

Orta Therox (orta) · Jan 6, 2020 · Dec 26, 2019 · Dec 26, 2019 · Dec 26, 2019 · Dec 26, 2019
commit f82cfc557c0a65de7500d990c1ca664d6430690d
diff --git a/packages/playground-examples/README.md b/packages/playground-examples/README.md
@@ -2,14 +2,51 @@
 
 The English examples can be found in [`en/`](en/).
 
+# TypeScript Example Code
+
+These samples are built for hyperlinking between each-other
+in a sandboxed environment like the TypeScript Playground.
+
+Each example aims to cover one or two specific features to
+either how JavaScript works in TypeScript, or features which
+TypeScript has added to the language.
+
+An example should make assumptions that the reader is in a
+monaco/IDE-like environment which has a TSServer running for
+to provide extra analysis. As well as a minor fluency in
+JavaScript.
+
+These examples are not set in stone, and we're open to new
+ideas. If you'd like to help out and speak more than one
+language, we'd love to see translations.
+
+## Adding a new example section
+
+Create a folder in the english section of the [`copy`](./copy) folder,
+then add sub-folders per section which you'd want to have as headers
+with 3-5 examples.
+
+## Adding a localization
+
+All localizations live inside the `copy` folder:
+
+- There must be a `sections.json` in the root of each language
+- A language is created by copying over an english example with the same path, and then translating it
+- Any examples not copied over fall back to the english version
+- You can change the name of an example for your language by having `//// { title: 'c0d3 fl0w', ... }` in the first line of the example
+
+Languages are compiled to TOC JSON files in [`generated`](./generated), one per lanaguge.
+
 # Deployment
 
 There is a table of contents JSON file which contains
 all the useful metadata about the hierarchy and sort
-order for the docs. 
+order for the docs.
 
 It's likely that we'll need to create this per translation
 in the future, but for now the table of contents will
 default to english.
 
-The script is in [`scripts/generateTOC.js`](scripts/generateTOC.js).
+The script is in [`scripts/generateTOC.js`](scripts/generateTOC.js), with  
+\output of the build process is then copied into the `typescriptlang-org`
+module under `static/js/examples` in [`scripts/copyFiles.js`](scripts/copyFiles.js).
diff --git a/...ples/en/3-7/Fixits/Big number literals.ts → ...copy/en/3-7/Fixits/Big number literals.ts b/...ples/en/3-7/Fixits/Big number literals.ts → ...copy/en/3-7/Fixits/Big number literals.ts
diff --git a/...nd-examples/en/3-7/Fixits/Const to let.ts → ...amples/copy/en/3-7/Fixits/Const to let.ts b/...nd-examples/en/3-7/Fixits/Const to let.ts → ...amples/copy/en/3-7/Fixits/Const to let.ts
diff --git a/...en/3-7/Fixits/Infer From Usage Changes.ts → ...en/3-7/Fixits/Infer From Usage Changes.ts b/...en/3-7/Fixits/Infer From Usage Changes.ts → ...en/3-7/Fixits/Infer From Usage Changes.ts
diff --git a/...nd Messaging/Flattened Error Reporting.ts → ...nd Messaging/Flattened Error Reporting.ts b/...nd Messaging/Flattened Error Reporting.ts → ...nd Messaging/Flattened Error Reporting.ts
diff --git a/...yntax and Messaging/Nullish Coalescing.ts → ...yntax and Messaging/Nullish Coalescing.ts b/...yntax and Messaging/Nullish Coalescing.ts → ...yntax and Messaging/Nullish Coalescing.ts
diff --git a/...Syntax and Messaging/Optional Chaining.ts → ...Syntax and Messaging/Optional Chaining.ts b/...Syntax and Messaging/Optional Chaining.ts → ...Syntax and Messaging/Optional Chaining.ts
diff --git a/...ypes and Code Flow/Assertion Functions.ts → ...ypes and Code Flow/Assertion Functions.ts b/...ypes and Code Flow/Assertion Functions.ts → ...ypes and Code Flow/Assertion Functions.ts
diff --git a/...nd Code Flow/Recursive Type References.ts → ...nd Code Flow/Recursive Type References.ts b/...nd Code Flow/Recursive Type References.ts → ...nd Code Flow/Recursive Type References.ts
diff --git a/...and Code Flow/Uncalled Function Checks.ts → ...and Code Flow/Uncalled Function Checks.ts b/...and Code Flow/Uncalled Function Checks.ts → ...and Code Flow/Uncalled Function Checks.ts
diff --git a/...ipt/External APIs/TypeScript with Deno.ts → ...ipt/External APIs/TypeScript with Deno.ts b/...ipt/External APIs/TypeScript with Deno.ts → ...ipt/External APIs/TypeScript with Deno.ts
diff --git a/...ipt/External APIs/TypeScript with Node.js → ...ipt/External APIs/TypeScript with Node.js b/...ipt/External APIs/TypeScript with Node.js → ...ipt/External APIs/TypeScript with Node.js
diff --git a/...t/External APIs/TypeScript with React.tsx → ...t/External APIs/TypeScript with React.tsx b/...t/External APIs/TypeScript with React.tsx → ...t/External APIs/TypeScript with React.tsx
diff --git a/...ript/External APIs/TypeScript with Web.js → ...ript/External APIs/TypeScript with Web.js b/...ript/External APIs/TypeScript with Web.js → ...ript/External APIs/TypeScript with Web.js
diff --git a/...pt/External APIs/TypeScript with WebGL.js → ...pt/External APIs/TypeScript with WebGL.js b/...pt/External APIs/TypeScript with WebGL.js → ...pt/External APIs/TypeScript with WebGL.js
diff --git a/...ions with JavaScript/Function Chaining.ts → ...ions with JavaScript/Function Chaining.ts b/...ions with JavaScript/Function Chaining.ts → ...ions with JavaScript/Function Chaining.ts
diff --git a/...ions with JavaScript/Generic Functions.ts → ...ions with JavaScript/Generic Functions.ts b/...ions with JavaScript/Generic Functions.ts → ...ions with JavaScript/Generic Functions.ts
diff --git a/...tions with JavaScript/Typing Functions.ts → ...tions with JavaScript/Typing Functions.ts b/...tions with JavaScript/Typing Functions.ts → ...tions with JavaScript/Typing Functions.ts
diff --git a/...aScript/Helping with JavaScript/Errors.ts → ...aScript/Helping with JavaScript/Errors.ts b/...aScript/Helping with JavaScript/Errors.ts → ...aScript/Helping with JavaScript/Errors.ts
diff --git a/...pt/Helping with JavaScript/Quick Fixes.ts → ...pt/Helping with JavaScript/Quick Fixes.ts b/...pt/Helping with JavaScript/Quick Fixes.ts → ...pt/Helping with JavaScript/Quick Fixes.ts
diff --git a/...Script/JavaScript Essentials/Code Flow.ts → ...Script/JavaScript Essentials/Code Flow.ts b/...Script/JavaScript Essentials/Code Flow.ts → ...Script/JavaScript Essentials/Code Flow.ts
diff --git a/...Script/JavaScript Essentials/Functions.ts → ...Script/JavaScript Essentials/Functions.ts b/...Script/JavaScript Essentials/Functions.ts → ...Script/JavaScript Essentials/Functions.ts
diff --git a/...ript/JavaScript Essentials/Hello World.ts → ...ript/JavaScript Essentials/Hello World.ts b/...ript/JavaScript Essentials/Hello World.ts → ...ript/JavaScript Essentials/Hello World.ts
diff --git a/...vaScript Essentials/Objects and Arrays.ts → ...vaScript Essentials/Objects and Arrays.ts b/...vaScript Essentials/Objects and Arrays.ts → ...vaScript Essentials/Objects and Arrays.ts
diff --git a/...vaScript/Modern JavaScript/Async Await.ts → ...vaScript/Modern JavaScript/Async Await.ts b/...vaScript/Modern JavaScript/Async Await.ts → ...vaScript/Modern JavaScript/Async Await.ts
diff --git a/...aScript/Modern JavaScript/Immutability.ts → ...aScript/Modern JavaScript/Immutability.ts b/...aScript/Modern JavaScript/Immutability.ts → ...aScript/Modern JavaScript/Immutability.ts
diff --git a/...Script/Modern JavaScript/Import Export.ts → ...Script/Modern JavaScript/Import Export.ts b/...Script/Modern JavaScript/Import Export.ts → ...Script/Modern JavaScript/Import Export.ts
diff --git a/...Script/Modern JavaScript/JSDoc Support.js → ...Script/Modern JavaScript/JSDoc Support.js b/...Script/Modern JavaScript/JSDoc Support.js → ...Script/Modern JavaScript/JSDoc Support.js
diff --git a/...ayground-examples/en/JavaScript/README.md → ...und-examples/copy/en/JavaScript/README.md b/...ayground-examples/en/JavaScript/README.md → ...und-examples/copy/en/JavaScript/README.md
diff --git a/...cript/Working With Classes/Classes 101.ts → ...cript/Working With Classes/Classes 101.ts b/...cript/Working With Classes/Classes 101.ts → ...cript/Working With Classes/Classes 101.ts
diff --git a/...t/Working With Classes/Generic Classes.ts → ...t/Working With Classes/Generic Classes.ts b/...t/Working With Classes/Generic Classes.ts → ...t/Working With Classes/Generic Classes.ts
diff --git a/...JavaScript/Working With Classes/Mixins.ts → ...JavaScript/Working With Classes/Mixins.ts b/...JavaScript/Working With Classes/Mixins.ts → ...JavaScript/Working With Classes/Mixins.ts
diff --git a/...n/JavaScript/Working With Classes/This.ts → ...n/JavaScript/Working With Classes/This.ts b/...n/JavaScript/Working With Classes/This.ts → ...n/JavaScript/Working With Classes/This.ts
diff --git a/...ayground/Config/JavaScript Playgrounds.js → ...ayground/Config/JavaScript Playgrounds.js b/...ayground/Config/JavaScript Playgrounds.js → ...ayground/Config/JavaScript Playgrounds.js
diff --git a/...layground/Config/New Compiler Defaults.ts → ...layground/Config/New Compiler Defaults.ts b/...layground/Config/New Compiler Defaults.ts → ...layground/Config/New Compiler Defaults.ts
diff --git a/...nd/Language/Automatic Type Acquisition.ts → ...nd/Language/Automatic Type Acquisition.ts b/...nd/Language/Automatic Type Acquisition.ts → ...nd/Language/Automatic Type Acquisition.ts
diff --git a/...examples/en/Playground/Language/Fixits.ts → ...les/copy/en/Playground/Language/Fixits.ts b/...examples/en/Playground/Language/Fixits.ts → ...les/copy/en/Playground/Language/Fixits.ts
diff --git a/...s/en/Playground/Tooling/Mobile Support.ts → ...y/en/Playground/Tooling/Mobile Support.ts b/...s/en/Playground/Tooling/Mobile Support.ts → ...y/en/Playground/Tooling/Mobile Support.ts
diff --git a/...es/en/Playground/Tooling/Sharable URLs.ts → ...py/en/Playground/Tooling/Sharable URLs.ts b/...es/en/Playground/Tooling/Sharable URLs.ts → ...py/en/Playground/Tooling/Sharable URLs.ts
diff --git a/...Playground/Tooling/TypeScript Versions.ts → ...Playground/Tooling/TypeScript Versions.ts b/...Playground/Tooling/TypeScript Versions.ts → ...Playground/Tooling/TypeScript Versions.ts
diff --git a/...n/TypeScript/Language Extensions/Enums.ts → ...n/TypeScript/Language Extensions/Enums.ts b/...n/TypeScript/Language Extensions/Enums.ts → ...n/TypeScript/Language Extensions/Enums.ts
diff --git a/...ipt/Language Extensions/Nominal Typing.ts → ...ipt/Language Extensions/Nominal Typing.ts b/...ipt/Language Extensions/Nominal Typing.ts → ...ipt/Language Extensions/Nominal Typing.ts
diff --git a/...anguage Extensions/Types vs Interfaces.ts → ...anguage Extensions/Types vs Interfaces.ts b/...anguage Extensions/Types vs Interfaces.ts → ...anguage Extensions/Types vs Interfaces.ts
diff --git a/...mples/en/TypeScript/Language/Soundness.ts → .../copy/en/TypeScript/Language/Soundness.ts b/...mples/en/TypeScript/Language/Soundness.ts → .../copy/en/TypeScript/Language/Soundness.ts
diff --git a/.../TypeScript/Language/Structural Typing.ts → .../TypeScript/Language/Structural Typing.ts b/.../TypeScript/Language/Structural Typing.ts → .../TypeScript/Language/Structural Typing.ts
diff --git a/...les/en/TypeScript/Language/Type Guards.ts → ...opy/en/TypeScript/Language/Type Guards.ts b/...les/en/TypeScript/Language/Type Guards.ts → ...opy/en/TypeScript/Language/Type Guards.ts
diff --git a/...t/Language/Type Widening and Narrowing.ts → ...t/Language/Type Widening and Narrowing.ts b/...t/Language/Type Widening and Narrowing.ts → ...t/Language/Type Widening and Narrowing.ts
diff --git a/...ypeScript/Meta-Types/Conditional Types.ts → ...ypeScript/Meta-Types/Conditional Types.ts b/...ypeScript/Meta-Types/Conditional Types.ts → ...ypeScript/Meta-Types/Conditional Types.ts
diff --git a/...peScript/Meta-Types/Discriminate Types.ts → ...peScript/Meta-Types/Discriminate Types.ts b/...peScript/Meta-Types/Discriminate Types.ts → ...peScript/Meta-Types/Discriminate Types.ts
diff --git a/...en/TypeScript/Meta-Types/Indexed Types.ts → ...en/TypeScript/Meta-Types/Indexed Types.ts b/...en/TypeScript/Meta-Types/Indexed Types.ts → ...en/TypeScript/Meta-Types/Indexed Types.ts
diff --git a/.../en/TypeScript/Meta-Types/Mapped Types.ts → .../en/TypeScript/Meta-Types/Mapped Types.ts b/.../en/TypeScript/Meta-Types/Mapped Types.ts → .../en/TypeScript/Meta-Types/Mapped Types.ts
diff --git a/...-examples/en/TypeScript/Primitives/Any.ts → ...ples/copy/en/TypeScript/Primitives/Any.ts b/...-examples/en/TypeScript/Primitives/Any.ts → ...ples/copy/en/TypeScript/Primitives/Any.ts
diff --git a/...ples/en/TypeScript/Primitives/Literals.ts → ...copy/en/TypeScript/Primitives/Literals.ts b/...ples/en/TypeScript/Primitives/Literals.ts → ...copy/en/TypeScript/Primitives/Literals.ts
diff --git a/...rimitives/Union and Intersection Types.ts → ...rimitives/Union and Intersection Types.ts b/...rimitives/Union and Intersection Types.ts → ...rimitives/Union and Intersection Types.ts
diff --git a/...ypeScript/Primitives/Unknown and Never.ts → ...ypeScript/Primitives/Unknown and Never.ts b/...ypeScript/Primitives/Unknown and Never.ts → ...ypeScript/Primitives/Unknown and Never.ts
diff --git a/...ayground-examples/en/TypeScript/README.md → ...und-examples/copy/en/TypeScript/README.md b/...ayground-examples/en/TypeScript/README.md → ...und-examples/copy/en/TypeScript/README.md
diff --git a/...Type Primitives/Built-in Utility Types.ts → ...Type Primitives/Built-in Utility Types.ts b/...Type Primitives/Built-in Utility Types.ts → ...Type Primitives/Built-in Utility Types.ts
diff --git a/...eScript/Type Primitives/Nullable Types.ts → ...eScript/Type Primitives/Nullable Types.ts b/...eScript/Type Primitives/Nullable Types.ts → ...eScript/Type Primitives/Nullable Types.ts
diff --git a/...s/en/TypeScript/Type Primitives/Tuples.ts → ...y/en/TypeScript/Type Primitives/Tuples.ts b/...s/en/TypeScript/Type Primitives/Tuples.ts → ...y/en/TypeScript/Type Primitives/Tuples.ts
diff --git a/packages/playground-examples/copy/en/sections.json b/packages/playground-examples/copy/en/sections.json
@@ -0,0 +1,47 @@
+{
+  "sections": [
+    {
+      "name": "JavaScript",
+      "id": "JavaScript",
+      "subtitle": "See how TypeScript improves day to day working with JavaScript with minimal additional syntax."
+    },
+    {
+      "name": "TypeScript",
+      "id": "TypeScript",
+      "subtitle": "Explore how TypeScript extends JavaScript to add more safety and tooling."
+    },
+    {
+      "name": "3.7",
+      "id": "3.7",
+      "subtitle": "See the <a href='https://devblogs.microsoft.com/typescript/announcing-typescript-3-7/'>Release notes</a>."
+    },
+    {
+      "name": "Playground",
+      "id": "Playground",
+      "subtitle": "Learn what has changed in this website."
+    }
+  ],
+
+  "sortedSubSections": [
+    // JS
+    "JavaScript Essentials",
+    "Functions with JavaScript",
+    "Working With Classes",
+    "Modern JavaScript",
+    "External APIs",
+    "Helping with JavaScript",
+    // TS
+    "Primitives",
+    "Type Primitives",
+    "Meta-Types",
+    "Language",
+    "Language Extensions",
+    // Examples
+    "Syntax and Messaging",
+    "Types and Code Flow",
+    "Fixits",
+    // Playground
+    "Config",
+    "Tooling"
+  ]
+}
diff --git a/packages/playground-examples/copy/leet/JavaScript/JavaScript Essentials/Code Flow.ts b/packages/playground-examples/copy/leet/JavaScript/JavaScript Essentials/Code Flow.ts
@@ -0,0 +1,9 @@
+//// { title: 'c0d3 fl0w', order: 3, compiler: { strictNullChecks: true } }
+
+// How c0de fl0ws inside our JavaScript files can affect
+// the types throughout our programs.
+
+const users = [{ name: 'Ahmed' }, { name: 'Gemma' }, { name: 'Jon' }]
+
+// We're going to look to see if we can find a user named "jon".
+const jon = users.find(u => u.name === 'jon')
diff --git a/packages/playground-examples/copy/leet/JavaScript/JavaScript Essentials/Functions.ts b/packages/playground-examples/copy/leet/JavaScript/JavaScript Essentials/Functions.ts
@@ -0,0 +1,10 @@
+//// { title: 'Func710ns', order: 2, compiler: { noImplicitAny: false } }
+
+// There are qu1te a few ways to declare a function in
+// JavaScript. Let's look at a function which adds two
+// numbers together:
+
+// Creates @ function in global scope called addOldSchool
+function addOldSchool(x, y) {
+  return x + y
+}
diff --git a/packages/playground-examples/copy/leet/JavaScript/JavaScript Essentials/Hello World.ts b/packages/playground-examples/copy/leet/JavaScript/JavaScript Essentials/Hello World.ts
@@ -0,0 +1,34 @@
+//// { title: 'h3ll0 w0rld', order: 0, compiler: { target: 1 } }
+
+// Welcome to the TypeScript playground. This site is a lot
+// like running a TypeScript project inside a web browser.
+
+// The playground makes it easy for you to safely experiment
+// with ideas in TypeScript by making it trivial to share
+// these projects. The URL for this page is everything
+// required to load the project for someone else.
+
+const hello = 'Hello'
+
+// You can see on the right the result of the TypeScript
+// compiler: this is vanilla JavaScript which can run on
+// browsers, servers or anywhere really.
+
+const world = 'World'
+
+// You can see how it makes tiny changes to the code, by
+// converting a "const" to a "var". This is one of the many
+// things TypeScript does to make it possible to run
+// anywhere JavaScript runs.
+
+console.log(hello + ' ' + world)
+
+// Now that you have an idea of how the playground works,
+// let's look at how TypeScript makes working with
+// JavaScript more fun. During this section we'll be trying
+// to keep as close to vanilla JavaScript as possible to
+// show how you can re-use existing knowledge.
+//
+// Click below to continue:
+//
+// example:objects-and-arrays
diff --git a/...ages/playground-examples/copy/leet/JavaScript/JavaScript Essentials/Objects and Arrays.ts b/...ages/playground-examples/copy/leet/JavaScript/JavaScript Essentials/Objects and Arrays.ts
@@ -0,0 +1,110 @@
+//// { title: '0bj3cts & 4rrays', order: 1, compiler: { strict: false } }
+
+// JavaScript objects are collections of values wrapped up
+// with named keys.
+
+const userAccount = {
+  name: 'Kieron',
+  id: 0,
+}
+
+// You can combine these to make larger, more complex
+// data-models.
+
+const pie = {
+  type: 'Apple',
+}
+
+const purchaseOrder = {
+  owner: userAccount,
+  item: pie,
+}
+
+// If you use your mouse to hover over some of these words
+// (try purchaseOrder above) you can see how TypeScript is
+// interpreting your JavaScript into labeled types.
+
+// Values can be accessed via the ".", so to get a
+// username for a purchase order:
+console.log(purchaseOrder.item.type)
+
+// If you hover your mouse over each part of the code
+// between the ()s, you can see TypeScript offering more
+// information about each part. Try re-writing this below:
+
+// Copy this in the next line, character by character:
+//
+//   purchaseOrder.item.type
+
+// TypeScript provides feedback to the playground
+// about what JavaScript objects are available in this
+// file and lets you avoid typoes and see additional
+// information without having to look it up in another place.
+
+// TypeScript also offers these same features to arrays.
+// Here's an array with just our purchase order above in it.
+
+const allOrders = [purchaseOrder]
+
+// If you hover on allOrders, you can tell it's an array
+// because the hover info ends with []. You can access the
+// first order by using square brackets with an index
+// (starting from zero).
+
+const firstOrder = allOrders[0]
+console.log(firstOrder.item.type)
+
+// An alternative way to get an object is via pop-ing the
+// array to remove objects. Doing this removes the object
+// from the array, and returns the object. This is called
+// mutating the array, because it changes the underlying
+// data inside it.
+
+const poppedFirstOrder = allOrders.pop()
+
+// Now allOrders is empty. Mutating data can be useful for
+// many things, but one way to reduce the complexity in your
+// codebases is to avoid mutation. TypeScript offers a way
+// to declare an array readonly instead:
+
+// Creates a type based on the shape of a purchase order:
+type PurchaseOrder = typeof purchaseOrder
+
+// Creates a readonly array of purchase orders
+const readonlyOrders: readonly PurchaseOrder[] = [purchaseOrder]
+
+// Yep! That's a bit more code for sure. There's four
+// new things here:
+//
+//  type PurchaseOrder - Declares a new type to TypeScript.
+//
+//  typeof - Use the type inference system to set the type
+//           based on the const which is passed in next.
+//
+//  purchaseOrder - Get the variable purchaseOrder and tell
+//                  TypeScript this is the shape of all
+//                  objects in the orders array.
+//
+//  readonly - This object does not support mutation, once
+//             it is created then the contents of the array
+//             will always stay the same.
+//
+// Now if you try to pop from the readonlyOrders, TypeScript
+// will raise an error.
+
+readonlyOrders.pop()
+
+// You can use readonly in all sorts of places, it's a
+// little bit of extra syntax here and there, but it
+// provides a lot of extra safety.
+
+// You can find out more about readonly:
+//  - [handbook link]
+//  - https://basarat.gitbooks.io/typescript/content/docs/types/readonly.html
+
+// And you can carry on learning about JavaScript and
+// TypeScript in the example on functions:
+// example:functions
+//
+// Or if you want to know more about immutability:
+// example:immutability
diff --git a/packages/playground-examples/copy/leet/sections.json b/packages/playground-examples/copy/leet/sections.json
@@ -0,0 +1,47 @@
+{
+  "sections": [
+    {
+      "name": "J@va$cript",
+      "id": "JavaScript",
+      "subtitle": "See how Type$cr1pt improves day to day working with JavaScript with minimal additional syntax."
+    },
+    {
+      "name": "7ype5cript",
+      "id": "TypeScript",
+      "subtitle": "Explore h0w TypeScript extends JavaScript to add more safety and tooling."
+    },
+    {
+      "name": "3.7",
+      "id": "3.7",
+      "subtitle": "See the <a href='https://devblogs.microsoft.com/typescript/announcing-typescript-3-7/'>Release notes</a>."
+    },
+    {
+      "name": "P14yground",
+      "id": "Playground",
+      "subtitle": "Learn what has changed in this website."
+    }
+  ],
+
+  "sortedSubSections": [
+    // JS
+    "JavaScript Essentials",
+    "Functions with JavaScript",
+    "Working With Classes",
+    "Modern JavaScript",
+    "External APIs",
+    "Helping with JavaScript",
+    // TS
+    "Primitives",
+    "Type Primitives",
+    "Meta-Types",
+    "Language",
+    "Language Extensions",
+    // Examples
+    "Syntax and Messaging",
+    "Types and Code Flow",
+    "Fixits",
+    // Playground
+    "Config",
+    "Tooling"
+  ]
+}
diff --git a/packages/playground-examples/en/README.md b/packages/playground-examples/en/README.md
diff --git a/packages/playground-examples/package.json b/packages/playground-examples/package.json
@@ -4,7 +4,7 @@
   "license": "MIT",
   "version": "1.0.0",
   "scripts": {
-    "build": "node scripts/generateTOC.js",
+    "build": "node scripts/generateTOC.js; node scripts/copyFiles.js",
     "test": "echo 'NOOP'",
     "bootstrap": "echo 'NOOP'"
   }

diff --git a/packages/playground-examples/scripts/copyFiles.js b/packages/playground-examples/scripts/copyFiles.js
@@ -0,0 +1,14 @@
+// @ts-check
+
+const { execSync } = require('child_process')
+const { join } = require('path')
+
+const copyDir = join(__dirname, '..', 'copy', '*')
+const jsonDir = join(__dirname, '..', 'generated', '*.json')
+const outDir = join(__dirname, '..', '..', 'typescriptlang-org', 'static', 'js', 'examples')
+
+// Move samples
+execSync(`cp -R ${copyDir} ${outDir}`)
+
+// Move the JSON files which are generated
+execSync(`cp ${jsonDir} ${outDir}`)