📝 Adding Steps for 09-recurssion tutorial #763

LuffySama-Dev · 2023-11-28T14:48:51Z

So, I am working on your suggestion and this what I have done till now.
I hope this is what you are expecting.

This might have certain problem but we can work and resolve them together 🙌.

Thank You 😄

vercel · 2023-11-28T14:48:56Z

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
docs2	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Nov 28, 2023 4:32pm

vercel · 2023-11-28T14:48:58Z

@LuffySama-Dev is attempting to deploy a commit to the o1labs Team on Vercel.

A member of the Team first needs to authorize it.

…actoring to match tutorial

LuffySama-Dev · 2023-11-28T16:45:48Z

Hi @barriebyron ,

Changes made:

Tutorial made easy to follow
Using latest o1js version
Match the file structure and code base to tutorial
Changes made in example are tested locally

Upcoming changes:

- Updating tutorial for rollup.ts example
- Updating tutorial for vote.ts example
- Updating the file structure and code according to upcoming changes in tutorial

Issues being resolve here are :

Issue add steps to Tutorial 9 to run the code #628 is being worked on
Issue HF audit zkApp tutorials: verify and run through code for Tutorial 9: Recursion #759 will also be resolved once all changes are made

Thank You 😄

barriebyron · 2023-11-29T16:56:33Z

docs/zkapps/tutorials/09-recursion.mdx


-To create a ZkProgram, start with the `init()` method. 
+:::info


@LuffySama-Dev we are removing line numbers for future, so we can omit this part

barriebyron · 2023-11-29T16:58:46Z

docs/zkapps/tutorials/09-recursion.mdx

+The `zk project` command has the ability to scaffold the UI for your project. For this tutorial, select `none`:
+
+```
+? Create an accompanying UI project too? …
+  next
+  svelte
+  nuxt
+  empty
+❯ none
+```
+
+The expected output is:
+
+```sh
+✔ Create an accompanying UI project too? · none
+✔ UI: Set up project
+✔ Initialize Git repo
+✔ Set up project
+✔ NPM install
+✔ NPM build contract
+✔ Set project name
+✔ Git init commit
+
+Success!


Suggested change

The `zk project` command has the ability to scaffold the UI for your project. For this tutorial, select `none`:

```

? Create an accompanying UI project too? …

next

svelte

nuxt

empty

❯ none

```

The expected output is:

```sh

✔ Create an accompanying UI project too? · none

✔ UI: Set up project

✔ Initialize Git repo

✔ Set up project

✔ NPM install

✔ NPM build contract

✔ Set project name

✔ Git init commit

Success!

The `zk project` command has the ability to scaffold the UI for your project. For this tutorial, select `none`.

since this is tutorial 9, we can leave out the very detailed steps since devs will have already mastered these steps in earlier tutorials

barriebyron · 2023-11-29T17:00:01Z

docs/zkapps/tutorials/09-recursion.mdx

+Next steps:
+  cd 09-recursion
+  git remote add origin <your-repo-url>
+  git push -u origin main
+```
+
+The `zk project` command creates the `09-recursion` directory that contains the scaffolding for your project, including tools such as the Prettier code formatting tool, the ESLint static code analysis tool, and the Jest JavaScript testing framework.


Suggested change

Next steps:

cd 09-recursion

git remote add origin <your-repo-url>

git push -u origin main

```

The `zk project` command creates the `09-recursion` directory that contains the scaffolding for your project, including tools such as the Prettier code formatting tool, the ESLint static code analysis tool, and the Jest JavaScript testing framework.

As you learned in earlier tutorials, the `zk project` command creates the `09-recursion` directory that contains the scaffolding for your project.

barriebyron · 2023-11-29T17:01:06Z

docs/zkapps/tutorials/09-recursion.mdx

+1. Change into the `09-recursion` directory and list the contents:
+
+```sh
+$ cd 09-recursion
+$ ls
+```
+
+The output shows these results:
+
+```sh
+LICENSE
+README.md
+babel.config.cjs
+build
+config.json
+jest-resolver.cjs
+jest.config.js
+keys
+node_modules
+package-lock.json
+package.json
+src
+tsconfig.json
+```
+
+For this tutorial, you run commands from the root of the `09-recursion` directory as you work in the `src` directory on files that contain the TypeScript code for the smart contract. Each time you make updates, then build or deploy, the TypeScript code is compiled into JavaScript in the `build` directory.


Suggested change

1. Change into the `09-recursion` directory and list the contents:

```sh

$ cd 09-recursion

$ ls

```

The output shows these results:

