DEV Community

Peter + AI
Peter + AI

Posted on

🌍 Uniface Localization Series (Part 1): Mastering Date & Time in Web Apps πŸ“…

As developers, we all know the pain: You build a sleek web app, deploy it globally, and suddenly your users are confused. Why? Because 01/02/2023 means January 2nd to some, but February 1st to others! πŸ˜΅β€πŸ’«

In the world of Uniface web development, handling Date, Time, and DateTime formats correctly based on the user's locale is key to a great User Experience (UX).

I recently dug into a fantastic sample provided by the Rocket Software community that solves this elegantly using a Dynamic Server Page (DSP). Let's kick off this series by looking at the architecture! πŸš€


πŸ—οΈ The Architecture

The sample project, Web sample: Date Time Localization, is built on Uniface 10.4.01. It’s not just about translating text; it's about formatting data.

Here is the high-level flow of the application:

  • Initialization: The web page loads with a default locale (English). Dates look like MM/DD/YYYY. πŸ‡ΊπŸ‡Έ
  • User Interaction: A dropdown menu allows the user to pick a language (e.g., German, French).
  • The Trigger: This isn't just a CSS change! Selecting a language triggers a Uniface interaction.
  • The Magic: The DSP processes the locale change and re-renders the data. Suddenly, that same date appears as DD.MM.YYYY. πŸ‡©πŸ‡ͺ

πŸ› οΈ The Tech Stack

What makes this sample cool is how it blends Uniface logic with standard web tech. The readme file highlights exactly what's under the hood:

  • Backend: Uniface DSP (LOCALE_DATETIME component) handles the heavy lifting.
  • Frontend: A mix of JavaScript, HTML, and CSS manages the UI updates.
  • Configuration: It uses standard web runtime configuration to handle the session's locale settings.

🎯 Why this matters

For us software engineers, this separates presentation from logic. You don't want to write if (locale == 'DE') statements everywhere in your code. Instead, this approach lets the Uniface framework handle the formatting rules centrally.

In the next post, we will look at how the data is actually stored and where those localized strings come from (hint: it involves XML libraries!). 🧐

πŸ“₯ Source:

You can find the original sample here:

Web sample: Date Time Localization by Peter Beugel

Stay tuned for Part 2! πŸ‘‹

Top comments (0)