Development and Usage

See following guidelines:

• uuAppg01Devkit Documentation
• uuSubApp Instance Descriptor
• UU5 Library Project

Using uu5g04

Usage in applications created by other tools, such as create-react-app, is also possible. In such case the uu5g04 will be typically bundled into the main application file.

• The application must have dependency on uu5g04 in its package.json (dependencies field).
• Next to package.json must exist .npmrc file, where it is necessary to write registry=https://repo.plus4u.net/repository/npm/
• Run npm install
• Assets of uu5g04 (color schemas, images of flags, ...) must be available at some URL, i.e. assets folder must be copied from node_modules/uu5g04/dist/assets/ somewhere to public/ folder. Afterwards, the path to the assets parent folder must be set into UU5.Environment.basePath (see example below).
• Submodules uu5g04-bricks, ..., must be imported using import "uu5g04/bricks" - slash character is used instead of dash.

Example below renders a blue button and a language selector, showcasing that importing uu5g04/bricks works and that assets (blue color schema, flags) are loaded properly in browser.

window.UU5 = {
  Environment: {
    basePath: process.env.PUBLIC_URL // assuming ./node_modules/uu5g04/dist/assets/* is copied to ./public/assets/*
  }
};

// src/index.js
import './uu5-environment';
import React from 'react';
...

// src/App.js
import React from 'react';
import './App.css';
import UU5 from 'uu5g04';
import 'uu5g04/bricks';

function App() {
  return (
    <UU5.Bricks.Container>
      <UU5.Bricks.Button colorSchema="blue">
        <UU5.Bricks.Lsi lsi={{en: "blue button", cs: "modré tlačítko"}} />
      </UU5.Bricks.Button>
      <UU5.Bricks.LanguageSelector displayedLanguages={["en", "cs"]} />
    </UU5.Bricks.Container>
  );
}

export default App;

If using uu5strings, only components that are already loaded in the page can be used. I.e. if you want to use e.g. <UU5.CodeKit.CodeViewer ... /> (which is in uu_codekitg01 library) in uu5string, it is necessary that the application imports uu_codekitg01 directly. On-demand loading of components would demand presence of SystemJS loader and more complex configuration - in such case it is advised to use uu_appg01_devkit tooling.