Dynamic Framework

React component framework specialized for financial applications, built on Bootstrap 5 and optimized for micro frontends with Modyo platform.

Version 2.0 Available

Dynamic UI 2.0 brings a new visual language, Lucide icons, and 8 new components.

• See what's new in v2.0
• Migration guide

Technical Features

Components

• 30+ React components specialized for banking
• Design system based on Bootstrap 5
• Full TypeScript support
• WCAG 2.1 accessibility integrated

Architecture

• Micro Frontends with Module Federation
• API-first design
• Lazy loading and code splitting
• State management with Context API

Technical Documentation

Architecture

• Technical Overview - Architecture, technologies and design patterns

Getting Started

• Installation - Environment setup
• First App - Step-by-step tutorial
• Project Structure - Project organization

Development

• Components - Catalog and APIs
• React Patterns - Hooks and patterns
• API Integration - Backend connectivity
• Widgets - Modular components
• Experiences - Pre-built templates

Customization

• Theming - Variables and themes
• Styling - CSS and SCSS
• Extending - Custom components

Modyo Integration

Dynamic Framework is automatically included when creating applications with Dynamic Minimal Theme in Modyo. See customization guide for UI customization.

Installation

Modyo CLI

npx @modyo/cli@latest get dynamic-react-base-template my-app
cd my-app
npm install
npm start

CDN

<!-- CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@dynamic-framework/ui-react@1.27.0/dist/css/dynamic-ui.css">

<!-- JavaScript (optional) -->
<script src="https://cdn.jsdelivr.net/npm/@dynamic-framework/ui-react@1.27.0/dist/js/bootstrap.min.js"></script>

NPM Package

npm install @dynamic-framework/ui-react

Requirements:

• Node.js v20+
• NPM 10.x+

For React component integration, see React guide.

Technical Resources

Documentation

• Storybook Components (opens new window) - Interactive catalog
• API Reference (opens new window) - API documentation
• NPM Package (opens new window) - Package registry

Development Tools

• Modyo CLI (opens new window) - Command line tool

Technical Support

• Support (opens new window) - Technical support

Technology Stack

• React: 18+ with Hooks and Suspense
• TypeScript: Full static typing
• Bootstrap: 5.3+ customizable
• Build Tools: Webpack 5, Vite support
• Testing: Jest, React Testing Library
• Linting: ESLint, Prettier