CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-theia--core

Core framework for building cloud and desktop IDE applications using modern web technologies with TypeScript and dependency injection.

Pending
Overview
Eval results
Files

application-framework.mddocs/

Application Framework

Theia's application framework provides frontend and backend application infrastructure with lifecycle management, contribution points, and cross-platform support for building extensible IDE applications.

Capabilities

Frontend Application

Main frontend application class managing client-side application lifecycle and shell integration.

/**
 * Main frontend application managing browser/electron client
 */
class FrontendApplication {
    /** Application shell containing widget layout */
    readonly shell: ApplicationShell;
    
    /**
     * Start the frontend application
     * @returns Promise that resolves when application starts
     */
    start(): Promise<void>;
    
    /**
     * Stop the frontend application
     */
    stop(): void;
    
    /**
     * Configure the application before starting
     */
    configure(): void;
}

/**
 * Service token for FrontendApplication
 */
const FrontendApplication: symbol;

Frontend Application Contribution

Extension point for participating in frontend application lifecycle.

/**
 * Extension point for frontend application lifecycle
 */
interface FrontendApplicationContribution {
    /**
     * Initialize the contribution before application configuration
     */
    initialize?(): void;
    
    /**
     * Configure the application during startup
     * @param app - Frontend application instance
     */
    configure?(app: FrontendApplication): void;
    
    /**
     * Called when application starts
     * @param app - Frontend application instance
     */
    onStart?(app: FrontendApplication): void;
    
    /**
     * Called when application stops
     * @param app - Frontend application instance  
     */
    onStop?(app: FrontendApplication): void;
    
    /**
     * Called when application state changes
     * @param state - New application state
     */
    onStateChanged?(state: FrontendApplicationState): void;
}

/**
 * Frontend application state
 */
interface FrontendApplicationState {
    readonly state: 'init' | 'starting' | 'started' | 'stopping' | 'stopped';
}

/**
 * Service token for FrontendApplicationContribution
 */
const FrontendApplicationContribution: symbol;

Usage Example:

import { injectable } from "@theia/core";
import { FrontendApplication, FrontendApplicationContribution } from "@theia/core/lib/browser";

@injectable()
export class MyFrontendContribution implements FrontendApplicationContribution {
    
    initialize(): void {
        console.log('Initializing my extension');
    }
    
    configure(app: FrontendApplication): void {
        console.log('Configuring frontend application');
    }
    
    onStart(app: FrontendApplication): void {
        console.log('Frontend application started');
        // Add initial widgets, register handlers, etc.
    }
    
    onStop(app: FrontendApplication): void {
        console.log('Frontend application stopping');
        // Cleanup resources
    }
    
    onStateChanged(state: FrontendApplicationState): void {
        console.log(`Application state: ${state.state}`);
    }
}

Backend Application

Main backend application class managing server-side application lifecycle and HTTP server.

/**
 * Main backend application managing Node.js server
 */
class BackendApplication {
    /**
     * Use Express middleware
     * @param handlers - Express middleware handlers
     */
    use(...handlers: express.Handler[]): void;
    
    /**
     * Start the backend server
     * @param port - Optional port number
     * @returns Promise that resolves when server starts
     */
    start(port?: number): Promise<void>;
    
    /**
     * Stop the backend server
     */
    stop(): void;
    
    /**
     * Configure the server
     */
    configure(): void;
}

/**
 * Service token for BackendApplication
 */
const BackendApplication: symbol;

Backend Application Server

Server interface for backend applications with configuration options.

/**
 * Backend application server configuration
 */
interface BackendApplicationServer {
    /**
     * Start server with configuration
     * @param config - Server configuration
     * @returns Promise that resolves when server starts
     */
    start(config?: BackendApplicationConfiguration): Promise<void>;
    
    /**
     * Stop the server
     */
    stop(): void;
}

/**
 * Backend server configuration options
 */
interface BackendApplicationConfiguration {
    /** Server port */
    port?: number;
    
    /** Server hostname */
    hostname?: string;
    
    /** SSL certificate */
    ssl?: {
        key: string;
        cert: string;
    };
    
    /** Request timeout in milliseconds */
    requestTimeout?: number;
    
    /** Maximum request size */
    maxRequestSize?: string;
}

/**
 * Service token for BackendApplicationServer
 */
const BackendApplicationServer: symbol;

Usage Example:

import { BackendApplication } from "@theia/core/lib/node";
import express from "express";

// Create backend application
const app = new BackendApplication();

// Add middleware
app.use(express.json());
app.use(express.static('public'));

// Add custom routes
app.use('/api', (req, res) => {
    res.json({ message: 'Hello from Theia backend!' });
});

// Start server
app.start(3000).then(() => {
    console.log('Backend server started on port 3000');
});

CLI System

Command-line interface support for backend applications.

/**
 * CLI contribution interface for adding command-line options
 */
interface CliContribution {
    /**
     * Configure CLI options
     * @param yargs - Yargs instance for configuration
     */
    configure(yargs: any): void;
    
    /**
     * Set default values for CLI arguments
     * @param argv - Parsed CLI arguments
     * @returns Modified arguments
     */
    setArguments?(argv: any): any;
}

