diff --git a/content/roadmaps/105-vue/content/100-fundamental-topics/102-templates.md b/content/roadmaps/105-vue/content/100-fundamental-topics/102-templates.md
index fd5397edd..98e43e5b9 100644
--- a/content/roadmaps/105-vue/content/100-fundamental-topics/102-templates.md
+++ b/content/roadmaps/105-vue/content/100-fundamental-topics/102-templates.md
@@ -1 +1,6 @@
-# Templates
\ No newline at end of file
+# Templates
+
+Vue uses an HTML-based template syntax that allows you to declaratively bind the rendered DOM to the underlying component instance's data. All Vue templates are syntactically valid HTML that can be parsed by spec-compliant browsers and HTML parsers.
+
+<ResourceGroupTitle>Free Content</ResourceGroupTitle>
+<BadgeLink colorScheme='blue' badgeText='Official Docs' href='https://vuejs.org/guide/essentials/template-syntax.html'>Template Syntax</BadgeLink>
diff --git a/content/roadmaps/105-vue/content/100-fundamental-topics/103-directives.md b/content/roadmaps/105-vue/content/100-fundamental-topics/103-directives.md
index 511998d02..5f3954a18 100644
--- a/content/roadmaps/105-vue/content/100-fundamental-topics/103-directives.md
+++ b/content/roadmaps/105-vue/content/100-fundamental-topics/103-directives.md
@@ -1 +1,7 @@
-# Directives
\ No newline at end of file
+# Directives
+
+Directives are special attributes with the `v-` prefix. Vue provides a number of [built-in directives](https://vuejs.org/api/built-in-directives.html).
+
+<ResourceGroupTitle>Free Content</ResourceGroupTitle>
+<BadgeLink colorScheme='blue' badgeText='Official Docs' href='https://vuejs.org/guide/essentials/template-syntax.html#directives'>Directives Documentation</BadgeLink>
+
diff --git a/content/roadmaps/105-vue/content/100-fundamental-topics/104-api-styles/100-options-api.md b/content/roadmaps/105-vue/content/100-fundamental-topics/104-api-styles/100-options-api.md
index 7150a8775..043bd2621 100644
--- a/content/roadmaps/105-vue/content/100-fundamental-topics/104-api-styles/100-options-api.md
+++ b/content/roadmaps/105-vue/content/100-fundamental-topics/104-api-styles/100-options-api.md
@@ -1 +1,10 @@
-# Options api
\ No newline at end of file
+# Options API
+
+We use Options API in a Vue application to write and define different components. With this API, we can use options such as data, methods, and mounted.
+
+To state it simply, Options API is an old way to structure a Vue.JS application. Due to some limitations in this API, Composition API was introduced in Vue 3.
+
+<ResourceGroupTitle>Free Content</ResourceGroupTitle>
+<BadgeLink colorScheme='blue' badgeText='Official Documentation' href='https://vuejs.org/guide/typescript/options-api.html'>TypeScript with Options API</BadgeLink>
+<BadgeLink colorScheme='blue' badgeText='API Documentation' href='https://vuejs.org/api/#options-api'>Options API Documentation</BadgeLink>
+
diff --git a/content/roadmaps/105-vue/content/100-fundamental-topics/104-api-styles/101-composition-api.md b/content/roadmaps/105-vue/content/100-fundamental-topics/104-api-styles/101-composition-api.md
index 14871602b..64f23aea4 100644
--- a/content/roadmaps/105-vue/content/100-fundamental-topics/104-api-styles/101-composition-api.md
+++ b/content/roadmaps/105-vue/content/100-fundamental-topics/104-api-styles/101-composition-api.md
@@ -1 +1,10 @@
-# Composition api
\ No newline at end of file
+# Composition API
+
+With the release of Vue 3, developers now have access to the Composition API, a new way to write Vue components. This API allows features to be grouped together logically, rather than having to organize your single-file components by function. Using the Composition API can lead to more readable code, and gives the developer more flexibility when developing their applications.
+
+<ResourceGroupTitle>Free Content</ResourceGroupTitle>
+<BadgeLink colorScheme='blue' badgeText='Official Docs' href='https://vuejs.org/guide/typescript/composition-api.html'>TypeScript with Composition API</BadgeLink>
+<BadgeLink colorScheme='blue' badgeText='Official Docs' href='https://vuejs.org/guide/extras/composition-api-faq.html'>Composition API FAQ</BadgeLink>
+<BadgeLink colorScheme='blue' badgeText='API Docs' href='https://vuejs.org/api/#composition-api'>Composition API</BadgeLink>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://www.thisdot.co/blog/vue-3-composition-api-ref-and-reactive'>Vue 3 Composition API</BadgeLink>
+
diff --git a/content/roadmaps/105-vue/content/100-fundamental-topics/104-api-styles/readme.md b/content/roadmaps/105-vue/content/100-fundamental-topics/104-api-styles/readme.md
index 7de7587c3..e434ad022 100644
--- a/content/roadmaps/105-vue/content/100-fundamental-topics/104-api-styles/readme.md
+++ b/content/roadmaps/105-vue/content/100-fundamental-topics/104-api-styles/readme.md
@@ -1 +1,6 @@
-# Api styles
\ No newline at end of file
+# API Styles
+
+Up until Vue 2, there was one way to create components in Vue. With Vue 3, a new methodology was introduced called the Composition API. Now, if we want to make a component in Vue, we have two ways to do it. You might be wondering what the difference is, exactly, so let’s take a look at how the newer Composition API differs from the Vue 2 methodology, which is now known as the Options API
+
+<ResourceGroupTitle>Free Content</ResourceGroupTitle>
+<BadgeLink colorScheme='yellow' badgeText='Read' href='https://fjolt.com/article/vue-composition-api-vs-options-api'>The Difference Between the Composition API and Options API in Vue</BadgeLink>