# gt-next: General Translation Next.js SDK: msg
URL: https://generaltranslation.com/es/docs/next/api/strings/msg.mdx
---
title: msg
description: Referencia de la API de la función msg() para cadenas
---

{/* GENERADO AUTOMÁTICAMENTE: No edites esto directamente. Edita la plantilla en content/docs-templates/. */}


## Descripción general

La función `msg` marca y codifica cadenas para traducirlas.

```jsx
const encodedString = msg('Hello, world!');
```

La cadena codificada debe pasarse al hook [`useMessages`](/docs/next/api/strings/use-messages) para obtener las traducciones.

<Callout>
  **Codificación:**
  `msg` codifica la cadena de entrada, por lo que no puedes usarla directamente en JSX ni en ningún otro contexto.
  Si quieres recuperar la cadena original, debes decodificarla con [`decodeMsg`](#decodemsg)
</Callout>


## Decodificación [#decodemsg]

Para recuperar la cadena original, debes decodificarla con [`decodeMsg`](#decodemsg)

```jsx
import { msg, decodeMsg } from 'gt-next';
const encodedString = msg('Hello, world!');
const decodedString = decodeMsg(encodedString);
console.log(decodedString); // "Hello, world!"
```


## Referencia

### Parámetros

| Nombre     | Tipo                                                                          | Descripción                                                          |
| ---------- | ----------------------------------------------------------------------------- | -------------------------------------------------------------------- |
| `content`  | `string`                                                                      | La cadena de texto que se codificará.                                |
| `options?` | [`InlineTranslationOptions`](/docs/next/api/types/inline-translation-options) | Opciones de traducción para personalizar el comportamiento de `msg`. |

### Devuelve

Una cadena codificada, con las variables interpoladas (si las hay) sustituidas por sus valores.

***

## Funcionamiento

### Producción

Durante el proceso de CD, cualquier contenido dentro de una función `msg` se traducirá antes de que se despliegue tu aplicación.
Esto garantiza tiempos de carga rápidos para todas las configuraciones regionales, pero solo puede traducir contenido conocido en tiempo de compilación.

Una vez generadas, las traducciones se almacenan (1) en la CDN o (2) en la salida de compilación de tu aplicación, según tu configuración.
A partir de ahí, el contenido traducido se entrega a tus usuarios.
Si no se encuentra una traducción, se usará el contenido original.

Asegúrate de seguir la [guía de despliegue aquí](/docs/next/tutorials/quickdeploy).

### Desarrollo

Durante el desarrollo, la función `msg` traducirá el contenido bajo demanda.
Esto resulta útil para prototipar cómo se verá tu aplicación en distintos idiomas.
Recuerda añadir una clave de API de desarrollo a tu entorno para habilitar este comportamiento.

Verás cierta latencia durante la traducción bajo demanda en desarrollo.
Esto no ocurrirá en las compilaciones de producción, a menos que el contenido se esté traduciendo explícitamente bajo demanda.

***

## Ejemplo

### Uso básico

Puedes usar `msg` para marcar cadenas para su traducción.

```jsx copy
import { msg, useMessages } from 'gt-next';

const encodedString = msg('Hello, world!');

export default function TranslateGreeting() {
  const m = useMessages();
  return (
    <p>
      {m(encodedString)}
    </p>
  );
}
```

Nota: &quot;¡Hola, mundo!&quot; se traducirá al idioma que prefiera el usuario.


### Uso de variables [#variables]

Puedes pasar variables a las traducciones del diccionario.

```jsx copy
import { msg, useMessages } from 'gt-next';

const encodedString = msg('Hello, {name}!', { name: 'Alice' });

export default function TranslateGreeting() {
  const m = useMessages();

  return (
    <p>
      {m(encodedString)}
    </p>
  );
}
```

Nota: &quot;Alice&quot; no se traducirá al idioma preferido del usuario, ya que es una variable.


### Uso del formato de mensajes ICU

`gt-next` admite el formato de mensajes ICU, que también te permite formatear las variables.

```jsx copy
import { msg, useMessages } from 'gt-next';

const encodedString = msg('There are {count, plural, =0 {no items} =1 {one item} other {{count} items}} in the cart', { count: 10 });

export default function TranslateGreeting() {
  const m = useMessages();
  return (
    <p>
      {m(encodedString)}
    </p>
  );
}
```

<Callout>
  El formato de mensajes ICU es una forma muy útil de dar formato a tus variables.
  Para obtener más información, consulta la [documentación sobre el formato de mensajes ICU](https://unicode-org.github.io/icu/userguide/format_parse/messages/).
</Callout>

***


## Notas

* La función `msg` se usa para marcar cadenas para su traducción.
* La traducción de cadenas con `msg` ocurre antes del runtime, durante el proceso de compilación (salvo en desarrollo).

## Próximos pasos

* Consulta [`useMessages`](/docs/next/api/strings/use-messages) para traducir cadenas.