docs: add programmatic navigation (#4074)

Co-authored-by: Pooya Parsa <pyapar@gmail.com>

docs/content/2.guide/3.directory-structure/10.pages.md

@@ -299,3 +299,27 @@ export default defineNuxtConfig({
   }
 })
 ```
+
+## Programmatic Navigation
+
+Nuxt 3 allows programmatic navigation through the `navigateTo()` utility method. Using this utility method, you will be able to programmatically navigate the user in your app. This is great for taking input from the user and navigating them dynamically throughout your application. In this example, we have a simple method called `navigation()` that gets called when the user submits a search form.
+
+**Note:** Ensure to always `await` on `navigateTo` or chain it's result by returning from functions.
+
+```vue
+<script setup>
+const router = useRouter();
+const name = ref('');
+const type = ref(1);
+
+function navigate(){
+  return navigateTo({
+    path: '/search',
+    query: {
+      name: name.value,
+      type: type.value
+    }
+  })
+}
+</script>
+```