R10

Overview

R10 is a library of interactive building blocks written in Elm and elm-ui that is used at Rakuten for creating user interfaces. Although the library is actively used in live projects, the code and documentation can be rough in some places due to time constraints and its tailored nature for internal use. It may be more useful as a source of information rather than a direct dependency for external projects.

Features

• Interactive building blocks for creating user interfaces
• Written in Elm and elm-ui
• Supports custom previews for improved link sharing
• Includes logos, icons, buttons, forms, and more
• Supports multi-language websites
• Provides standard header and footer components

Using an existing Elm project

If you already have an existing Elm project, you can install the R10 library by running the following command:

elm install rakutentech/r10

For more detailed instructions, refer to the provided Ellie code snippets.

Bootstrapping a new project

To start a new project using R10, you can use the fully functional project provided in the examples/pwa folder. Simply copy the project to your desired location and run the following command from its root folder:

elm make src/Main.elm --output=elm.js --debug && cd ../ && python -m SimpleHTTPServer

This will compile the application and start a local web server at http://localhost:8000. You can then preview the website in your browser.

To build optimized files for production release, run the following command:

elm make src/Main.elm --optimize --output=elm.js && cd ../ && python -m SimpleHTTPServer

The optimized files can be found in the elm-stuff/elm-starter-files/build folder.

For further information, refer to the provided elm-starter documentation and the R10 documentation.

Summary

R10 is a library of interactive building blocks written in Elm and elm-ui, used at Rakuten for creating user interfaces. While it is actively used in live projects, the code and documentation may not be polished due to time constraints. The library offers various features such as custom previews, multi-language support, and a range of components including logos, icons, buttons, and forms. Installation steps are provided for existing projects and new project bootstrapping.