Ivy Framework Documentation

repository·development·Indexed 19 days ago

https://github.com/ivy-interactive/ivy-framework

A modern C# framework for building reactive, full-stack web applications without writing HTML, CSS, or JavaScript. Ivy uses a server-side state model with a React-based rendering engine and provides a dedicated CLI tool, Ivy.Console, for project initialization, hot-reloading, and debugging. The framework includes a variety of authentication integrations such as Auth0, Clerk, GitHub, Microsoft Entra, Authelia, Sliplane, and Supabase.

Tokens
783.7K
Snippets
2.1K
Records
2.7K
Agent score
64%

What's inside Ivy Framework

  1. Overview of Ivy Widgets

    development
    Ivy provides a comprehensive set of strongly-typed widgets for building user interfaces in pure C#. Widgets are organized into several functional categories including Common, Inputs, Primitives, Layouts, Effects, Charts, and Advanced components. This modular approach allows developers to compose complex UIs using simple, declarative syntax.
  2. Overview of Ivy Hooks

    development

    Ivy provides several categories of hooks to manage different aspects of component logic:

    Core Hooks

    • UseState: Add local state to your components.
    • UseEffect: Perform side effects in your components.

    Performance Hooks

    • UseMemo: Memoize expensive calculations to optimize performance.

    Other Hooks

    • UseRef: Store mutable values that persist across renders.

    Streaming Hooks

    • UseStream: Create a stream to push real-time data to frontend widgets.
  3. Compare Reflex and Ivy graphing capabilities

    development

    The framework provides two ways to handle data visualization: Reflex (a Python-based wrapper around Recharts, Plotly, and Matplotlib) and Ivy (a C#-based fluent builder API).

    Chart TypeReflexIvy
    Area Chartrx.recharts.area_chartAreaChart
    Bar Chartrx.recharts.bar_chartBarChart
    Line Chartrx.recharts.line_chartLineChart
    Pie Chartrx.recharts.pie_chartPieChart
    Scatter Chartrx.recharts.scatter_chartNot supported
    Radar Chartrx.recharts.radar_chartNot supported
    Radial Barrx.recharts.radial_bar_chartNot supported
    Funnel Chartrx.recharts.funnel_chartNot supported
    Composed Chartrx.recharts.composed_chartNot supported
    Error Barrx.recharts.error_barNot supported
    Plotlyrx.plotlyNot supported
    Matplotlibpyplot (via reflex-pyplot)Not supported
  4. Integrate Auth0 authentication with Ivy Framework

    development

    Use the Ivy.Auth.Auth0 package to provide Auth0-based user authentication and identity management within your Ivy applications. This package allows you to leverage Auth0's identity services while maintaining the pure C# reactive development model of the Ivy Framework.

    For detailed setup, configuration, and implementation steps, refer to the official Ivy Authentication Documentation.

  5. Use the Calendar widget

    development

    The Calendar widget allows you to display and manage events across multiple views (Month, Week, Day, and Agenda). It can be built inside views or layouts and integrates with state to manage event data. It supports built-in navigation, drag-and-drop event moving, and click interactions.

    new Calendar(
        new CalendarEvent()
            .EventId("1").Title("Team Standup")
            .Start(DateTime.Today.AddHours(9))
            .End(DateTime.Today.AddHours(9).AddMinutes(30)),
        new CalendarEvent()
            .EventId("2").Title("Sprint Planning")
            .Start(DateTime.Today.AddDays(1).AddHours(10))
            .End(DateTime.Today.AddDays(1).AddHours(12))
            .Color("Blue")
    )