Skip to content

Conversation

@jsundai
Copy link
Contributor

@jsundai jsundai commented Nov 13, 2025

What does this PR do?

https://temporal-documentation-git-tutorial-layout-money-transfe-0fc0c4.preview.thundergun.io/build-your-first-basic-workflow/build-your-first-workflow

Notes to reviewers

files changed include new components for interaction and sdk boxed logos
wip (TODO: make light mode friendly)
aiming for: concise + engaging, dev-to-dev tone, consistent interactions, progressive disclosure.
next iteration: can include sdk box logos

@jsundai jsundai requested a review from a team as a code owner November 13, 2025 20:00
@vercel
Copy link

vercel bot commented Nov 13, 2025

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Review Updated (UTC)
temporal-documentation Ready Ready Preview, Comment Jan 20, 2026 8:20pm

Request Review

@jsundai jsundai changed the title tutorial layout money transfer experimentation build your first basic workflow experimentation Nov 13, 2025
@flippedcoder
Copy link
Contributor

A couple of general questions.

  • Are we adding all of the UI components because they'll be used on future content like this or is it more specific for this guide? It all looks really great, but I think it looks different from the rest of the site and it threw me off at first.
  • It seemed like this example is already on the learn site. Is this supposed to be migrating the content over or is it supposed to something new?

Copy link
Contributor

@lennessyy lennessyy left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is gorgeous! Great work. My comments are aimed at user-friendliness but may make it less pretty

id: build-your-first-workflow
title: Build Your First Workflow
sidebar_label: "Part 1: Build Your First Workflow"
hide_table_of_contents: true
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

i know that the layout is well designed and we could use the vertical space, but i still think this is a long enough tutorial that it'd be beneficial to have the TOC. It's easier for users to make sense of whey are doing in the context of the whole project. Right now, they can't see more than the H2 heading they are in.

Copy link
Contributor

@brianmacdonald-temporal brianmacdonald-temporal left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I feel like we could use some text explanation for each of the code blocks. Maybe Point out specifically what the workflow is calling, and how that relates to the activities, and point out the Retry Policy details.

jsundai and others added 2 commits January 5, 2026 11:11
….mdx

Co-authored-by: Milecia McG <47196133+flippedcoder@users.noreply.github.com>
….mdx

Co-authored-by: Milecia McG <47196133+flippedcoder@users.noreply.github.com>
…ated and added light and dark mode reimburse diagram, max width 60
@github-actions
Copy link
Contributor

github-actions bot commented Jan 15, 2026

The Temporal Application will consist of the following pieces:

1. **A Workflow** written in your programming language of choice and your installed Temporal SDK in that language. A Workflow defines the overall flow of the application.
2. **An Activity** is a function or method that does specific operation - like withdrawing money, sending an email, or calling an API. Since these operations often depend on external services that can be unreliable, Temporal automatically retries Activities when they fail.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
2. **An Activity** is a function or method that does specific operation - like withdrawing money, sending an email, or calling an API. Since these operations often depend on external services that can be unreliable, Temporal automatically retries Activities when they fail.
2. **An Activity** is a function or method that does a specific operation - like withdrawing money, sending an email, or calling an API. Since these operations often depend on external services that can be unreliable, Temporal automatically retries Activities when they fail.


</SdkTabs.Java>

<SdkTabs.TypeScript>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Minor thing, but could we have the text wrap button in here like we have on other code blocks for all of these on the page? Example

throw new ApplicationFailure(`Withdrawal failed. Error: ${withdrawErr}`);
}

//Execute the deposit Activity
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
//Execute the deposit Activity
// Execute the deposit Activity

import type { PaymentDetails } from './shared';

// highlight-next-line
export async function moneyTransfer(details: PaymentDetails): Promise<string> { // Workflow Definition: an exported async function
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nit: could the // Workflow Definition: an exported async function go above // highlight-next-line to keep it consistent with all the other comments?

let withdrawResult: string;
try {
// highlight-next-line
withdrawResult = await withdraw(details); // Executes Activity via proxy and waits for result
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nit: could // Executes Activity via proxy and waits for result go above // highlight-next-line to keep it consistent with all the other comments?

</div>
}>

Now that your Worker is running and polling for tasks, you can start a Workflow Execution.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I might have missed it, but was there somewhere we told the users they would need 3 terminals? It confused me for a second that the first terminal we talked about under the text is Terminal 3.

</SdkTabs>
</div>
<div style={{marginTop: '2rem', padding: '1rem', background: 'rgba(16, 185, 129, 0.1)', borderRadius: '0.5rem'}}>
<strong>Expected Success Output:</strong>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could we put which terminal this should show in? It looks like Terminal 2.


## Check the Temporal Web UI

<SetupStep code={
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nit: could this open in a new tab instead of the docs one?

const bank = new BankingService('bank2.example.com');

// Comment out this working line:
// return await bank.deposit(details.targetAccount, details.amount, details.referenceId);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It might just be a formatting thing, but this looks different than the repo and the comment/uncomment snippets are in a different order (the good code is on top of the bug code).

Try this advanced scenario of compensating transactions.


1. **Modify the retry policy** in `workflows.py` to only retry 1 time
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Do we only want to highlight Python here or all the languages?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants