DOCSEARCHbyAlgolia
Submit Docs

Piral

repository·develop·Indexed 23 days ago

https://github.com/smapiot/piral

A React-based micro frontend framework for building modular single-page applications (SPAs). It features a specification-driven architecture and a CLI for managing Piral instances and pilets. The ecosystem includes plugins and converters for integrating Blazor WASM components via piral-blazor and Aurelia components via piral-aurelia.

Tokens
206.1K
Snippets
513
Records
1.1K
Agent score
84%

What's inside piral

  1. Overview of Piral Web Components

    develop

    Piral provides several web components for integration between the Piral orchestrator, React, and other frameworks:

    ComponentPurposeUser Action
    piral-extensionDeclares an extension slot.Can use directly
    piral-slotA clean, non-visual container for frameworks that cannot reuse existing elements.Can use directly
    piral-contentA portal to render React content in non-React components.Can use directly
    piral-componentMarks an area for a micro frontend component to render.Internal (managed by Piral)
    piral-portalA non-visual anchor point for the React rendering tree.Internal (managed by Piral)

  2. Overview of Piral tooling

    develop
    Piral provides an ecosystem of tools designed to support the development of large-scale web applications using micro frontends. Currently, the available tooling includes the Piral Inspector for application inspection and a VSCode Piral extension for enhanced development within Visual Studio Code.

  3. Overview of Piral CLI

    develop
    Piral CLI is a command-line tool designed to simplify common Piral development tasks, such as building pilets, scaffolding new pilets, or debugging a Piral instance. It can be used directly as a CLI or integrated as a library. The CLI is built upon existing ecosystem tools and is extensible via a plugin system.

  4. Overview of the Piral Feed Service API

    develop

    The Piral Feed Service API is a RESTful API designed to facilitate the publishing and retrieving of pilets (modules used to transport features into a Piral instance).

    It serves two primary roles:

    1. Service-facing: Allows the Piral CLI or other applications to publish pilets.
    2. User-facing: Allows a standard Piral instance to retrieve pilets for a user from a backend.

    Beyond core pilets management, the API may include extended conformance to support standard pilets, such as managing features or providing user information.

  5. Overview of the Piral core library

    develop
    The piral package is the core library that provides a complete Piral instance. It is highly opinionated regarding the backend structure and functional usage, but it remains agnostic about the rendering layer. This allows developers to use Piral's logic while choosing their own rendering implementation or library. Layouts can be built on top of this core layer.

  6. Overview of Piral for Micro Frontends

    develop
    Piral is a React-based framework designed to help developers build modular single-page applications (SPAs) using a micro frontends architecture. Its primary goal is to simplify common tasks while allowing for deep customization of the application structure and behavior.

  7. Overview of Piral Ext

    develop

    piral-ext is a collection of standard Piral plugins that provide common Pilet API extensions. It is designed to be used alongside piral-core (which it lists as a peer dependency) to add high-level functionality to your Piral application.

    Key features provided by this package include:

    • Dashboarding: Aggregating tiles into a dashboard view.
    • Connectivity: Handling data feeds.
    • Navigation & UI: Menu integration and modal dialogs.
    • Communication: Notification support.
    • Localization: A simple translation system.

  8. Learn about Piral through external resources

    develop
    Piral has been featured in various media formats including magazine articles, videos, blog posts, and conference talks. These resources cover topics such as microfrontends, Blazor integration, React integration, and general architectural patterns.

  9. Available Piral Converter Plugin Packages

    develop
    Piral provides opt-in converter packages to integrate with various frontend frameworks and libraries. Depending on your chosen UI framework, you should install the corresponding converter package to enable Piral's features within that ecosystem.

  10. Explore Piral Tooling Packages

    develop

    Piral provides specialized tooling packages to assist with development, CLI operations, and bundling. The core tooling options include:

    • piral-cli: Provides command line interface tools for Piral development.
    • piral-cli-webpack5: Enables the use of Webpack 5.x as the standard bundler for your Piral project.

  11. Core Features of Piral

    develop

    Piral is a micro frontend framework designed for modularity and flexibility. Its core capabilities include:

    • Highly Modular & Multi-framework: While React is the primary target, Piral provides a generic API to host any framework that can attach to a DOM node.
    • Bundler Independence: Works with almost any bundler (e.g., Webpack) and supports bundle splitting.
    • Dependency Sharing: Supports both central dependency sharing (from the app shell) and distributed dependency sharing (between pilets).
    • Deployment & Development: Enables independent development and deployment of pilets. Each pilet can be deployed to a dedicated service or CDN independently of the main application.
    • Isolation: Pilets are sandboxed to prevent them from crashing the main application or other pilets. State and translations are kept in isolation.
    • Communication: Indirect communication between pilets is achieved via events or extensible components.
    • Rendering Modes: Supports build-time integration, Client-Side Rendering (CSR), and Server-Side Rendering (SSR).
    • Tooling: Includes a CLI tool for common tasks like scaffolding, building, and publishing.

  12. Choose the right Piral package for your project

    develop

    Piral is distributed as a monorepo with different packages depending on your architectural needs and UI framework requirements:

    • piral: The standard library. Use this for most typical Piral applications.
    • piral-base: The framework-independent base library. Use this if you are building a custom integration or need the core logic without framework dependencies.
    • piral-core: The React-dependent core library. Use this if your application is built specifically around React.
    • siteless: A predefined app shell designed for building siteless UIs (UIs that do not live within a traditional website structure).