/**
 * CLI manager for handling command-line arguments
 */
interface CliManager {
    /**
     * Parse command-line arguments
     * @param args - Raw command-line arguments
     * @returns Parsed arguments
     */
    parseArgs(args: string[]): Promise<any>;
    
    /**
     * Get parsed CLI arguments
     * @returns Current CLI arguments
     */
    getArgs(): any;
}

/**
 * Service tokens
 */
const CliContribution: symbol;
const CliManager: symbol;

Usage Example:

import { injectable } from "@theia/core";
import { CliContribution } from "@theia/core/lib/node";

@injectable()
export class MyCliContribution implements CliContribution {
    
    configure(yargs: any): void {
        yargs.option('my-option', {
            description: 'My custom CLI option',
            type: 'string',
            default: 'default-value'
        });
        
        yargs.option('verbose', {
            alias: 'v',
            description: 'Enable verbose logging',
            type: 'boolean'
        });
    }
    
    setArguments(argv: any): any {
        // Process and validate arguments
        if (argv.verbose) {
            process.env.LOG_LEVEL = 'debug';
        }
        
        return argv;
    }
}

Extension Modules

Theia extension module system for organizing and loading functionality.

/**
 * Extension module configuration in package.json
 */
interface TheiaExtension {
    /** Frontend module path */
    frontend?: string;
    
    /** Frontend-only module path (browser only) */
    frontendOnly?: string;
    
    /** Electron frontend module path */
    frontendElectron?: string;
    
    /** Backend module path */
    backend?: string;
    
    /** Backend-only module path (Node.js only) */
    backendOnly?: string;
    
    /** Electron backend module path */
    backendElectron?: string;
    
    /** Preload module path */
    preload?: string;
    
    /** Frontend preload module path */
    frontendPreload?: string;
    
    /** Frontend-only preload module path */
    frontendOnlyPreload?: string;
}

/**
 * Extension package.json configuration
 */
interface ExtensionPackage {
    /** Extension modules */
    theiaExtensions: TheiaExtension[];
    
    /** Re-exported dependencies */
    theiaReExports?: {
        [env: string]: {
            [type: string]: string[];
        };
    };
}

Application State Management

Application state tracking and lifecycle management.

/**
 * Application state enumeration
 */
enum ApplicationState {
    init = 'init',
    starting = 'starting', 
    started = 'started',
    stopping = 'stopping',
    stopped = 'stopped'
}

/**
 * Application state change event
 */
interface ApplicationStateChangeEvent {
    /** Previous state */
    readonly previousState: ApplicationState;
    
    /** New current state */
    readonly newState: ApplicationState;
}

/**
 * Application state service
 */
interface ApplicationStateService {
    /** Current application state */
    readonly state: ApplicationState;
    
    /** Event fired when state changes */
    readonly onStateChanged: Event<ApplicationStateChangeEvent>;
    
    /** True if application has reached started state */
    readonly reachedState: {
        started: Promise<void>;
        stopped: Promise<void>;
    };
}

Environment-Specific Features

Browser Environment

Browser-specific application features and utilities.

namespace environment {
    /** True if running in browser */
    const isBrowser: boolean;
    
    /** True if running in Electron */
    const isElectron: boolean;
    
    /** Browser user agent detection */
    function isChrome(): boolean;
    function isFirefox(): boolean;
    function isSafari(): boolean;
    
    /** Feature detection */
    function isBasicWasmSupported(): boolean;
}

Electron Environment

Electron-specific application features and integration.

/**
 * Electron-specific application extensions
 */
interface ElectronApplication extends FrontendApplication {
    /** True if running in Electron */
    readonly isElectron: boolean;
    
    /** Access to Electron APIs */
    readonly electron: any;
}

Types

/**
 * Express-related types
 */
namespace express {
    interface Request {
        // Express request object
        params: any;
        query: any;
        body: any;
        headers: any;
    }
    
    interface Response {
        // Express response object
        json(obj: any): Response;
        send(body: any): Response;
        status(code: number): Response;
    }
    
    interface NextFunction {
        // Express next function
        (err?: any): void;
    }
    
    interface Handler {
        // Express middleware handler
        (req: Request, res: Response, next: NextFunction): void;
    }
}

/**
 * Express handler type for middleware
 */
type ExpressHandler = express.Handler;

/**
 * Application configuration
 */
interface ApplicationConfiguration {
    /** Application name */
    applicationName: string;
    
    /** Default theme */
    defaultTheme?: string;
    
    /** Default icon theme */
    defaultIconTheme?: string;
    
    /** Additional preferences */
    preferences?: { [key: string]: any };
}

/**
 * Application info interface
 */
interface ApplicationInfo {
    /** Application name */
    readonly name: string;
    
    /** Application version */
    readonly version: string;
    
    /** Build timestamp */
    readonly buildTimestamp: string;
}

Install with Tessl CLI

npx tessl i tessl/npm-theia--core

docs

application-framework.md

commands.md

dependency-injection.md

events-messaging.md

index.md

keybindings.md

menus.md

preferences-configuration.md

resources-files.md

widgets-ui.md

tile.json