Skip to content

# Create your first flow

Now that pgflow is installed, let’s create a simple hello world flow that demonstrates the core concepts.

Our flow will:

1. Take a person’s first name and last name as input
2. Format a full name
3. Create a personalized greeting

Prerequisites

- Completed the pgflow installation
- Basic understanding of TypeScript

## Creating a Simple Greeting Flow

Section titled “Creating a Simple Greeting Flow”

1. ### Set up your project structure

   Section titled “Set up your project structure”

   First, create a directory for your flow:

       mkdir -p supabase/functions/_flows

   - Directory
     supabase
     - Directory
       functions
       - Directory
         _flows
         - greet_user.ts

2. ### Create the flow definition

   Section titled “Create the flow definition”

   Create a file called `supabase/functions/_flows/greet_user.ts` with this content:

   supabase/functions/_flows/greet_user.ts

       import { Flow } from 'npm:@pgflow/dsl';
       type Input = {  first_name: string;  last_name: string;};
       export default new Flow<Input>({  slug: 'greet_user',})  .step(    { slug: 'full_name' },    (input) => `${input.run.first_name} ${input.run.last_name}`  )  .step(    { slug: 'greeting', dependsOn: ['full_name'] },    (input) => `Hello, ${input.full_name}!`  );

Key Concepts

- input.run: Contains the original flow input, accessible in every step
- step slugs: Unique identifiers for each step
- dependsOn: Specifies which steps must complete before a step can run
- JSON serialization: All inputs and outputs must be JSON-serializable

How pgflow works Learn how pgflow executes workflows behind the scenes
Understanding flows Learn how flows work, from syntax to execution