Localización para casos de uso del mundo real: Aprendizajes clave de la incorporación de marcas globales

Rate this content
Bookmark

i18n no es fácil, pero con una planificación cuidadosa de tu modelo de contenido te mostraré cómo estructurar la configuración, la autoría y la consulta de contenido localizado. Cubriremos documentos traducidos completos o parciales, la diferencia entre contenido específico del mercado y del idioma, formas de autoría en un CMS como Sanity y formas de consultarlo en frontends como Next.js y Remix.

FAQ

Sanity.io no es un sistema de gestión de contenido tradicional, sino una plataforma para contenido estructurado que permite personalizar la experiencia de gestión de contenido (CMS) de acuerdo con las necesidades específicas del usuario.

Sanity.io permite la internacionalización de contenido adaptándola al dominio específico del contenido, sin imponer un método único. Permite crear múltiples versiones de idioma de los campos y documentos, y configurarlos según las necesidades de la organización.

La versión 3 de Sanity Studio transforma el CMS en un componente que puede integrarse en cualquier aplicación React, ofreciendo una flexibilidad sin precedentes para los desarrolladores y facilitando la integración de contenido estructurado en aplicaciones diversas.

Sanity se enfoca en manejar contenido como datos, lo que permite una gran flexibilidad y adaptabilidad. Puede manejar cualquier tipo de datos estructurados, desde textos y imágenes hasta configuraciones específicas de idioma y más.

Sanity.io permite configurar y gestionar contenido multilingüe a través de una única fuente de verdad que se puede propagar a través de esquemas, complementos, APIs y servicios de traducción, simplificando la administración de contenido en múltiples idiomas.

Sí, Sanity.io dispone de complementos como uno de Google Translate que permite a los usuarios escribir contenido en un idioma y traducirlo automáticamente a varios otros idiomas, facilitando la gestión de contenido internacional.

Sanity.io ofrece la posibilidad de crear mercados personalizados, donde los editores de contenido pueden configurar qué información específica de mercado se muestra en cada documento, adaptando así el contenido a las particularidades de cada región o país.

Simeon Griggs
Simeon Griggs
8 min
17 Jun, 2022

Comments

Sign in or register to post your comment.

Video Summary and Transcription

Voy a hablar sobre la localización en el mundo real y cómo Sanity, una plataforma de contenido estructurado, se enfoca en el contenido como datos y en la internacionalización flexible. Sanity permite múltiples idiomas en diferentes mercados, proporcionando opciones de personalización para la visibilidad del contenido según la ubicación. La plataforma ofrece un enfoque flexible para la creación y personalización de contenido, permitiendo a las organizaciones internacionalizar su contenido según sus necesidades específicas. Con el lenguaje de consulta de Sanity y la nueva versión de Sanity Studio, los desarrolladores tienen más flexibilidad que nunca.

1. Introducción a la Localización

Short description:

Voy a hablarles sobre la localización en el mundo real. Soy de Sanity. Sanity es una plataforma para contenido estructurado. Significa que puedes personalizar tu experiencia de CMS para que sea lo que quieras. Decimos que el contenido es datos. ¿Y qué significa eso? Bueno, vamos a desglosarlo diciendo cuál es lo opuesto. Así que has construido un sitio web como este, yo he construido sitios web como este. Y en el pasado, cuando solía trabajar con sitios web de WordPress, habrías dicho, ¿cuál es el modelo de contenido de esta página?

React Jingle ♪ Si en algún momento encuentras mi charla aburrida, es posible que quieras sacar tu teléfono y tomar una foto de ese código QR. Puedes reservar una demo, echar un vistazo a Sanity, entender cómo funciona. De lo contrario, puedes escucharme durante los próximos minutos.

Buen día a todos en la sala y un gran saludo a Internet, a todos los que están viendo la transmisión en vivo. Mi nombre es Simeon Griggs, soy Ingeniero de Soluciones en Sanity.io. Y hoy vengo con dos objetivos en mente.

