[WIP] TypeScript Spanish Translation

packages/playground-examples/copy/es/TypeScript/Type Primitives/Built-in Utility Types.ts

@@ -0,0 +1,126 @@
+//// { order: 3, compiler: { strictNullChecks: true } }
+
+// Cuando un tipo en particular es utilizado en múltiples
+// bases de código, se agrega a TypeScript y pasa a estar
+// disponible para cualquier usuario, lo que significa que
+// puede confiar constantemente en su disponibilidad.
+
+// Partial<Type>
+
+// Toma como entrada un tipo y convierte todas sus
+// propiedades en opcionales.
+
+interface Sticker {
+  id: number
+  name: string
+  createdAt: string
+  updatedAt: string
+  submitter: undefined | string
+}
+
+type StickerUpdateParam = Partial<Sticker>
+
+// Readonly<Type>
+
+// Toma un objeto y hace que sus propiedades sean de solo lectura.
+
+type StickerFromAPI = Readonly<Sticker>
+
+// Record<KeysFrom, Type>
+
+// Crea un tipo que usa la lista de propiedades del
+// parametro KeysFrom y les asigna el valor del tipo.
+
+// Lista con llaves para KeysFrom:
+type NavigationPages = 'home' | 'stickers' | 'about' | 'contact'
+
+// La forma de los datos requerida para cada una de las
+// llaves anteriores:
+interface PageInfo {
+  title: string
+  url: string
+  axTitle?: string
+}
+
+const navigationInfo: Record<NavigationPages, PageInfo> = {
+  home: { title: 'Home', url: '/' },
+  about: { title: 'About', url: '/about' },
+  contact: { title: 'Contact', url: '/contact' },
+  stickers: { title: 'Stickers', url: '/stickers/all' },
+}
+
+// Pick<Type, Keys>
+
+// Crea un tipo seleccionando el conjunto de propiedades de
+// Keys definidas en Type. Esencialmente, una lista de
+// permisos para extraer información de tipo de un tipo.
+
+type StickerSortPreview = Pick<Sticker, 'name' | 'updatedAt'>
+
+// Omit<Type, Keys>
+
+// Crea un tipo eliminando el conjunto de propiedades
+// definidas en Keys del objeto Type. Esencialmente, una
+// lista de prohibición para extraer información de tipo de
+// un tipo.
+
+type StickerTimeMetadata = Omit<Sticker, 'name'>
+
+// Exclude<Type, RemoveUnion>
+
+// Crea un tipo conformado por las propiedades definidas en
+// Type que no se superponen con las definidas en
+// RemoveUnion.
+
+type HomeNavigationPages = Exclude<NavigationPages, 'home'>
+
+// Extract<Type, MatchUnion>
+
+// Crea un tipo conformado por las propiedades definidas en
+// Type que se superponen con las definidas en MatchUnion.
+
+type DynamicPages = Extract<NavigationPages, 'home' | 'stickers'>
+
+// NonNullable<Type>
+
+// Crea un tipo conformado por la exclusión del valor null y
+// undefined de un conjunto de propiedades. Muy útil cuando
+// tienes una condición de validación.
+
+type StickerLookupResult = Sticker | undefined | null
+type ValidatedResult = NonNullable<StickerLookupResult>
+
+// ReturnType<Type>
+
+// Extrae el valor de retorno de Type.
+
+declare function getStickerByID(id: number): Promise<StickerLookupResult>
+type StickerResponse = ReturnType<typeof getStickerByID>
+
+// InstanceType<Type>
+
+// Crea un tipo que es una instancia de una clase, o un
+// objeto con un constructor.
+
+class StickerCollection {
+  stickers: Sticker[]
+}
+
+type CollectionItem = InstanceType<typeof StickerCollection>
+
+// Required<Type>
+
+// Crea un tipo que convierte todas las propiedades
+// opcionales a requeridas.
+
+type AccessiblePageInfo = Required<PageInfo>
+
+// ThisType<Type>
+
+// A diferencia de otros tipos, ThisType no retorna un nuevo
+// tipo, en vez de ello, manipula la definición del tipo en
+// una función. Solo se puede usar ThisType cuando se tiene
+// activada la opción noImplicitThis en tu configuración
+// TSConfig.
+
+// https://www.typescriptlang.org/docs/handbook/utility-types.html

packages/playground-examples/copy/es/TypeScript/Type Primitives/Nullable Types.ts

