docs: create simple getting started (#981)

.changeset/perfect-suits-design.md

@@ -0,0 +1,2 @@
+---
+---

apps/docs/.vitepress/config.ts

@@ -40,6 +40,10 @@ export default defineConfig({
         text: 'Introduction',
         link: '/',
         items: [
+          {
+            text: 'Getting Started',
+            link: '/getting-started',
+          },
           {
             text: 'Glossary',
             link: '/glossary',

apps/docs/src/getting-started.md

@@ -0,0 +1,63 @@
+# Getting Started with Fuels-ts
+
+This guide will walk you through the process of setting up and using the Fuels-ts library in your front-end project.
+
+## Installing the Fuels-ts Library
+
+To begin, you need to add the `fuels` dependency to your project. You can do this using the following command:
+
+::: code-group
+
+```sh [npm]
+npm install fuels --save
+```
+
+```sh [yarn]
+yarn add fuels
+```
+
+```sh [pnpm]
+pnpm add fuels
+```
+
+:::
+
+## Creating a React Component to Connect to the Blockchain
+
+With the Fuels dependency set up, you can now create a React component that will connect to the Fuel provider and retrieve the base asset balance for a given wallet address. Here's an example of how to do this:
+
+<!-- TODO: Create properly code snippet on new package: `app/react-app` after https://github.com/FuelLabs/fuels-ts/pull/827 got merged -->
+
+```tsx
+import { BN, Provider, Wallet } from "fuels";
+import { useEffect, useState } from "react";
+
+function App() {
+  const [balance, setBalance] = useState(0);
+
+  const provider = new Provider("https://beta-3.fuel.network/graphql");
+  const myWallet = Wallet.fromAddress("0x...", provider);
+
+  useEffect(() => {
+    myWallet.getBalances().then((data) => {
+      setBalance(new BN(data[0].amount).toNumber());
+    });
+  }, []);
+
+  return <div>My Balance: {balance}</div>;
+}
+
+export default App;
+```
+
+## Further Resources and Next Steps
+
+For a more in-depth, step-by-step guide on working with the Fuels ecosystem, check out the [Developer Quickstart guide](https://fuelbook.fuel.network/master/quickstart/developer-quickstart.html). This guide covers:
+
+1. Installing all tools needed to develop on the Fuels ecosystem.
+
+2. Writing your first Sway Project.
+
+3. Deploying your contract.
+
+4. Building a simple front-end dApp to interact with your deployed contract.