```sh

LICENSE

README.md

babel.config.cjs

build

config.json

jest-resolver.cjs

jest.config.js

keys

node_modules

package-lock.json

package.json

src

tsconfig.json

```

For this tutorial, you run commands from the root of the `09-recursion` directory as you work in the `src` directory on files that contain the TypeScript code for the smart contract. Each time you make updates, then build or deploy, the TypeScript code is compiled into JavaScript in the `build` directory.

1. Change into the `09-recursion` directory. Like all projects, you run commands from the root of the `09-recursion` directory as you work in the `src` directory on files that contain the TypeScript code for the smart contract. Each time you make updates, then build or deploy, the TypeScript code is compiled into JavaScript in the `build` directory.

barriebyron · 2023-11-29T17:01:36Z

docs/zkapps/tutorials/09-recursion.mdx

+
+### Prepare the project
+
+Start by deleting the default files that come with the new project.


Suggested change

Start by deleting the default files that come with the new project.

Like earlier tutorials, you can prepare your project by deleting the default files that come with the new project and creating new files.

barriebyron · 2023-11-29T17:03:52Z

docs/zkapps/tutorials/09-recursion.mdx

+1. To delete the old files:
+
+```sh
+$ rm src/Add.ts
+$ rm src/Add.test.ts
+$ rm src/interact.ts
+```
+
+1. Now, create the new files for your project:
+
+```sh
+$ zk file src/Add
+$ touch src/main.ts
+```
+
+- The `zk file` command created the `src/Add.ts` and `src/Add.test.ts` test files.
+- However, this tutorial does not include writing tests, so you just use the `main.ts` file as a script to interact with the smart contract and observe how it works.
+
+In later tutorials, you learn how to interact with a smart contract from the browser, like a typical end user.
+


Suggested change

1. To delete the old files:

```sh

$ rm src/Add.ts

$ rm src/Add.test.ts

$ rm src/interact.ts

```

1. Now, create the new files for your project:

```sh

$ zk file src/Add

$ touch src/main.ts

```

- The `zk file` command created the `src/Add.ts` and `src/Add.test.ts` test files.

- However, this tutorial does not include writing tests, so you just use the `main.ts` file as a script to interact with the smart contract and observe how it works.

In later tutorials, you learn how to interact with a smart contract from the browser, like a typical end user.

we'll omit these steps since devs will already have experience

barriebyron · 2023-11-29T17:06:08Z

docs/zkapps/tutorials/09-recursion.mdx

+3. Now, open `src/index.ts` in a text editor and change it to look like:
+
+```ts src/index.ts
+1 import { Add } from './Add.js';
+2
+3 export { Add };
+```
+
+The `src/index.ts` file contains all of the exports you want to make available for consumption from outside your smart contract project, such as from a UI.


Suggested change

3. Now, open `src/index.ts` in a text editor and change it to look like:

```ts src/index.ts

1 import { Add } from './Add.js';

2

3 export { Add };

```

The `src/index.ts` file contains all of the exports you want to make available for consumption from outside your smart contract project, such as from a UI.

Open `src/index.ts` in a text editor and import the Add smart contract, like:

