.md

Learning path

Welcome to dcupl. This guide maps out your learning journey from your first query to building production applications.

Total time to production-ready: ~90 minutes


Your learning path

1. Quick start

Time: 5 minutes | Goal: Write your first code

Start here: install the SDK and run a working query. New to dcupl? Read the Introduction first (5 minutes).

Topic Description
Quick start Install, define model, load data, query - in 30 lines

After this section you will have:

  • A working dcupl query
  • Understanding of the basic API pattern
  • Confidence to explore further

2. First app tutorial

Time: 15 minutes | Goal: Build a complete application

Step-by-step tutorial that expands the Quick Start pattern into a small application.

Topic Description
Build your first dcupl application Complete walkthrough: models, data, queries, filters, facets

After this section you will know:

  • How to define models with typed properties
  • How to load and query data
  • How to filter with multiple conditions
  • How to get facet counts for filter UIs

3. Product catalog tutorial

Time: 25 minutes | Goal: Build a real-world feature

Apply your knowledge to build a common pattern: faceted product navigation.

Topic Description
Build a Product Catalog Faceted search, price filters, multiple brands, sorting, a reusable filter manager

After this section you will know:

  • How to build faceted navigation with dynamic counts
  • How to combine multiple filter conditions
  • How to handle price ranges and multi-select filters
  • Patterns used in production e-commerce applications

4. Choose your framework

Time: Variable | Goal: Integrate with your stack

Framework-specific guides with best practices, hooks, and patterns.

React Integration Guide

  • Custom hooks for dcupl state
  • Async data loading patterns
  • TypeScript integration
  • Real-time updates

Vue Integration Guide

  • Composables for dcupl
  • Reactive data with refs
  • Vue 3 Composition API
  • Real-time updates

There is no Angular guide yet. The SDK is framework-agnostic and works in Angular like in any other framework: start with the Quick start.


5. Core concepts deep dive (optional)

Time: 30 minutes | Goal: Master the fundamentals

Understand each concept in depth to build anything.

Topic Time Description
Core Concepts Overview 5 min The three core concepts and how they connect
Models 5 min Schema definition, properties, and references
Lists 5 min Creating and managing queryable views
Query 5 min The query interface in detail

After this section you will know:

  • All property types and when to use each
  • How to model relationships between data
  • How to create multiple filtered views
  • All query capabilities available to you

6. Concepts overview (optional)

Time: 15 minutes | Goal: Understand the architecture

Learn how the pieces fit together. For what dcupl is and when to use it, see the Introduction.

Topic Description
Architecture SDK packages, execution contexts, integration patterns
Data flow How data moves through the dcupl pipeline

After this section you will know:

  • The difference between the SDK and CLI (free) and the Console (optional)
  • How SDK, Loader, and Console work together
  • Where queries execute (browser vs server)
  • The JSON-first configuration approach

Quick reference

For every common call (lifecycle, lists and queries, analysis functions, updates, events) on one page, see the Quick reference.



Need help?