From e988b23f70ebe9a8b5f2c06d2d1498d15f0e0259 Mon Sep 17 00:00:00 2001 From: Ziad Saab Date: Thu, 1 Jun 2023 15:00:45 -0500 Subject: [PATCH] Update instructions for creating a snap (#745) * update instructions for creating a snap snaps should be created using the CLI rather than cloning the repo. --- snaps/get-started/install-snaps.md | 23 ++--------------------- snaps/get-started/quickstart.md | 15 +++++++-------- snaps/reference/cli/index.md | 4 +++- snaps/tutorials/gas-estimation.md | 18 ++++++------------ snaps/tutorials/transaction-insights.md | 16 +++++----------- 5 files changed, 23 insertions(+), 53 deletions(-) diff --git a/snaps/get-started/install-snaps.md b/snaps/get-started/install-snaps.md index afce2636edc..bea0e0f67cd 100644 --- a/snaps/get-started/install-snaps.md +++ b/snaps/get-started/install-snaps.md @@ -5,9 +5,9 @@ sidebar_position: 1 # Install Snaps -To use Snaps, you must install [MetaMask Flask](#install-metamask-flask) and the [Snaps CLI](#install-the-snaps-cli). +To use Snaps, you must install [MetaMask Flask](#install-metamask-flask). -You can then [get started quickly using the Snaps template](quickstart.md). +You can then [get started quickly using the Create Snap CLI](quickstart.md). ## Prerequisites @@ -28,22 +28,3 @@ Flask. :::caution Running multiple instances of MetaMask in the same browser profile breaks dapp interactions. ::: - -## Install the Snaps CLI - -The [Snaps CLI](../reference/cli/index.md) provides commands for initiating a snap project and building, -executing, and serving your snap for local development. - -In a terminal window, install the CLI globally using npm or Yarn: - -```bash -npm install -g @metamask/snaps-cli -or -yarn global add @metamask/snaps-cli -``` - -Verify the installation and display usage instructions: - -```bash -mm-snap --help -``` diff --git a/snaps/get-started/quickstart.md b/snaps/get-started/quickstart.md index 47a3446237e..a3a87aade9c 100644 --- a/snaps/get-started/quickstart.md +++ b/snaps/get-started/quickstart.md @@ -6,7 +6,8 @@ sidebar_position: 2 # Snaps quickstart Get started with Snaps using the -[Snaps template](https://github.com/MetaMask/template-snap-monorepo) built with TypeScript and React. +[Create Snap CLI](https://github.com/MetaMask/snaps-monorepo/packages/create-snap). +With the CLI, you can initialize a snap monorepo project built with TypeScript and React. ## Prerequisites @@ -23,21 +24,19 @@ Get started with Snaps using the ## Create the project -Use the Snaps template by -[creating a new repository from the template](https://github.com/MetaMask/template-snap-monorepo/generate). - -[Clone the repository](https://docs.github.com/en/repositories/creating-and-managing-repositories/cloning-a-repository) -using the command line: +Create a new snap project using the Create Snap CLI by running the following command: ```bash -git clone git@github.com:/template-snap-monorepo.git +yarn create @metamask/snap your-snap-name +# or... +npm create @metamask/snap your-snap-name ``` You can learn about the [anatomy of your snap project files](../concepts/anatomy.md). ## Start the snap -From the root of the repository, install the project dependencies using Yarn: +From the root of the newly created project, install the project dependencies using Yarn: ```shell yarn diff --git a/snaps/reference/cli/index.md b/snaps/reference/cli/index.md index 29d4a7b74c9..74ace5238bf 100644 --- a/snaps/reference/cli/index.md +++ b/snaps/reference/cli/index.md @@ -7,7 +7,9 @@ sidebar_position: 3 This reference describes the syntax of the Snaps command line interface (CLI) subcommands and options. -Make sure to [install the Snaps CLI](../../get-started/install-snaps.md#install-the-snaps-cli). +:::note +The CLI is installed when you [create a snap project](../../get-started/quickstart.md). +::: You can specify subcommands and options using the `mm-snap` command: diff --git a/snaps/tutorials/gas-estimation.md b/snaps/tutorials/gas-estimation.md index 6a58c11f3b3..31957be0a48 100644 --- a/snaps/tutorials/gas-estimation.md +++ b/snaps/tutorials/gas-estimation.md @@ -6,10 +6,8 @@ sidebar_position: 1 # Create a gas estimation snap This tutorial walks you through creating a snap that estimates gas fees. -The snap is based on the -[Snaps template](https://github.com/MetaMask/template-snap-monorepo). -It uses the `fetch` API to request information from the internet, and displays custom information in -a confirmation dialog. +The snap uses the `fetch` API to request information from the internet, and displays custom +information in a confirmation dialog. ## Prerequisites @@ -23,16 +21,12 @@ a confirmation dialog. ### 1. Set up the project -Use the Snaps template by -[creating a new repository from the template](https://github.com/MetaMask/template-snap-monorepo/generate). - -Give your project a new name, such as `gas-estimation-snap`. - -[Clone the repository](https://docs.github.com/en/repositories/creating-and-managing-repositories/cloning-a-repository) -using the command line: +Create a new snap project using the Create Snap CLI by running the following command: ```bash -git clone git@github.com:/gas-estimation-snap.git +yarn create @metamask/snap gas-estimation-snap +# or... +npm create @metamask/snap gas-estimation-snap ``` To initialize your development environment with the required dependencies, in your project diff --git a/snaps/tutorials/transaction-insights.md b/snaps/tutorials/transaction-insights.md index c367cca0bc8..f6a02ff84ac 100644 --- a/snaps/tutorials/transaction-insights.md +++ b/snaps/tutorials/transaction-insights.md @@ -7,9 +7,7 @@ sidebar_position: 2 This tutorial walks you through creating a snap that calculates the percentage of gas fees that a user would pay when creating a transaction. -The snap is based on the -[Snaps template](https://github.com/MetaMask/template-snap-monorepo), and it provides transaction -insights in the MetaMask transaction window. +The snap provides transaction insights in the MetaMask transaction window. ## Prerequisites @@ -29,16 +27,12 @@ insights in the MetaMask transaction window. ### 1. Set up the project -Use the Snaps template by -[creating a new repository from the template](https://github.com/MetaMask/template-snap-monorepo/generate). - -Give your project a new name, such as `transaction-insights-snap`. - -[Clone the repository](https://docs.github.com/en/repositories/creating-and-managing-repositories/cloning-a-repository) -using the command line: +Create a new snap project using the Create Snap CLI by running the following command: ```bash -git clone git@github.com:/transaction-insights-snap.git +yarn create @metamask/snap transaction-insights-snap +# or... +npm create @metamask/snap transaction-insights-snap ``` To initialize your development environment with the required dependencies, in your project