```ts src/index.ts

import { Add } from './Add.js';

export { Add };

The src/index.ts file contains all of the exports you want to make available for consumption from outside your smart contract project.

be sure the contract example file and all references align

barriebyron · 2023-11-29T17:08:40Z

docs/zkapps/tutorials/09-recursion.mdx

+
+Now, the fun part! Write your smart contract in the `src/Add.ts` file.
+
+Line numbers are provided for convenience. A final version of the smart contract is provided in the [Add.ts](https://github.com/o1-labs/docs2/blob/main/examples/zkapps/01-hello-world/src/Add.ts) example file.


Suggested change

Line numbers are provided for convenience. A final version of the smart contract is provided in the [Add.ts](https://github.com/o1-labs/docs2/blob/main/examples/zkapps/01-hello-world/src/Add.ts) example file.

A final version of the smart contract is provided in the [Add.ts](https://github.com/o1-labs/docs2/blob/main/examples/zkapps/01-hello-world/src/Add.ts) example file.

can you help me understand why we need the Add.ts file from tutorial 1?

you'll see my earlier questions, all related. Thank you for this work!

Hi @barriebyron ,

I wen through the existing tutorial and found that we are actually showing recursion example for the Addition. In the current tutorial and it's example we are using main.ts as our main file and all the code it.

Now in earlier tutorials if you will see we were following pattern like there is a SmartContractfiles.ts which contains the smartcontract code and main.ts which includes code to interact with the SmarContractfile.ts.

This tutorial doesn't seem to be following this and might cause confusion for the developer. To avoid whole confusion I am trying to bring everything in the same pattern.

For example : In this tutorial itself you can see the Vote smartcontract has file name Vote.ts and same for Rollup smartcontract i.e Rollup.ts.

So, I am naming the Add smartcontract file as Add.ts for ease of understanding.

And coming to the file from tutorial 1, I did not review which tutorial it was taking file from. It does not have anything to do with tutorial 1.

I will fix this and update it in my upcoming commits.

Thanks Luffy 😃

barriebyron · 2023-11-29T17:10:18Z

docs/zkapps/tutorials/09-recursion.mdx

+This part of the tutorial walks you through the Add ZkProgram code already completed in the `src/Add.ts` example file.
+
+### Copy the example
+
+This tutorial describes each part of the completed code in the [Add.ts](https://github.com/o1-labs/docs2/blob/main/examples/zkapps/01-hello-world/src/Add.ts) example file.


Suggested change

This part of the tutorial walks you through the Add ZkProgram code already completed in the `src/Add.ts` example file.

### Copy the example

This tutorial describes each part of the completed code in the [Add.ts](https://github.com/o1-labs/docs2/blob/main/examples/zkapps/01-hello-world/src/Add.ts) example file.

### Copy the example

Use the Add code already completed in the [Add.ts](https://github.com/o1-labs/docs2/blob/main/examples/zkapps/01-hello-world/src/Add.ts) example file.

you can verify all example files and doc references are in sync for https://github.com/o1-labs/docs2/tree/main/examples/zkapps/09-recursion/src directory

barriebyron · 2023-11-29T17:10:55Z

docs/zkapps/tutorials/09-recursion.mdx

+1. First, open the [Add.ts](https://github.com/o1-labs/docs2/blob/main/examples/zkapps/01-hello-world/src/Add.ts) example file.
+
+1. Copy the entire contents of the file into your ZkProgram in the `src/Add.ts` file.
+
+Now you are ready to review the imports in the ZkProgram.


Suggested change

1. First, open the [Add.ts](https://github.com/o1-labs/docs2/blob/main/examples/zkapps/01-hello-world/src/Add.ts) example file.

1. Copy the entire contents of the file into your ZkProgram in the `src/Add.ts` file.

Now you are ready to review the imports in the ZkProgram.

1. First, open the [Add.ts](https://github.com/o1-labs/docs2/blob/main/examples/zkapps/01-hello-world/src/Add.ts) example file.

1. Copy the file's entire contents into your project `src/Add.ts` file.

barriebyron · 2023-11-29T17:12:14Z

docs/zkapps/tutorials/09-recursion.mdx

+- For each method, declare the inputs it will receive.
+- The first argument of a ZkProgram method is always the state of the ZkProgram, named `publicInput` since it is public.
+
+```typescript


let's remove the line numbers, easiest to copy code right from the example file

barriebyron · 2023-11-29T17:12:28Z

docs/zkapps/tutorials/09-recursion.mdx

-        newState.assertEquals(earlierProof.publicInput.add(numberToAdd));
-      },
-    },
+15


remove line numbers here too

barriebyron · 2023-11-29T17:12:40Z

docs/zkapps/tutorials/09-recursion.mdx

-      newState.assertEquals(earlierProof1.publicInput.add(earlierProof2.publicInput));
-    },
-  },
+28


remove line numbers here too

barriebyron · 2023-11-29T17:24:49Z

docs/zkapps/tutorials/09-recursion.mdx

+:::info
+
+```ts src/Add.ts
+1 import { Field, SelfProof, ZkProgram } from 'o1js';


Suggested change

1 import { Field, SelfProof, ZkProgram } from 'o1js';

import { Field, SelfProof, ZkProgram } from 'o1js';

barriebyron · 2023-11-29T17:25:12Z

docs/zkapps/tutorials/09-recursion.mdx

+
+These items are:
+
+- `Field`: The native number type in o1js. You can think of Field elements as unsigned integers. Field elements are the most basic type in o1js. All other o1js-compatible types are built on top of Field elements.


do you want to describe SelfProof?

barriebyron · 2023-11-29T17:26:30Z

docs/zkapps/tutorials/09-recursion.mdx

-To use ZkProgram, compile it and then call methods on it:
+## Interact with a smart contract
+
+Next, write a script that interacts with your smart contract. As before, the complete [main.ts](https://github.com/o1-labs/docs2/blob/main/examples/zkapps/01-hello-world/src/main.ts) example file is provided. Follow these steps to build the `main.ts` file so you can interact with the smart contract.


since Tutorial 4 was the "model" for these updates, it talks about interacting with the smart contract. We can omit the UI-based steps here

barriebyron · 2023-11-29T17:27:44Z

docs/zkapps/tutorials/09-recursion.mdx

+
+For this tutorial, the `import` statement brings in items from `o1js` that you use to interact with your smart contract. 
+
+1. Copy the following lines from [main.ts](https://github.com/o1-labs/docs2/blob/main/examples/zkapps/01-hello-world/src/main.ts) example file into the `src/main.ts` file:


I don't think we need to interact with UI (I don't think so) you can omit the interact steps

barriebyron · 2023-11-29T17:28:03Z

docs/zkapps/tutorials/09-recursion.mdx

+### Call Methods
+
+Now we will add methods to call ZkProgram:


Suggested change

### Call Methods

Now we will add methods to call ZkProgram:

### Call Methods

Add methods to call ZkProgram:

barriebyron · 2023-11-29T17:29:20Z

docs/zkapps/tutorials/09-recursion.mdx


 ```typescript
