Rob Lahoda • Codepen: Multilingual Calendar/Clock

rob@roblahoda.com

About This Project


Codepen Link

Platform Codepen
Key Technology Javascript, Flexbox, AJAX

This is a multilingual clock and calendar built on Javascript. It allows the user to select between English, French, and Spanish languages for the interface, to change the start day of the week between Sunday and Monday, and to change the date order from Month/Day/Year to Day/Month/Year through reordering the Flex order.

It is fully responsive, including changing layout to accomodate smaller viewport sizes. I designed the project to increase my understanding of Javascript, and I developed it entirely in vanilla Javascript. The project uses BEM naming for the structure and SASS for the stylesheet.

To populate the interface content, the project uses an AJAX call to a JSON file hosted on Github that includes translations for all textual content. If the AJAX call fails, there is a local fallback in the project. On Github there are directions for creating a pull request to add additional languages, which allowed user Jamesxv7 to add Spanish.

Screenshot
]