@@ -0,0 +1,96 @@
+//// { title: "Tipos Anulables", order: 3, compiler: { strictNullChecks: false } }
+
+// JavaScript tiene dos formas de declarar valores que no
+// existen, y TypeScript agrega sintaxis adicional lo que
+// permite aun más formas de declarar algo como opcional o
+// anulable.
+
+// Primero, la diferencia entre ambas primitivas de
+// JavaScript: undefined y null.
+
+// La primitiva indefinida `undefined` es cuando algo no
+// puede ser encontrado o modificado.
+
+const emptyObj = {}
+const anUndefinedProperty: undefined = emptyObj['anything']
+
+// La primitiva nula `null` está destinada a ser usada
+// cuando hay una falta consciente de un valor.
+
+const searchResults = {
+  video: { name: 'LEGO Movie' },
+  text: null,
+  audio: { name: 'LEGO Movie Soundtrack' },
+}
+
+// ¿Por qué no usar undefined? Principalmente, porque ahora
+// puedes verificar que la propiedad text se haya incluido
+// correctamente. Si la propiedad text se devuelve como
+// undefined, el resultado es el mismo que si no estuviera
+// allí.
+
+// Esto puede parecer un poco superficial, pero cuando se
+// hace la conversión a una cadena JSON, si la propiedad
+// text era undefined, esta no podria ser incluida en la
+// cadena de texto equivalente.
+
+// Tipos Anulables Estrictos
+
+// Antes de TypeScript 2.0, las primitivas undefined y null
+// eran ignoradas en el sistema de tipado. Esto permitió que
+// TypeScript proporcionará un entorno de codificación más
+// cercano a JavaScript sin tipado.
+
+// La versión 2.0 agregó una opción de compilador llamada
+// "strictNullChecks" y esta opción requería que los
+// usuarios tratasen undefined y null como tipos que deben
+// ser manejados por medio de análisis de flujo de código
+// ( Ver más en example:code-flow )
+
+// Para ver un ejemplo de la diferencia en activar la opción
+// de verificación estricta de tipos nulos en TypeScript,
+// desplaza el cursor sobre "PotentialString" a
+// continuación:
+
+type PotentialString = string | undefined | null
+
+// La variable PotentialString descarta el valor undefined y
+// null. Si vas al panel de configuración, y activas el modo
+// estricto, al regresar al código, verás que al pasar por
+// PotentialString ahora se muestra la unión completa de
+// tipos.
+
+declare function getID(): PotentialString
+
+const userID = getID()
+console.log('User Logged in: ', userID.toUpperCase())
+
+// Lo anterior fallará solamente en modo estricto ^
+
+// Existen maneras de decirle a TypeScript que sabes lo que
+// haces, como por ejemplo una aserción de tipo o mediante
+// un operador de aserción no nulo (!)
+
+const definitelyString1 = getID() as string
+const definitelyString2 = getID()!
+
+// O puedes verificar de manera segura por la existencia del
+// valor utilizando un condicional if:
+
+if (userID) {
+  console.log(userID)
+}
+
+// Propiedades Opcionales
+
+// Void
+
+// Void es el tipo que retorna una función que no devuelve
+// un valor.
+
+const voidFunction = () => {}
+const resultOfVoidFunction = voidFunction()
+
+// Esto es usualmente un accidente, y TypeScript mantiene el
+// tipo vacío para permitirle obtener errores del compilador,
+// aunque en tiempo de ejecución sería undefined.

packages/playground-examples/copy/es/TypeScript/Type Primitives/Tuples.ts

