Skip to main content

Initialize Frontend

Initialize a Frontend Application Using the SOKit Initializer​

In addition to backend templates, the SOKit Initializer also provides templates to kickstart frontend applications using the SOKit UI framework.

Step 1: Open the Initializer​

Navigate to the SOKit Initializer web interface by visiting:

http://dev.strategyobject.com:8888/initializer/

Here, you’ll be able to generate a new frontend project based on available templates.

Step 2: Select a Frontend Template​

From the template list, select the "SOKitUI-Empty" template.

Complete the configuration fields on the right-hand side of the interface with the relevant project details. These may include the application upper-case name, lower-case name, and other metadata.

Some fields may be pre-filled with default values, but you can customize them as needed.

Initializer Website

Step 3: Generate and Extract the Project​

Click the Generate Template button. A ZIP archive containing the initialized project will be downloaded to your computer.

Once downloaded:

  1. Extract the archive to your preferred workspace directory.
  2. Open the extracted folder using your IDE or terminal.

Your project structure will resemble the following:

Project Structure

You can rename the folder to match your project name, but it's not mandatory.

Step 4: Start Developing​

Your frontend project is pre-configured with the essential dependencies and configuration needed to get started immediately.

From here, you can:

  • Install any additional dependencies using your package manager (e.g., pnpm install)
  • Run the application in development mode
  • Customize the UI components
  • Build the application for production deployment

In the upcoming sections of the Frontend documentation, we’ll walk through how to configure, run, and extend the application to match the needs of our specific use case.