Uno, voy a hablarles sobre la localización. Y quiero transmitir, porque sé que ya ha sido un día largo, voy a transmitir la energía de mil soles explotando a la localización, porque sé que es un tema que emociona a la gente. Sin límites, pero dos, tengo un motivo oculto, soy un narcisista y estoy obsesionado con las fotos de los conferencistas. Y realmente espero que haya algunos fotógrafos en la sala. Y solo quiero asegurarme de que yo... ... ...me vaya con un poco de ese estilo de liderazgo de pensamiento. Así que espero que alguien haya capturado eso o tal vez haya algo mejor.

Bueno, parece que hoy estoy haciendo una noche de micrófono abierto sosteniendo mi micrófono. Voy a hablarles sobre la localización en el mundo real. Soy de Sanity. Sanity es un contenido... No es un sistema de gestión de contenido. Es una plataforma para contenido estructurado. Significa que puedes personalizar tu experiencia de CMS para que sea lo que quieras, si quieres establecer una regla de validation en un documento que necesitas resolver el wordle del día para publicarlo, puedes hacerlo. No es necesario, pero puedes hacerlo. Y decimos que el contenido es data. ¿Y qué significa eso? Bueno, vamos a desglosarlo diciendo cuál es lo opuesto. ¿Quién escucha podcasts a 1.5 de velocidad? Porque supuse que habría suficientes de ustedes que podrán seguirme el ritmo si sigo hablando así todo el tiempo.

Así que has construido un sitio web como este, yo he construido sitios web como este. Y en el pasado, cuando solía trabajar con sitios web de WordPress, ¿quién solía construir sitios web de WordPress para ganarse la vida? Sí, mi gente. Y en aquel entonces habrías mirado esto y habrías dicho, ¿cuál es el modelo de contenido de esta página? Y habrías dicho, Simeon, el modelo de contenido para eso, señor, es una página. Y habrías creado un archivo llamado template-course.php y lo habrías creado como una página. Y las lecciones habrían sido páginas secundarias de esa página.

2. Content as Data and Internationalization

Short description:

Sanity se enfoca en el contenido como datos y permite una internacionalización flexible. Los datos del lenguaje pueden ser internacionalizados de manera diferente según el contenido. Sanity proporciona la flexibilidad para internacionalizar las cosas de acuerdo con el contenido. Puedes configurar los idiomas en Sanity utilizando JavaScript, mapeando campos o documentos para crear versiones específicas de idioma. Esta única fuente de verdad puede ser distribuida a tu esquema de Sanity, complementos, APIs y servicios de traducción, y tus rutas de Next.js o Remix. Como ingeniero de soluciones, presento Sanity a los clientes y muestro cómo nuestros clientes han realizado la internacionalización en nuestro software utilizando pares clave-valor.

Pero eso es contenido como presentación. Sanity se enfoca en el contenido como data. Y si aún estás usando WordPress, no sé, ahora son todos bloques o algo así, pero no es correcto. Así que volvamos a mirar este sitio web. Está compuesto por piezas de contenido dispares que están conectadas, pero no tenemos que centrarnos en la presentación como un sitio web. Simplemente sucede que está en un sitio web. Esto es contenido. Esto es data de curso, data de presentador, data de etiqueta, data de lección, y lo más importante de todo para el tema de hoy, esto es data de idioma. Y el data de idioma es realmente importante porque puede ser internacionalizado de manera diferente según ese contenido.

Así que consideremos nuestro modelo de presentador. Tengo un nombre, un título y una foto. Ahora, solo dos de esas cosas van a cambiar si necesito internacionalizar este documento. Mi nombre siempre va a ser el mismo. Mi foto va a ser la misma. Entonces, si tengo múltiples versiones de idioma en ese documento, voy a crear múltiples versiones de idioma de ese campo. Y si estoy viendo una lección, bueno, todas estas son texto, así que no tendría sentido tener todas estas como versiones localizadas en este documento, más bien podríamos hacer versiones localizadas de ese documento, y esta es la flexibilidad que Sanity te brinda, puedes internacionalizar las cosas, de acuerdo con el contenido, no de acuerdo con nosotros. No te decimos cómo hacer la internacionalización de idioma, porque para nosotros, todo es data. El idioma es el data. Así es como configuras los idiomas en Sanity, porque todo es JavaScript, por lo que tiene sentido para un desarrollador, ¿verdad? Simplemente mapeas los campos, o mapeas los documentos, y creas versiones específicas de idioma de esos. Y luego este archivo de configuración se puede propagar a tu esquema de Sanity, a tus complementos, a las APIs y servicios de traducción, a tus rutas de Next.js o Remix, y todo proviene de esta única fuente de verdad que subes a GitHub, implementas en el Studio. Y eso es la localización en el mundo real.

