fix(docs): Load token artifact from the compiled source in the sample dapp tutorial

docs/docs/developers/tutorials/codealong/js_tutorials/simple_dapp/2_contract_deployment.md

@@ -21,6 +21,7 @@ Then, open the `contracts/token/Nargo.toml` configuration file, and add the `azt
 [dependencies]
 aztec = { git="https://github.com/AztecProtocol/aztec-packages/", tag="#include_aztec_version", directory="noir-projects/aztec-nr/aztec" }
 authwit = { git="https://github.com/AztecProtocol/aztec-packages/", tag="#include_aztec_version", directory="noir-projects/aztec-nr/authwit"}
+uint_note = { git="https://github.com/AztecProtocol/aztec-packages/", tag="#include_aztec_version", directory="noir-projects/aztec-nr/uint-note" }
 compressed_string = {git="https://github.com/AztecProtocol/aztec-packages/", tag="#include_aztec_version", directory="noir-projects/aztec-nr/compressed-string"}
 ```
 

docs/docs/developers/tutorials/codealong/js_tutorials/simple_dapp/3_contract_interaction.md

@@ -18,12 +18,14 @@ To do this, let's first initialize a new `Contract` instance using `aztec.js` th
 
 ```js
 // src/contracts.mjs
-#include_code imports yarn-project/end-to-end/src/sample-dapp/contracts.mjs raw
-```
+import { AztecAddress, Contract, loadContractArtifact } from "@aztec/aztec.js";
+import TokenContractJson from "../contracts/token/target/token-Token.json" assert { type: "json" };
 
-You may have noticed that we are importing the `TokenContract` class from `@aztec/noir-contracts.js`. This is an alternative way to get the contract interface for interacting with the contract. With this, we can add the following code for initializing the `TokenContract` instance:
+import { readFileSync } from "fs";
+const TokenContractArtifact = loadContractArtifact(TokenContractJson);
 
-#include_code get-tokens yarn-project/end-to-end/src/sample-dapp/contracts.mjs javascript
+#include_code get-tokens yarn-project/end-to-end/src/sample-dapp/contracts.mjs raw
+```
 
 We can now get the token instance in our main code in `src/index.mjs`, by importing the function from `src/contracts.mjs`. Update the imports in `src/index.mjs` to look like this:
 

docs/docs/developers/tutorials/codealong/js_tutorials/simple_dapp/index.md

@@ -11,7 +11,7 @@ The full code for this tutorial is [available on the `aztec-packages` repository
 ## Dependencies
 
 - Linux or OSX environment
-- [NodeJS](https://nodejs.org/) 18 or higher
+- [NodeJS](https://nodejs.org/) version 18.19.0
 - [Aztec Sandbox](../../../../getting_started.md)
 
 ## Prerequisites

yarn-project/end-to-end/src/sample-dapp/contracts.mjs

@@ -1,14 +1,14 @@
-// docs:start:imports
-import { AztecAddress } from '@aztec/aztec.js';
+import { AztecAddress, Contract } from '@aztec/aztec.js';
 import { TokenContract } from '@aztec/noir-contracts.js/Token';
 
 import { readFileSync } from 'fs';
 
-// docs:end:imports
+// This syntax is helpful for the referencing tutorial
+const TokenContractArtifact = TokenContract.artifact;
 
 // docs:start:get-tokens
 export async function getToken(wallet) {
   const addresses = JSON.parse(readFileSync('addresses.json'));
-  return TokenContract.at(AztecAddress.fromString(addresses.token), wallet);
+  return Contract.at(AztecAddress.fromString(addresses.token), TokenContractArtifact, wallet);
 }
 // docs:end:get-tokens