This Stack Makes i18n EASY
Internationalization, or i18n for short, is the process of designing and developing a product in a way that it can easily be adapted to different languages and cultures. It is an important consideration for any application with a global audience, and can greatly impact the user experience and marketability of a product.
Fortunately, there are tools and technologies available to help make i18n easier for developers. One such stack is the combination of HTML, CSS, and JavaScript, which offers a range of features to support internationalization.
HTML5
HTML5 provides a number of features that can support internationalization, such as the “lang” attribute, which allows you to specify the language of a particular piece of content. This can be particularly useful for indicating the language of a specific section of a webpage, such as a news article or blog post.
CSS
CSS offers support for formatting text and layouts in different languages, including the ability to apply different font styles and sizes based on the language being used. This can help ensure that your content is properly displayed and legible in any language, regardless of differences in character sets and writing systems.
JavaScript
JavaScript can be used to create dynamic and interactive user interfaces, and can also be leveraged to support internationalization. For example, it can be used to dynamically switch between different language versions of a website, or to handle date and time formatting based on the user’s locale.
By leveraging these technologies, developers can create applications that are easily adaptable to different languages and cultures, helping to expand their reach and appeal to a global audience.
Overall, the combination of HTML, CSS, and JavaScript offers a powerful stack for supporting internationalization, making it easier for developers to create applications that are accessible and user-friendly in any language.
How would I handle translations for the folder language approach? Because usually another language has another url for the same page and may not have the (same) page and/or structure as in English for example. Also how about making a language switcher based on the story alternates? That would be really interesting. I've tried to create something like that in the layout of my nuxt app, but I retrieve data only on page level and also the layout is not redrawn on navigating with nuxt links.. :/
Thanks, what if I want to use "i18n" in the Nuxt3 content app?
awesome
your really made it easy
is there source code for this project?
Big thank dude in less than 5 minutes you solve my journey problem
You best!
I’ve used react and nextjs for a while, at work they use nuxt and I absolutely love it. The nuxt community is large and nuxt is really there for the developer. Great features specially the no-import and global state, fetch hook is amazing.
how can i fetch the language file remotely while the app is init
👍
locAl
I Have a question if you could help
I set custom domains for each locale (example.fr…) but it doesn’t work out the box are there extra steps like nginx configs? I am using laravel forge to manage the server
The i18n docs seem to miss a step
Do you have a video for nuxt3 authentication feature using mongoose and pinia?
Great content bro
for only usd99/mo
Man, it’s like you’re always one step ahead of me! xD Last week I started rebuilding my portfolio with Nuxt + Storyblok, using your videos as main reference, and I was already considering translating it to different languages when WHAAM! This video comes out xD
Maybe it’s just me, but it feels like slowying the video’s pace would help grasping the content better. I had to go back several times to properly understand what was being taught. I guess I could have slowed it down manually myself too xP
Great vid, I should really start using Storyblok and i18n in my own projects, it's long overdue.
Good to know this 👍👍