Como ingeniero de soluciones, gran parte de mi trabajo consiste en presentar Sanity a nuestros clientes, pero lo genial de lo flexible que es Sanity como plataforma de contenido es que nuestros clientes nos cuentan cómo hacen las cosas. Y gran parte del resto de la charla aquí es mostrar cómo nuestros clientes muestran cómo han realizado la internacionalización en nuestro software. El problema es que no puedo decirles sus nombres, así que tengo que hablar en palabras ambiguas, más o menos. Entonces, esta empresa de altavoces conectados a Internet que utiliza Sanity, utiliza pares clave-valor. Entonces, si has hecho localización con Sanity, probablemente ya hayas hecho este tipo de cosas. Esto es un vistazo a un complemento de Google Translate que tenemos para que puedas escribir contenido en un idioma y que se traduzca automáticamente a varios otros idiomas. Y puedes configurar pares clave-valor. Por lo general, los almacenarías en JSON. Puedes dar a tus equipos de contenido una versión editable de ese contenido.

Check out more articles and videos

We constantly think of articles and videos that might spark Git people interest / skill us up or help building a stellar career

Construyendo Mejores Sitios Web con Remix
React Summit Remote Edition 2021React Summit Remote Edition 2021
33 min
Construyendo Mejores Sitios Web con Remix
Top Content
Remix es un nuevo marco de trabajo web de los creadores de React Router que te ayuda a construir mejores y más rápidos sitios web a través de una sólida comprensión de los fundamentos de la web. Remix se encarga de las tareas pesadas como la renderización del servidor, la división de código, la precarga y la navegación, y te deja con la parte divertida: ¡construir algo increíble!
No resuelvas problemas, elimínalos
React Advanced Conference 2021React Advanced Conference 2021
39 min
No resuelvas problemas, elimínalos
Top Content
Los humanos son solucionadores de problemas naturales y somos lo suficientemente buenos en eso que hemos sobrevivido a lo largo de los siglos y nos hemos convertido en la especie dominante del planeta. Debido a que somos tan buenos en eso, a veces también nos convertimos en buscadores de problemas, buscando problemas que podemos resolver. Aquellos que logran sus objetivos de la manera más exitosa son los eliminadores de problemas. Hablemos de la distinción entre resolver y eliminar problemas con ejemplos de dentro y fuera del mundo de la codificación.
Escalando con Remix y Micro Frontends
Remix Conf Europe 2022Remix Conf Europe 2022
23 min
Escalando con Remix y Micro Frontends
Top Content
¿Tienes un producto grande construido por muchos equipos? ¿Estás luchando para lanzar a menudo? ¿Se convirtió tu frontend en un monolito inmantenible masivo? Si, como yo, has respondido sí a cualquiera de esas preguntas, ¡esta charla es para ti! Te mostraré exactamente cómo puedes construir una arquitectura de micro frontend con Remix para resolver esos desafíos.
Enrutamiento en React 18 y más allá
React Summit 2022React Summit 2022
20 min
Enrutamiento en React 18 y más allá
Top Content
Concurrent React y Server Components están cambiando la forma en que pensamos sobre el enrutamiento, la renderización y la obtención de datos en las aplicaciones web. Next.js recientemente compartió parte de su visión para ayudar a los desarrolladores a adoptar estas nuevas características de React y aprovechar los beneficios que desbloquean.En esta charla, exploraremos el pasado, presente y futuro del enrutamiento en las aplicaciones de front-end y discutiremos cómo las nuevas características en React y Next.js pueden ayudarnos a arquitectar aplicaciones más eficientes y con más funciones.
Componentes de Full Stack
Remix Conf Europe 2022Remix Conf Europe 2022
37 min
Componentes de Full Stack
Top Content
Remix es un marco de trabajo web que te ofrece el modelo mental simple de una aplicación de múltiples páginas (MPA) pero el poder y las capacidades de una aplicación de una sola página (SPA). Uno de los grandes desafíos de las SPA es la gestión de la red que resulta en una gran cantidad de indirecciones y código defectuoso. Esto es especialmente notable en el estado de la aplicación que Remix elimina por completo, pero también es un problema en los componentes individuales que se comunican con un punto final de backend de un solo propósito (como una búsqueda de combobox, por ejemplo).
En esta charla, Kent demostrará cómo Remix te permite construir componentes de interfaz de usuario complejos que están conectados a un backend de la manera más simple y poderosa que hayas visto. Dejándote tiempo para relajarte con tu familia o lo que sea que hagas para divertirte.
Un Marco para Gestionar la Deuda Técnica
TechLead Conference 2023TechLead Conference 2023
35 min
Un Marco para Gestionar la Deuda Técnica
Top Content
Seamos realistas: la deuda técnica es inevitable y reescribir tu código cada 6 meses no es una opción. La refactorización es un tema complejo que no tiene una solución única para todos. Las aplicaciones de frontend son particularmente sensibles debido a los frecuentes cambios de requisitos y flujos de usuario. Nuevas abstracciones, patrones actualizados y limpieza de esas viejas funciones - todo suena genial en papel, pero a menudo falla en la práctica: los todos se acumulan, los tickets terminan pudriéndose en el backlog y el código legado aparece en cada rincón de tu base de código. Por lo tanto, un proceso de refactorización continua es la única arma que tienes contra la deuda técnica.En los últimos tres años, he estado explorando diferentes estrategias y procesos para refactorizar el código. En esta charla describiré los componentes clave de un marco para abordar la refactorización y compartiré algunos de los aprendizajes acumulados en el camino. Espero que esto te ayude en tu búsqueda de mejorar la calidad del código de tus bases de código.

