# Learn the API

Now that we've created a host application, loaded a few modules and registered routes and navigation items, let's delve into the APIs provided by this shell.

In an effort to optimize the development experience, Squide can be bootstrapped in development or production mode:

import { FireflyRuntime, ConsoleLogger, type LogLevel } from "@squide/firefly";

const runtime = new FireflyRuntime({
    mode: "production"
});

By default, the Runtime mode is development.

Squide includes a built-in logging feature that integrates with the FireflyRuntime class and the useLogger hook.

First, register your own custom logger by implementing the Logger interface or register Squide built-in ConsoleLogger:

import { FireflyRuntime, ConsoleLogger, type LogLevel } from "@squide/firefly";

const runtime = new FireflyRuntime({
    loggers: [new ConsoleLogger(LogLevel.debug)]
});

Then, log entries from any parts of your federated application with the useLogger hook:

import { useLogger } from "@squide/firefly";

const logger = useLogger();

logger.debug("Hello", { world: "!" });

The logger is also available from the FireflyRuntime instance.

It's crucial that the parts of a federated application remains loosely coupled. To help with that, Squide offers a built-in Event Bus.

First, listen to an event with the useEventBusListener hook:

import { useCallback } from "react";
import { useEventBusListener } from "@squide/firefly";

const handleFoo = useCallback((data, context) => {
    // do something...
}, []);

useEventBusListener("foo", handleFoo);

Then, dispatch an event from anywhere with the useEventBusDispatcher hook:

import { useEventDispatcher } from "@squide/firefly";

const dispatch = useEventBusDispatcher();

dispatch("foo", "bar");

You can use the event bus to enable various communication scenarios, such as notifying components of state changes, broadcasting messages across modules, or triggering actions based on specific events.

The event bus is also available from the FireflyRuntime instance.

Most of our applications (if not all) will eventually require the user to authenticate. To facilitate this process, the Squide FireflyRuntime class accepts a sessionAccessor function. Once the shell registration flow is completed, the function will be made accessible to every module of the application.

First, define a sessionAccessor function:

import type { SessionAccessorFunction } from "@squide/firefly";
import { LocalStorageSessionManager } from "@squide/fakes";

export const sessionManager = new LocalStorageSessionManager<Session>();

const sessionAccessor: SessionAccessorFunction = () => {
    return sessionManager.getSession();
};

Then register the accessor function:

import { FireflyRuntime } from "@squide/firefly";
import { sessionAccessor } from "./session.ts";

const runtime = new FireflyRuntime({
    sessionAccessor
});

Finally, access the session from any parts of the application with the useSession hook:

import { useSession } from "@squide/firefly";

const session = useSession();

Or determine whether or not the user is authenticated with the useIsAuthenticated hook:

import { useIsAuthenticated } from "@squide/firefly";

const isAuthenticated = useIsAuthenticated();

The session is also available from the FireflyRuntime instance.

To keep Squide lightweight, not all functionalities should be integrated as a core functionality. However, to accommodate a broad range of technologies, a plugin system has been implemented to fill the gap.

Plugins can be registered at bootstrapping with the FireflyRuntime instance:

import { FireflyRuntime } from "@squide/firefly";
import { MyPlugin } from "@sample/my-plugin";

const runtime = new FireflyRuntime({
    plugins: [new MyPlugin()]
});

And can be accessed from any parts of the application with the usePlugin hook:

import { usePlugin } from "@squide/firefly";
import { MyPlugin } from "@sample/my-plugin";

const myPlugin = usePlugin(MyPlugin.name) as MyPlugin;

A plugin can also be retrieved from the FireflyRuntime instance.

Take a look at the fake implementations. These implementations are designed to facilitate the set up of a module isolated environment.

Explore the guides section to learn about Squide advanced features.

Be sure to read, at a minimum, the following guides:

• Setup Mock Service Worker
• Fetch initial data
• Fetch page data
• Manage shared state
• Isolate module failures
• Add authentication
• Add a shared dependency

For a comprehensive list of the Squide API, refer to the reference section.

Finally, have a look at the sample applications to see the Squide API in action.