QS
QlikScript Studio

Documentation

Quick Start

Get up and running with qlik-script-editor in under 5 minutes.

Basic Usage

The simplest way to use qlik-script-editor is to import the component and use it with default settings.

Basic Implementation
A minimal example to get you started
import React from 'react';
import QlikEditor from 'qlik-script-editor';

function App() {
  return (
    <div style={{ height: '400px' }}>
      <QlikEditor
        defaultValue="LOAD * FROM DataSource;"
        onChange={(value) => console.log(value)}
      />
    </div>
  );
}

export default App;

This creates a basic editor with Qlik script syntax highlighting and auto-completion.

Your First Script

Let's create a simple Qlik script that loads data and performs basic transformations.

Sample Qlik Script
A real-world example you can copy and paste
// Set variables for date handling
SET vToday = Today();
SET vStartOfYear = YearStart($(vToday));

// Load customer data
LOAD 
  CustomerID,
  CustomerName,
  Country,
  Region,
  Date#(RegistrationDate, 'YYYY-MM-DD') as RegistrationDate
FROM [lib://DataFiles/Customers.xlsx]
(ooxml, embedded labels, table is Customers)
WHERE Date#(RegistrationDate, 'YYYY-MM-DD') >= $(vStartOfYear);

// Load sales data and join with customers
LEFT JOIN (Customers)
LOAD 
  CustomerID,
  Sum(OrderAmount) as TotalSales,
  Count(OrderID) as NumberOfOrders,
  Max(OrderDate) as LastOrderDate
FROM [lib://DataFiles/Orders.xlsx]
(ooxml, embedded labels, table is Orders)
GROUP BY CustomerID;

// Create a calculated field for customer classification
LOAD *,
  if(TotalSales > 10000, 'VIP Customer',
     if(TotalSales > 5000, 'Premium Customer', 
        'Standard Customer')) as CustomerTier
RESIDENT Customers;

DROP TABLE Customers;

Key Features You'll Use

Syntax Highlighting
Full Qlik script syntax highlighting

Functions, keywords, strings, and comments are automatically highlighted to improve code readability and reduce errors.

Auto-completion
Intelligent code suggestions

Get suggestions for Qlik functions, field names, and common patterns as you type to speed up development.

Error Detection
Real-time validation

Catch syntax errors, typos, and common mistakes before executing your scripts.

Customizable
Tailor to your workflow

Configure themes, shortcuts, and behavior to match your development preferences.

Next Steps

Configuration
Learn how to customize the editor behavior
Configure Editor
Examples
Explore more advanced usage patterns
View Examples