Workshops on related topic

Fundamentos de Remix
React Summit 2022React Summit 2022
136 min
Fundamentos de Remix
Top Content
Featured WorkshopFree
Kent C. Dodds
Kent C. Dodds
Construir aplicaciones web modernas está lleno de complejidad. Y eso solo si te molestas en lidiar con los problemas
¿Cansado de conectar onSubmit a las API del backend y asegurarte de que tu caché del lado del cliente se mantenga actualizada? ¿No sería genial poder utilizar la naturaleza global de CSS en tu beneficio, en lugar de buscar herramientas o convenciones para evitarla o trabajar alrededor de ella? ¿Y qué te parecería tener diseños anidados con una gestión de datos inteligente y optimizada para el rendimiento que simplemente funciona™?
Remix resuelve algunos de estos problemas y elimina completamente el resto. Ni siquiera tienes que pensar en la gestión de la caché del servidor o en los conflictos del espacio de nombres global de CSS. No es que Remix tenga APIs para evitar estos problemas, simplemente no existen cuando estás usando Remix. Ah, y no necesitas ese enorme y complejo cliente graphql cuando estás usando Remix. Ellos te tienen cubierto. ¿Listo para construir aplicaciones más rápidas de manera más rápida?
Al final de esta masterclass, sabrás cómo:- Crear Rutas de Remix- Estilizar aplicaciones de Remix- Cargar datos en los cargadores de Remix- Mutar datos con formularios y acciones
De vuelta a las raíces con Remix
React Summit 2023React Summit 2023
106 min
De vuelta a las raíces con Remix
Featured Workshop
Alex Korzhikov
Pavlik Kiselev
2 authors
La web moderna sería diferente sin aplicaciones ricas del lado del cliente respaldadas por potentes frameworks: React, Angular, Vue, Lit y muchos otros. Estos frameworks se basan en JavaScript del lado del cliente, que es su núcleo. Sin embargo, existen otros enfoques para el renderizado. Uno de ellos (bastante antiguo, por cierto) es el renderizado del lado del servidor completamente sin JavaScript. Descubramos si esta es una buena idea y cómo Remix puede ayudarnos con ello?
Prerrequisitos- Buen entendimiento de JavaScript o TypeScript- Sería útil tener experiencia con React, Redux, Node.js y escribir aplicaciones FrontEnd y BackEnd- Preinstalar Node.js, npm- Preferimos usar VSCode, pero también se pueden utilizar IDE en la nube como codesandbox (otros IDE también están bien)
Cómo Resolver Problemas del Mundo Real con Remix
Remix Conf Europe 2022Remix Conf Europe 2022
195 min
Cómo Resolver Problemas del Mundo Real con Remix
Featured Workshop
Michael Carter
Michael Carter
- ¿Errores? Cómo renderizar y registrar tus errores del servidor y del clientea - Cuándo devolver errores vs lanzar excepcionesb - Configurar servicios de registro como Sentry, LogRocket y Bugsnag- ¿Formularios? Cómo validar y manejar formularios de varias páginasa - Usar zod para validar los datos del formulario en tu acciónb - Pasar por formularios de varias páginas sin perder datos- ¿Atascado? Cómo solucionar errores o funciones faltantes en Remix para que puedas continuara - Usar patch-package para solucionar rápidamente tu instalación de Remixb - Mostrar herramienta para gestionar múltiples parches y seleccionar solicitudes de extracción abiertas- ¿Usuarios? Cómo manejar aplicaciones de varios inquilinos con Prismaa - Determinar el inquilino por el host o por el usuariob - Base de datos múltiples o base de datos única/múltiples esquemasc - Asegura que los datos del inquilino siempre estén separados de los demás
Construye y lanza un blog personal usando Remix y Vercel
Remix Conf Europe 2022Remix Conf Europe 2022
156 min
Construye y lanza un blog personal usando Remix y Vercel
Featured Workshop
Robert Pop
Robert Pop
En este masterclass aprenderemos cómo construir un blog personal desde cero usando Remix, TailwindCSS. El blog será alojado en Vercel y todo el contenido será servido dinámicamente desde un repositorio separado en GitHub. Utilizaremos HTTP Caching para las publicaciones del blog.
Lo que queremos lograr al final del masterclass es tener una lista de nuestras publicaciones de blog mostradas en la versión desplegada del sitio web, la capacidad de filtrarlas y leerlas individualmente.
Tabla de contenidos:- Configurar un proyecto de Remix con una pila predefinida- Instalar dependencias adicionales- Leer contenido desde GitHub- Mostrar contenido desde GitHub- Analizar el contenido y cargarlo en nuestra aplicación usando mdx-bundler- Crear una página separada para las publicaciones de blog para mostrarlas de forma independiente- Agregar filtros a la lista inicial de publicaciones de blog
Construye una aplicación WordPress sin cabeza con Next.js y WPGraphQL
React Summit 2022React Summit 2022
173 min
Construye una aplicación WordPress sin cabeza con Next.js y WPGraphQL
Top Content
WorkshopFree
Kellen Mace
Kellen Mace
En esta masterclass, aprenderás cómo construir una aplicación Next.js que utiliza Apollo Client para obtener datos de un backend de WordPress sin cabeza y usarlo para renderizar las páginas de tu aplicación. Aprenderás cuándo debes considerar una arquitectura de WordPress sin cabeza, cómo convertir un backend de WordPress en un servidor GraphQL, cómo componer consultas usando el IDE GraphiQL, cómo colocar fragmentos GraphQL con tus componentes, y más.
Next.js 13: Estrategias de Obtención de Datos
React Day Berlin 2022React Day Berlin 2022
53 min
Next.js 13: Estrategias de Obtención de Datos
Top Content
WorkshopFree
Alice De Mauro
Alice De Mauro
- Introducción- Prerrequisitos para la masterclass- Estrategias de obtención: fundamentos- Estrategias de obtención – práctica: API de obtención, caché (estática VS dinámica), revalidar, suspense (obtención de datos en paralelo)- Prueba tu construcción y sírvela en Vercel- Futuro: Componentes de servidor VS Componentes de cliente- Huevo de pascua de la masterclass (no relacionado con el tema, destacando la accesibilidad)- Conclusión