docs(vscode): include references to VS Code extension (#858)

Author: alestiago

docs/docs/basics/middleware.md

@@ -45,3 +45,7 @@ To create new middleware on a Dart Frog project, run the following command:
 # Creates routes/hello/_middleware.dart
 dart_frog new middleware "/hello"
 ```
+
+:::tip
+Install and use the [Dart Frog VS Code extension](https://marketplace.visualstudio.com/items?itemName=VeryGoodVentures.dart-frog) to easily create new middleware within your IDE.
+:::

docs/docs/basics/resources.md

@@ -7,6 +7,8 @@ title: 📚 Additional Resources
 
 - [Awesome Dart Frog repo][awesome_dart_frog_link]: Highlights awesome Dart Frog resources — articles, videos, open source projects, and more!
 
+- [Dart Frog VS Code extension](https://marketplace.visualstudio.com/items?itemName=VeryGoodVentures.dart-frog): extends VS Code with support for Dart Frog and provides tools for effectively managing Dart Frog projects within VS Code.
+
 :::info
 Fun fact: Did you know the [dart2js][dart2js_compiler_link] compiler [used to be called frog][dart2js_frog_pr_link]?
 :::

docs/docs/basics/routes.md

@@ -28,6 +28,10 @@ Managing routes in Dart Frog is essentially as simple as managing the file struc
 dart_frog new route "/hello"
 ```
 
+:::tip
+Install and use the [Dart Frog VS Code extension](https://marketplace.visualstudio.com/items?itemName=VeryGoodVentures.dart-frog) to easily create new routes within your IDE.
+:::
+
 ## Requests 📥
 
 All route handlers have access to information regarding the inbound request. In this section, we'll take a look at various ways in which we can interact with the inbound request.

docs/docs/overview.md

@@ -95,6 +95,8 @@ dart_frog build
 
 ✅ WebSocket Support 🔌
 
+✅ VS Code Extension 💻
+
 🚧 Generated Dart Client Package 📦
 
 🚧 Generated API Documentation 📔

docs/docs/tutorials/counter.md

@@ -73,6 +73,10 @@ cd ./counter
 dart_frog dev
 ```
 
+:::tip
+Install and use the [Dart Frog VS Code extension](https://marketplace.visualstudio.com/items?itemName=VeryGoodVentures.dart-frog) to easily create Dart Frog apps within your IDE.
+:::
+
 ## Running the development server
 
 You should now have a directory called `counter` -- `cd` into it:
@@ -164,6 +168,10 @@ Handler middleware(Handler handler) {
 }
 ```
 
+:::tip
+Install and use the [Dart Frog VS Code extension](https://marketplace.visualstudio.com/items?itemName=VeryGoodVentures.dart-frog) to easily create new middleware within your IDE.
+:::
+
 Now that we've defined the middleware, we can create our private `count` and provide the count to all sub routes:
 
 ```dart

docs/docs/tutorials/echo.md

@@ -73,6 +73,10 @@ cd ./echo
 dart_frog dev
 ```
 
+:::tip
+Install and use the [Dart Frog VS Code extension](https://marketplace.visualstudio.com/items?itemName=VeryGoodVentures.dart-frog) to easily create Dart Frog apps within your IDE.
+:::
+
 ## Running the development server
 
 You should now have a directory called `echo` -- `cd` into it:
@@ -137,6 +141,10 @@ Response onRequest(RequestContext context, String message) {
 Since this route handler corresponds to a dynamic route, we will received the parameter as an argument in `onRequest`.
 :::
 
+:::tip
+Install and use the [Dart Frog VS Code extension](https://marketplace.visualstudio.com/items?itemName=VeryGoodVentures.dart-frog) to easily create new dynamic routes within your IDE.
+:::
+
 Save the changes and hot reload should kick in ⚡️
 
 ```bash

docs/docs/tutorials/hello_world.md

@@ -58,6 +58,10 @@ cd ./hello_world
 dart_frog dev
 ```
 
+:::tip
+Install and use the [Dart Frog VS Code extension](https://marketplace.visualstudio.com/items?itemName=VeryGoodVentures.dart-frog) to easily create Dart Frog apps within your IDE.
+:::
+
 ## Running the development server
 
 You should now have a directory called `hello_world` -- `cd` into it:

docs/docs/tutorials/todos.md

@@ -76,6 +76,10 @@ cd ./todos
 dart_frog dev
 ```
 
+:::tip
+Install and use the [Dart Frog VS Code extension](https://marketplace.visualstudio.com/items?itemName=VeryGoodVentures.dart-frog) to easily create Dart Frog apps within your IDE.
+:::
+
 ## Running the development server
 
 You should now have a directory called `todos` -- `cd` into it:
@@ -489,6 +493,10 @@ We're providing a single instance of the `TodosDataSource` so we have a single s
 In addition, we're using the `requestLogger` middleware from `package:dart_frog` to log all requests for debugging.
 :::
 
+:::tip
+Install and use the [Dart Frog VS Code extension](https://marketplace.visualstudio.com/items?itemName=VeryGoodVentures.dart-frog) to easily create new middleware within your IDE.
+:::
+
 ## Creating the `/todos` route
 
 Next, delete the root route handler at `routes/index.dart` and create a route handler for the `/todos` endpoint by creating `routes/todos/index.dart`:
@@ -532,6 +540,10 @@ Future<Response> _post(RequestContext context) async {
 }
 ```
 
+:::tip
+Install and use the [Dart Frog VS Code extension](https://marketplace.visualstudio.com/items?itemName=VeryGoodVentures.dart-frog) to easily create new routes within your IDE.
+:::
+
 :::note
 We're using `context.read<TodosDataSource>` to access the provided instance of the `TodosDataSource`.
 :::

docs/docs/tutorials/web_socket_counter.md

@@ -63,6 +63,10 @@ cd ./web_socket_counter
 dart_frog dev
 ```
 
+:::tip
+Install and use the [Dart Frog VS Code extension](https://marketplace.visualstudio.com/items?itemName=VeryGoodVentures.dart-frog) to easily create Dart Frog apps within your IDE.
+:::
+
 ## Running the development server
 
 You should now have a directory called `web_socket_counter`. Let's change directories into the newly created project:
@@ -109,6 +113,10 @@ Response onRequest(RequestContext context) {
 
 We can also delete the root endpoint at `routes/index.dart` since we won't be needing it for this example.
 
+:::tip
+Install and use the [Dart Frog VS Code extension](https://marketplace.visualstudio.com/items?itemName=VeryGoodVentures.dart-frog) to easily create new routes within your IDE.
+:::
+
 Save the changes and hot reload should kick in ⚡️
 
 ```
@@ -307,6 +315,10 @@ Handler middleware(Handler handler) => handler.use(counterProvider);
 For more information, refer to the [middleware documentation](/docs/basics/middleware).
 :::
 
+:::tip
+Install and use the [Dart Frog VS Code extension](https://marketplace.visualstudio.com/items?itemName=VeryGoodVentures.dart-frog) to easily create new middleware within your IDE.
+:::
+
 ## Using the Counter
 
 We can access the `CounterCubit` instance from our WebSocket handler via `context.read<CounterCubit>()`.