-  console.log('compiling...');
+3


be sure the example code in https://github.com/o1-labs/docs2/blob/main/examples/zkapps/09-recursion/src/main.ts is current
and match here (omit line numbers please)

barriebyron · 2023-11-29T17:30:15Z

docs/zkapps/tutorials/09-recursion.mdx


-  const proof0 = await Add.init(Field(0));
+Now that the Square smart contract is complete, these commands run your project as a local blockchain.


what is the contract we want to build? Square? (be sure all the file names and example files match up throughout)
https://github.com/o1-labs/docs2/blob/main/examples/zkapps/09-recursion/src/Square.ts

Oh Sorry, I missed this one.
Will proof read it once again.

According to existing tutorial and the examples, we are building three files mainly:

Add.ts

Rollup.ts

Vote.ts

barriebyron · 2023-11-29T17:31:48Z

docs/zkapps/tutorials/09-recursion.mdx

+1. Now, create the new files for your project:
+
+```sh
+$ zk file src/Add


did you want to use Square.ts? https://github.com/o1-labs/docs2/blob/main/examples/zkapps/09-recursion/src/Square.ts

Hi @barriebyron ,

I went through all the files and I am not sure why Square.ts is used here. Code inside this file does not aligns to what tutorial is actually for.
According to me we can remove it, if possible can we ask someone from team to review it ?

Same is for zkProgram_wrapper.ts.

Can you please help to get it reviewed so I can remove it in coming commits ?

Thanks Luffy 😃

About Add.ts I will change it back to main.ts same as previous one.

barriebyron · 2023-11-29T17:32:24Z

docs/zkapps/tutorials/09-recursion.mdx

+3. Now, open `src/index.ts` in a text editor and change it to look like:
+
+```ts src/index.ts
+1 import { Add } from './Add.js';


not sure where we're going with this step, are you replacing https://github.com/o1-labs/docs2/blob/main/examples/zkapps/09-recursion/src/Square.ts with Add.ts?

No, actually Square.ts was never used in tutorial. The fils which was used is main.ts. The code which we are explaining in this tutorial is about recursion and it matches the code from main.ts and not the Square.ts.

barriebyron · 2023-11-29T17:37:05Z

docs/zkapps/tutorials/09-recursion.mdx


-  console.log('making proof 1')
+To compile the TypeScript code into JavaScript:



I haven't tested this yet... looks like you ran the code locally, thank you!

would you be up for fixing the README.md file to be accurate?

Yes Sure,

I will do it.

barriebyron · 2023-11-29T17:42:06Z

can you also do the code updates that require removing isReady and shutdown from the example files (and test):

Just to let you know, I'm a technical writer, not a developer... so I'll follow your steps and test the code, and we'll get an o1js developer to review the final. For now, I've moved this PR to draft status while changes are made.

Thank you!

LuffySama-Dev · 2023-11-29T17:50:28Z

Hi @barriebyron ,

Sure, I would love to make those changes.
If possible can you please assign them to me to so I can keep track of them ?

Thank You 😊

barriebyron · 2023-11-29T18:20:05Z

@LuffySama-Dev can you help me understand "please assign them to me" request? You can make all changes in this PR without new issues, or are you asking for new issues to track?

LuffySama-Dev · 2023-11-30T06:23:41Z

Hi @barriebyron ,

I thought above mentioned changes were related to different issue and got confused and asked to assign.
Now that these are all related to this not required.

Thank You 😃

LuffySama-Dev · 2023-12-25T11:47:35Z

Hi @barriebyron ,

Hope you are doing great!!
I want to commit these changes but the problem is that if I make this changes then #786 will break.
So, once it is merged I will update this one accordingly also, will remove the isReady and shutdown from the example files and test and commit them.

