Getting Started
This guide walks you through installing the Apleno Designer extension, creating your first project, and running a preview of your app.
Prerequisites
- Visual Studio Code 1.97.0 or newer
- R and/or Python installed on your machine (depending on which language you plan to use)
Installation
Install the Apleno Designer extension from the VSCode marketplace or by loading
the .vsix package directly:
- Open VSCode.
- Go to the Extensions view (
Ctrl+Shift+X). - Search for Apleno and click Install.
Once installed, VSCode will automatically associate .ppro, .pseq, and
.pgui files with their respective custom editors.
Creating Your First Project
Using the Command Palette
The fastest way to start is with the built-in project initializer:
- Open the Command Palette (
Ctrl+Shift+P). - Type and select
Apleno: Create new project. - Choose a folder: either your current workspace folder or a new one via the folder picker.
The command creates the following files:
your-folder/
├── project.ppro # Project settings
├── main.pseq # Main workflow sequence
└── .vscode/
├── launch.json # Debug configuration for running the app
└── apleno.json # Language runtime paths (R/Python/Conda)
VSCode will open the folder as a workspace if it wasn't already.
Creating Files Manually
You can also create individual files using the Command Palette:
| Command | Creates |
|---|---|
Apleno: Create new Project file |
A new .ppro file |
Apleno: Create new Sequence file |
A new .pseq file |
Apleno: Create new Interface file |
A new .pgui file |
Project Structure
A typical Apleno Designer project looks like this:
my-app/
├── project.ppro # Project configuration
├── main.pseq # Entry-point workflow
├── welcome.pgui # A GUI screen
├── analysis.R # An R script
├── processing.py # A Python script
├── assets/
│ └── logo.png
└── .vscode/
├── launch.json
└── apleno.json
There is no rigid folder layout; you can organise your .pseq, .pgui, and
script files however you like.
Opening the Editors
Double-clicking any of the three file types opens the matching custom editor:
.ppro→ Project Editor.pseq→ Workflow Editor.pgui→ Interface Editor
To open a file as plain text instead, right-click it in the Explorer and choose Open With... → Text Editor.
Configuring Language Runtimes
Before you can preview your app, you need to tell Apleno Designer where your R or Python interpreter lives.
Open the Command Palette and run one of:
| Command | Purpose |
|---|---|
Apleno: Choose R path for preview |
Point to your R.exe / R binary |
Apleno: Choose Python path for preview |
Point to your python.exe / python binary |
Apleno: Choose Conda path for preview |
Point to a Conda environment |
The chosen paths are saved in .vscode/apleno.json inside your workspace.
Running a Preview
Once your project has at least a .ppro file and a starting sequence:
- Open the Command Palette and run
Apleno: Run preview, or - Press
F5(if theaplenodebug configuration is active).
What happens:
- The extension checks for the Apleno Runtime. If it is not installed, it offers to download it automatically.
- If an update is available, you will be prompted to install it.
- The app launches and opens your app.
Next Steps
- Project Editor: configure your app name, output folder, CSS, and more.
- Workflow Editor: build the execution sequence.
- Interface Editor: design your GUI screens.
- Running & Previewing: advanced runtime configuration.