@@ -0,0 +1,80 @@
+// Típicamente un arreglo contiene de cero a muchos objetos
+// de un solo tipo. TypeScript tiene un análisis especial en
+// torno a los arreglos que contengan múltiples tipos, y
+// donde es importante el orden en que se indexan.
+
+// Estos se llaman tuplas (en inglés **tuples**). Piensa en
+// ellas como una forma de conectar algunos datos pero con
+// menos sintaxis que un objeto ordenado por llaves.
+
+// Puedes crear una tupla utilizando la sintaxis de arreglos
+// en JavaScript:
+
+const failingResponse = ['Not Found', 404]
+
+// pero necesitarás declarar su tipo como una tupla.
+
+const passingResponse: [string, number] = ['{}', 200]
+
+// Al pasar el cursor sobre los nombres de ambas variables
+// puedes ver la diferencia entre la variable de tipo arreglo
+// ( (string | number)[] ) y la tupla ( [string, number] ).
+
+// En un arreglo, el orden no es importante por lo que un
+// elemento en cualquier indice puede ser una cadena de
+// texto o un número. En la tupla, el orden y la longitud
+// son garantizados.
+
+if (passingResponse[1] === 200) {
+  const localInfo = JSON.parse(passingResponse[0])
+  console.log(localInfo)
+}
+
+// Esto significa que TypeScript proporcionará el tipo
+// correcto en el índice adecuado e incluso generará un
+// error si intenta acceder a un objeto en un índice no
+// declarado.
+
+passingResponse[2]
+
+// Una tupla puede lucir como un buen patrón para pedazos
+// cortos de datos entrelazados o como base de otras tareas.
+
+type StaffAccount = [number, string, string, string?]
+
+const staff: StaffAccount[] = [
+  [0, 'Adankwo', 'adankwo.e@'],
+  [1, 'Kanokwan', 'kanokwan.s@'],
+  [2, 'Aneurin', 'aneurin.s@', 'Supervisor'],
+]
+
+// Cuando se tiene un conjunto conocido de tipos en el
+// comienzo de la tupla y luego un tamaño desconocido, se
+// puede hacer uso del operador de propagación para indicar
+// que este puede tener cualquier longitud y los indices
+// extras serán de un tipo de dato en particular:
+
+type PayStubs = [StaffAccount, ...number[]]
+
+const payStubs: PayStubs[] = [
+  [staff[0], 250],
+  [staff[1], 250, 260],
+  [staff[0], 300, 300, 300],
+]
+
+const monthOnePayments = payStubs[0][1] + payStubs[1][1] + payStubs[2][1]
+const monthTwoPayments = payStubs[1][2] + payStubs[2][2]
+const monthThreePayments = payStubs[2][2]
+
+// Puedes utilizar tuplas para describir funciones las
+// cuales toman un número indefinido de parámetros con un
+// tipo determinado:
+
+declare function calculatePayForEmployee(id: number, ...args: [...number[]]): number
+
+calculatePayForEmployee(staff[0][0], payStubs[0][1])
+calculatePayForEmployee(staff[1][0], payStubs[1][1], payStubs[1][2])
+
+//
+// https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-0.html#tuples-in-rest-parameters-and-spread-expressions
+// https://auth0.com/blog/typescript-3-exploring-tuples-the-unknown-type/

packages/playground-examples/copy/es/sections.json

@@ -0,0 +1,54 @@
+{
+  "sections": [
+    {
+      "name": "JavaScript",
+      "id": "JavaScript",
+      "subtitle": "Descubre TypeScript mejora tu día a día con JavaScript con una sintaxis adicional mínima."
+    },
+    {
+      "name": "TypeScript",
+      "id": "TypeScript",
+      "subtitle": "Explora cómo TypeScript extiende JavaScript para agregar más seguridad y herramientas."
+    },
+    {
+      "name": "3.7",
+      "id": "3.7",
+      "subtitle": "Lee las <a href='https://devblogs.microsoft.com/typescript/announcing-typescript-3-7/'> notas de lanzamiento</a>."
+    },
+    {
+      "name": "3.8",
+      "id": "3.8",
+      "subtitle": "Lee las <a href='https://devblogs.microsoft.com/typescript/announcing-typescript-3-8-beta/'>notas de lanzamiento de la Beta</a>."
+    },
+    {
+      "name": "Playground V3",
+      "id": "Playground",
+      "subtitle": "Descubre lo que ha cambiado en este sitio web."
+    }
+  ],
+  "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",
+    // 3.8
+    "Breaking Changes",
+    "JSDoc Improvements"
+  ]
+}

packages/typescriptlang-org/lib/bootup/ingestion/createPlaygrounds.ts

@@ -40,7 +40,7 @@ export const createPlaygrounds = async (
     // prettier-ignore
     const compilerOptsForLang = path.join(appRoot,"tsconfig-reference","output",lang.name + "-summary.json")
     // prettier-ignore
-    const compilerOptsForLangFallback = path.join( appRoot, "tsconfig-reference","output", "en-summary.json")
+    const compilerOptsForLangFallback = path.join( appRoot, "tsconfig-reference", "output", "en-summary.json")
 
     const hasOptsForLang = fs.existsSync(compilerOptsForLang)
     const optionsPath = hasOptsForLang

packages/typescriptlang-org/src/copy/es.ts

@@ -0,0 +1,16 @@
+import { defineMessages } from "react-intl"
+import { Copy, messages as englishMessages } from "./en"
+import { navCopy } from "./es/nav"
+import { headCopy } from "./es/head-seo"
+import { docCopy } from "./en/documentation"
+import { indexCopy } from "./en/index"
+import { playCopy } from "./es/playground"
+
+export const lang: Copy = defineMessages({
+  ...englishMessages,
+  ...navCopy,
+  ...docCopy,
+  ...headCopy,
+  ...indexCopy,
+  ...playCopy,
+})