Thanks Luffy 😃

LuffySama-Dev · 2024-01-16T12:38:52Z

Hi @barriebyron ,

I am closing this PR as new PR is raised for this #796

Thank you

📝 Adding Steps for 09-recurssion tutorial

ed54c80

LuffySama-Dev requested a review from a team as a code owner November 28, 2023 14:48

vercel bot deployed to Preview – docs2 November 28, 2023 14:51 View deployment

📝 Adding rest code for main file of 09-recurssion tutorial

6995cdf

vercel bot deployed to Preview – docs2 November 28, 2023 15:19 View deployment

🎨 Modified the existing code to use latest o1js version and minor ref…

4702afb

…actoring to match tutorial

vercel bot deployed to Preview – docs2 November 28, 2023 16:32 View deployment

LuffySama-Dev mentioned this pull request Nov 28, 2023

add steps to Tutorial 9 to run the code #628

Closed

barriebyron reviewed Nov 29, 2023

View reviewed changes

jackryanservia mentioned this pull request Nov 29, 2023

Update 09-recursion.mdx #764

Closed

barriebyron reviewed Nov 29, 2023

View reviewed changes

barriebyron marked this pull request as draft November 29, 2023 17:42

LuffySama-Dev mentioned this pull request Jan 16, 2024

📝 Adding Steps for 09-recursion tutorial #796

Merged

LuffySama-Dev closed this Jan 16, 2024


		To create a ZkProgram, start with the `init()` method.
		:::info


		### Prepare the project

		Start by deleting the default files that come with the new project.

	Start by deleting the default files that come with the new project.
	Like earlier tutorials, you can prepare your project by deleting the default files that come with the new project and creating new files.


		Now, the fun part! Write your smart contract in the `src/Add.ts` file.

		Line numbers are provided for convenience. A final version of the smart contract is provided in the [Add.ts](https://github.com/o1-labs/docs2/blob/main/examples/zkapps/01-hello-world/src/Add.ts) example file.

	Line numbers are provided for convenience. A final version of the smart contract is provided in the [Add.ts](https://github.com/o1-labs/docs2/blob/main/examples/zkapps/01-hello-world/src/Add.ts) example file.
	A final version of the smart contract is provided in the [Add.ts](https://github.com/o1-labs/docs2/blob/main/examples/zkapps/01-hello-world/src/Add.ts) example file.

	1 import { Field, SelfProof, ZkProgram } from 'o1js';
	import { Field, SelfProof, ZkProgram } from 'o1js';


		These items are:

		- `Field`: The native number type in o1js. You can think of Field elements as unsigned integers. Field elements are the most basic type in o1js. All other o1js-compatible types are built on top of Field elements.


		For this tutorial, the `import` statement brings in items from `o1js` that you use to interact with your smart contract.

		1. Copy the following lines from [main.ts](https://github.com/o1-labs/docs2/blob/main/examples/zkapps/01-hello-world/src/main.ts) example file into the `src/main.ts` file:


		const proof0 = await Add.init(Field(0));
		Now that the Square smart contract is complete, these commands run your project as a local blockchain.


		console.log('making proof 1')
		To compile the TypeScript code into JavaScript:

📝 Adding Steps for 09-recurssion tutorial #763

📝 Adding Steps for 09-recurssion tutorial #763

Conversation

LuffySama-Dev commented Nov 28, 2023

vercel bot commented Nov 28, 2023 • edited Loading

vercel bot commented Nov 28, 2023

LuffySama-Dev commented Nov 28, 2023

Changes made:

Upcoming changes:

Issues being resolve here are :

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

barriebyron Nov 29, 2023 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

barriebyron Nov 29, 2023 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

barriebyron Nov 29, 2023 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

LuffySama-Dev Jan 16, 2024 • edited Loading

Choose a reason for hiding this comment

LuffySama-Dev Jan 16, 2024 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

barriebyron commented Nov 29, 2023 • edited Loading

LuffySama-Dev commented Nov 29, 2023

barriebyron commented Nov 29, 2023

LuffySama-Dev commented Nov 30, 2023

LuffySama-Dev commented Dec 25, 2023

LuffySama-Dev commented Jan 16, 2024

vercel bot commented Nov 28, 2023 •

edited

Loading

barriebyron Nov 29, 2023 •

edited

Loading

barriebyron Nov 29, 2023 •

edited

Loading

barriebyron Nov 29, 2023 •

edited

Loading

LuffySama-Dev Jan 16, 2024 •

edited

Loading

LuffySama-Dev Jan 16, 2024 •

edited

Loading

barriebyron commented Nov 29, 2023 •

edited

Loading