From 63c36c63d40d0e2d37e7e240ffd8c9bf346f42e6 Mon Sep 17 00:00:00 2001 From: Chase Fleming <1666730+chasefleming@users.noreply.github.com> Date: Fri, 18 Oct 2024 15:15:58 -0700 Subject: [PATCH 1/4] Improve step one copy --- .../getting-started/quickstarts/flow-cli.md | 2 +- .../quickstarts/hello-world.md | 80 ++++++++++++++----- 2 files changed, 63 insertions(+), 19 deletions(-) diff --git a/docs/build/getting-started/quickstarts/flow-cli.md b/docs/build/getting-started/quickstarts/flow-cli.md index a4bf34914d..60822c8ee9 100644 --- a/docs/build/getting-started/quickstarts/flow-cli.md +++ b/docs/build/getting-started/quickstarts/flow-cli.md @@ -51,7 +51,7 @@ For additional details on how `flow.json` is configured, review the [configurati ::: -## Grabbing the HelloWorld Contract +## Grabbing the `HelloWorld` Contract For this demo, we are going to be interacting with a simple `HelloWorld` contract, written in [Cadence], that is already deployed on Flow's `testnet` network on account [0xa1296b1e2e90ca5b]. In order to grab this project dependency, we'll use Flow's [Dependency Manager] to install it into our project using a source string that defines the network, address, and contract name of the contract we want to import. diff --git a/docs/build/getting-started/quickstarts/hello-world.md b/docs/build/getting-started/quickstarts/hello-world.md index 01b8e5eff4..3791f2c15c 100644 --- a/docs/build/getting-started/quickstarts/hello-world.md +++ b/docs/build/getting-started/quickstarts/hello-world.md @@ -1,26 +1,39 @@ --- sidebar_position: 1 -sidebar_label: 1 - Basics +sidebar_label: 1 - Smart Contract Basics --- import VerticalSplit from "./vertical-split.svg" -# Hello World Part 1 - Basics +# Hello World Part 1 - Smart Contract Basics -Welcome to the Flow blockchain! In this quickstart guide, you'll interact with your first smart contract on our `Testnet`. For those unfamiliar, the Testnet is a public instance of the Flow blockchain designed for experimentation. Here, you can deploy and invoke smart contracts without incurring any real-world costs. +In this quickstart guide, you'll interact with your first smart contract on the Flow Testnet. `Testnet` is a public instance of the Flow blockchain designed for experimentation, where you can deploy and invoke smart contracts without incurring any real-world costs. -Smart contracts on Flow are permanent code that live on the blockchain, allowing you to encode business logic, define digital assets, and much more. +Smart contracts on Flow are permanent pieces of code that live on the blockchain. They allow you to encode business logic, define digital assets, manage user interactions, and much more. By leveraging smart contracts, you can create decentralized applications (dApps) that are transparent, secure, and open to anyone. -Flow supports modern smart contracts written in [Cadence], as well as traditional [EVM] smart contracts written in Solidity. +Flow supports modern smart contracts written in [Cadence], a resource-oriented programming language designed specifically for smart contracts. Cadence focuses on safety and security, making it easier to write robust contracts. Flow also supports traditional [EVM]-compatible smart contracts written in Solidity, allowing developers to port their existing Ethereum contracts to Flow. In this guide, we'll focus on interacting with Cadence smart contracts. ## Objectives After completing this guide, you'll be able to: -* Read a public variable on a [Cadence] smart contract deployed on Flow +* Read a public variable on a [Cadence] smart contract deployed on Flow. +* Understand how to interact with contracts on Flow's `testnet`. +* Retrieve and display data from a deployed smart contract via scripts. -## Calling a contract +In later steps, you'll learn how to: -The `HelloWorld` contract exposes a public variable named `greeting` that is accessible to everything outside the contract. We can retrieve its value using a simple script written in the [Cadence] programming language. +* Create a Flow project using the [Flow CLI](../../../tools/flow-cli). +* Add an already-deployed contract to your project with the [Dependency Manager](../../../tools/flow-cli/dependency-manager.md). +* Deploy a smart contract locally to the [Flow Emulator](../../../tools/emulator). +* Write and execute transactions to interact with a deployed smart contract. +* Display data from a Cadence smart contract on a React frontend using the [Flow Client Library](../../../tools/clients/fcl-js). + + +## Calling a Contract With a Script + +The `HelloWorld` contract exposes a public variable named `greeting` that is accessible to everything outside the contract. We can retrieve its value using a simple script written in the [Cadence] programming language. Scripts in Cadence are read-only operations that allow you to query data from the blockchain without changing any state. + +Here's the script: ```cadence import HelloWorld from 0xa1296b1e2e90ca5b @@ -30,15 +43,24 @@ access(all) fun main(): String { } ``` - - `Click` To vertically orient Flow Runner editor. - - `Copy` the script above into Flow Runner input area and click "Run". - - See the output returned by the script. +Let's break down what this script does: + +- **Import Statement**: `import HelloWorld from 0xa1296b1e2e90ca5b` tells the script to use the `HelloWorld` contract deployed at the address `0xa1296b1e2e90ca5b` on the `testnet`. +- **Main Function**: `access(all) fun main(): String` defines the entry point of the script, which returns a `String`. +- **Return Statement**: `return HelloWorld.greeting` accesses the greeting variable from the `HelloWorld` contract and returns its value. + +### Steps to Execute the Script + + - **Open the Flow Runner**: Click the icon to orient the Flow Runner editor vertically. The Flow Runner is an online tool that allows you to write and execute Cadence scripts directly in your browser. +- **Copy the Script**: Copy the script above into the Flow Runner's input area. +- **Run the Script**: Click the Run button to execute the script. +- **View the Output**: Observe the output returned by the script. You should see the current value of the `greeting` variable, which is `"Hello, World!"`. -## Contract on Testnet +## Understanding the `HelloWorld` Contract -Below is the source code for the HelloWorld contract. As you continue through the next few tutorials, you'll discover how to invoke the `changeGreeting` function to modify the greeting value. Do take note, however, that only the contract's `owner` or permitted accounts can modify the greeting. +To fully grasp how the script works, it's important to understand the structure of the HelloWorld contract. Below is the source code for the contract: ```cadence access(all) contract HelloWorld { @@ -55,13 +77,35 @@ access(all) contract HelloWorld { } ``` -:::tip +Certainly! Here's the text formatted in Markdown for you to copy and paste: + +--- + +### Breakdown of the Contract + +- **Contract Declaration**: `access(all) contract HelloWorld` declares a new contract named `HelloWorld` that is accessible to everyone. +- **State Variable**: `access(all) var greeting: String` declares a public variable `greeting` of type `String`. The `access(all)` modifier means that this variable can be read by anyone. +- **Function to Change Greeting**: `access(account) fun changeGreeting(newGreeting: String)` defines a function that allows changing the value of `greeting`. The `access(account)` modifier restricts this function so that only the account that deployed the contract (the owner) can call it. +- **Initializer**: The `init()` function is called when the contract is deployed. It sets the initial value of `greeting` to `"Hello, World!"`. + +### Key Points + +- **Public Access**: The `greeting` variable is public, allowing anyone to read its value without any restrictions. +- **Restricted Modification**: Only the contract owner can modify the `greeting` variable using the `changeGreeting` function. This ensures that unauthorized accounts cannot change the contract's state. +- **No Read Costs**: Reading data from the blockchain is free on Flow. Executing scripts like the one you ran does not incur any costs. + +### What's Next? + +In the upcoming tutorials, you'll learn how to: -There are no `read` costs associated with calling contracts. +- **Modify the Greeting**: Invoke the `changeGreeting` function to update the `greeting` value. +- **Deploy Contracts**: Use the Flow CLI to deploy your own smart contracts. +- **Interact with Contracts Locally**: Use the Flow Emulator to test contracts in a local development environment. +- **Build Frontend Applications**: Display data from smart contracts in a React application using the Flow Client Library. -::: +By understanding the `HelloWorld` contract and how to interact with it, you're building a solid foundation for developing more complex applications on the Flow blockchain. -Continue to create your own contracts and get them deployed live with Flow CLI! +Proceed to the next tutorial to learn how to create your own contracts and deploy them live using the Flow CLI. [Cadence]: https://cadence-lang.org/ -[EVM]: https://flow.com/upgrade/crescendo/evm +[EVM]: https://flow.com/upgrade/crescendo/evm \ No newline at end of file From 450beef2019c3da354932d92ee2f7a911601d3c6 Mon Sep 17 00:00:00 2001 From: Chase Fleming <1666730+chasefleming@users.noreply.github.com> Date: Fri, 18 Oct 2024 15:21:24 -0700 Subject: [PATCH 2/4] Fix --- docs/build/getting-started/quickstarts/hello-world.md | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) diff --git a/docs/build/getting-started/quickstarts/hello-world.md b/docs/build/getting-started/quickstarts/hello-world.md index 3791f2c15c..be0765d1b9 100644 --- a/docs/build/getting-started/quickstarts/hello-world.md +++ b/docs/build/getting-started/quickstarts/hello-world.md @@ -60,7 +60,7 @@ Let's break down what this script does: ## Understanding the `HelloWorld` Contract -To fully grasp how the script works, it's important to understand the structure of the HelloWorld contract. Below is the source code for the contract: +To fully grasp how the script works, it's important to understand the structure of the `HelloWorld` contract. Below is the source code for the contract: ```cadence access(all) contract HelloWorld { @@ -77,10 +77,6 @@ access(all) contract HelloWorld { } ``` -Certainly! Here's the text formatted in Markdown for you to copy and paste: - ---- - ### Breakdown of the Contract - **Contract Declaration**: `access(all) contract HelloWorld` declares a new contract named `HelloWorld` that is accessible to everyone. From cf05adda1b30f380201d240846e7c89edd7eb107 Mon Sep 17 00:00:00 2001 From: Chase Fleming <1666730+chasefleming@users.noreply.github.com> Date: Fri, 18 Oct 2024 15:30:06 -0700 Subject: [PATCH 3/4] Change headers --- docs/build/getting-started/quickstarts/fcl-quickstart.md | 2 +- docs/build/getting-started/quickstarts/flow-cli.md | 2 +- docs/build/getting-started/quickstarts/hello-world.md | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/docs/build/getting-started/quickstarts/fcl-quickstart.md b/docs/build/getting-started/quickstarts/fcl-quickstart.md index a9e142942d..ee691443ee 100644 --- a/docs/build/getting-started/quickstarts/fcl-quickstart.md +++ b/docs/build/getting-started/quickstarts/fcl-quickstart.md @@ -3,7 +3,7 @@ sidebar_position: 3 sidebar_label: 3 - Simple Frontend --- -# Hello World Part 3 - Simple Frontend +# Part 3 - Simple Frontend [Flow Client Library] (FCL), is a JavaScript library developed to facilitate interactions with the Flow blockchain. It provides developers with tools to build, integrate, and interact with Flow directly from web applications. This web app quickstart will get you interacting with a contract already deployed to Flow. diff --git a/docs/build/getting-started/quickstarts/flow-cli.md b/docs/build/getting-started/quickstarts/flow-cli.md index 60822c8ee9..2e853b48a2 100644 --- a/docs/build/getting-started/quickstarts/flow-cli.md +++ b/docs/build/getting-started/quickstarts/flow-cli.md @@ -3,7 +3,7 @@ sidebar_position: 2 sidebar_label: 2 - Local Development --- -# Hello World Part 2 - Local Development +# Part 2 - Local Development The [Flow Command Line Interface] (CLI) is a set of tools that developers can use to interact with the Flow blockchain by managing accounts, sending transactions, deploying smart contracts, running the emulator, and more. This quickstart will get you familiar with its main concepts and functionality. diff --git a/docs/build/getting-started/quickstarts/hello-world.md b/docs/build/getting-started/quickstarts/hello-world.md index be0765d1b9..b1636d8323 100644 --- a/docs/build/getting-started/quickstarts/hello-world.md +++ b/docs/build/getting-started/quickstarts/hello-world.md @@ -4,7 +4,7 @@ sidebar_label: 1 - Smart Contract Basics --- import VerticalSplit from "./vertical-split.svg" -# Hello World Part 1 - Smart Contract Basics +# Part 1 - Smart Contract Basics In this quickstart guide, you'll interact with your first smart contract on the Flow Testnet. `Testnet` is a public instance of the Flow blockchain designed for experimentation, where you can deploy and invoke smart contracts without incurring any real-world costs. From c574c93f6010a361759b28e1de3a86d7d318f095 Mon Sep 17 00:00:00 2001 From: Chase Fleming Date: Fri, 18 Oct 2024 15:30:30 -0700 Subject: [PATCH 4/4] Update docs/build/getting-started/quickstarts/hello-world.md Co-authored-by: Jordan Ribbink <17958158+jribbink@users.noreply.github.com> --- docs/build/getting-started/quickstarts/hello-world.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/build/getting-started/quickstarts/hello-world.md b/docs/build/getting-started/quickstarts/hello-world.md index b1636d8323..3059d7127e 100644 --- a/docs/build/getting-started/quickstarts/hello-world.md +++ b/docs/build/getting-started/quickstarts/hello-world.md @@ -8,7 +8,7 @@ import VerticalSplit from "./vertical-split.svg" In this quickstart guide, you'll interact with your first smart contract on the Flow Testnet. `Testnet` is a public instance of the Flow blockchain designed for experimentation, where you can deploy and invoke smart contracts without incurring any real-world costs. -Smart contracts on Flow are permanent pieces of code that live on the blockchain. They allow you to encode business logic, define digital assets, manage user interactions, and much more. By leveraging smart contracts, you can create decentralized applications (dApps) that are transparent, secure, and open to anyone. +Smart contracts on Flow are permanent pieces of code that live on the blockchain. They allow you to encode business logic, define digital assets, and much more. By leveraging smart contracts, you can create decentralized applications (dApps) that are transparent, secure, and open to anyone. Flow supports modern smart contracts written in [Cadence], a resource-oriented programming language designed specifically for smart contracts. Cadence focuses on safety and security, making it easier to write robust contracts. Flow also supports traditional [EVM]-compatible smart contracts written in Solidity, allowing developers to port their existing Ethereum contracts to Flow. In this guide, we'll focus on interacting with Cadence smart contracts.