<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Elizabeth Bassey</title>
    <description>The latest articles on DEV Community by Elizabeth Bassey (@devliz).</description>
    <link>https://dev.to/devliz</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F459595%2Fbcfdad05-51c1-4e63-8653-08bb44bbc3da.jpg</url>
      <title>DEV Community: Elizabeth Bassey</title>
      <link>https://dev.to/devliz</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/devliz"/>
    <language>en</language>
    <item>
      <title>Build A Mastra Documentation With Thally</title>
      <dc:creator>Elizabeth Bassey</dc:creator>
      <pubDate>Sat, 24 Oct 2026 01:26:34 +0000</pubDate>
      <link>https://dev.to/devliz/build-a-mastra-documentation-with-thally-the-product-knowledge-layer-for-software-teams-onm</link>
      <guid>https://dev.to/devliz/build-a-mastra-documentation-with-thally-the-product-knowledge-layer-for-software-teams-onm</guid>
      <description>&lt;p&gt;Software development is changing, and so are documentation needs. For the longest time, humans (Software Engineers, Product Managers etc.) have been the sole users of documentation. They use documentation as guides to learn about new tools and how to use them. This means Technical writers have had to ensure that documentation stay updated, relevant and accurate. They’d frequently sync with product and engineering teams to learn about new features, audit docs for broken links, and fix or replace stale content. This process hasn’t changed a bit, however the pace and standard for keeping documentation relevant just got higher.&lt;/p&gt;

&lt;p&gt;Humans are no longer the only users of documentation, we have the new users known as &lt;strong&gt;AI Agents&lt;/strong&gt;. Software developers use these Agents to ship faster. The agents connect to documentation, read through them and use the information they need to build and ship products, at a faster rate. Features that used to take a month can now be built in days, yet documentation still have to stay updated, to ensure relevance and accuracy.&lt;/p&gt;

&lt;p&gt;To be honest, managing this manually would be a daunting task. A Technical Writer or team of Technical Writers who try to keep up with this pace could get exhausted and the docs would be prone to error. To be efficient, they’ll need the right tools to automates relevant processes while still staying in the loop. &lt;a href="https://thally.io/" rel="noopener noreferrer"&gt;Thally&lt;/a&gt; is that tool. &lt;/p&gt;

&lt;p&gt;This article introduces Thally - the Documentation tool for the AI era, explains how it works, and guides you through how to build your first Thally documentation.&lt;/p&gt;

&lt;h2&gt;
  
  
  Table of Contents
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;What is Thally?&lt;/li&gt;
&lt;li&gt;How Thally Works&lt;/li&gt;
&lt;li&gt;
Building with Thally

&lt;ul&gt;
&lt;li&gt;Building a new documentation&lt;/li&gt;
&lt;li&gt;Building your first Thally documentation&lt;/li&gt;
&lt;li&gt;Stage 1 - Setting up&lt;/li&gt;
&lt;li&gt;Stage 2 - Edit content&lt;/li&gt;
&lt;li&gt;Edit File Content.&lt;/li&gt;
&lt;li&gt;Information Architecture&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;Finishing up&lt;/li&gt;
&lt;li&gt;Conclusion&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  What is Thally?
&lt;/h2&gt;

&lt;p&gt;Thally is the product knowledge layer for software teams. I’d like to call it the knowledge layer for the AI era. It is designed for product teams who care to serve both humans and agents. And most importantly, it ensures that the product content on your documentation, websites and other knowledge layers are monitored and updated where and when necessary, so writers can focus on what matters.&lt;/p&gt;

&lt;p&gt;Thally provide tools for building, deploying, tracking, updating and observing your product knowledge bases.&lt;/p&gt;

&lt;h2&gt;
  
  
  How Thally Works
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;Connects to product repository:&lt;/strong&gt; Thally requests for and connects to the repository where your product, documentation, website, support or knowledge systems live, so it can monitor for changes.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Tracks and updates changes:&lt;/strong&gt; Once there’s an update in the repo, Thally tracks the change, evaluates it and creates a pull request for review.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Content update:&lt;/strong&gt; Once the pull request is reviewed and approved, Thally updates the change in the relevant content page.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Analytics:&lt;/strong&gt; Thally keeps an eye on the published content, observing and tracing impacts across all relevant content layers.&lt;/p&gt;

&lt;h2&gt;
  
  
  Building with Thally
&lt;/h2&gt;

&lt;p&gt;Thally allows you to either build agent-ready documentation from scratch or import from other documentation platforms. You can import from platforms like Gitbook, Mintlify, Docusaurus, Vitepress, Nextra, and Starlight.&lt;/p&gt;

&lt;h3&gt;
  
  
  Building a new documentation
&lt;/h3&gt;

&lt;p&gt;You can build with Thally in 2 major ways:&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Thally Cloud:&lt;/strong&gt; With Thally cloud, you can build, deploy, track, update, observe and manage your documentation or knowledge base through your Thally platform.&lt;/p&gt;

&lt;p&gt;Thally offers a free &lt;code&gt;.thally.app&lt;/code&gt; domain for this feature. You can also connect your custom domain when you want.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Thally CLI:&lt;/strong&gt; With Thally CLI, you can serve and host your documentation platform locally, then deploy it wherever you want.&lt;/p&gt;

&lt;p&gt;However, Thally recommends that you use the Thally Cloud option for seamless management of your product knowledge bases.&lt;/p&gt;

&lt;h3&gt;
  
  
  Building your first Thally documentation
&lt;/h3&gt;

&lt;p&gt;In this section, you’ll be learning how to build your first documentation on the Thally platform.&lt;/p&gt;

&lt;p&gt;You’ll follow along with the steps in this guide, to get the result on the ui  below:&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fia602vuyxbjkgzhgazw6.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fia602vuyxbjkgzhgazw6.png" alt="thally-mastra-docs" width="800" height="357"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;For the purpose of this guide, you’ll recreate the Mastra Documentation with me. Mastra is a Typescript framework for building AI agents.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Disclaimer:&lt;/strong&gt; This documentation and its content is independent of the  Mastra brand. It is designed soly for learning purpose. To learn about Mastra, please look up the &lt;a href="https://mastra.ai/" rel="noopener noreferrer"&gt;official Mastra documentation&lt;/a&gt; for relevant information.&lt;/p&gt;




&lt;h3&gt;
  
  
  Stage 1 - Setting up
&lt;/h3&gt;

&lt;p&gt;To follow along with this guide, you’ll need to create an account on &lt;a href="https://thally.io/" rel="noopener noreferrer"&gt;Thally&lt;/a&gt;. A free account will do just fine for now.&lt;/p&gt;

&lt;p&gt;Once your account has been set up, you should see a workspace like the one below. You can create and manage your documentation site on this workspace.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Faqcwlm6cq05ohh77wnc7.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Faqcwlm6cq05ohh77wnc7.png" alt="your-thally-workspace" width="800" height="343"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;To create your new documentation site, click on the yellowish-green &lt;strong&gt;create a site&lt;/strong&gt; button on the top-right corner of the dashboard.&lt;/p&gt;

&lt;p&gt;Next, you’ll be asked to give your site a name, enter a suitable name and a one-line description of your project site in the inputs provided. Then click on the &lt;strong&gt;Continue&lt;/strong&gt; button below.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fjv34jqfpovhupdozto6t.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fjv34jqfpovhupdozto6t.png" alt="enter-site-name" width="800" height="354"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Where does your docs live?. In this section, you can either create a Github repo for your docs, paste a docs link or use an existing repo. For this example, we’ll be creating a new Github repo for the docs.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fxcoqdxnoc3p5momkydpb.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fxcoqdxnoc3p5momkydpb.png" alt="create-github-repo" width="800" height="356"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Next you’ll have to check if Thally is already connected to your github account, if not, you’ll be prompted to connect. Click on the &lt;em&gt;Check Github&lt;/em&gt; button to verify.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fxite22ohd3wgk0dnp3lb.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fxite22ohd3wgk0dnp3lb.png" alt="check-github-repo" width="800" height="357"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;If your Github doesn’t have Thally installed already?, now you’ll have to install. Click on the &lt;strong&gt;Install app&lt;/strong&gt; button provided.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fi99e2epyze080440kppl.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fi99e2epyze080440kppl.png" alt="github-install" width="800" height="369"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Now Thally can access your github repositories, select which repository you would want your docs to live in or create a new repo.&lt;/p&gt;

&lt;p&gt;In my case, I selected a repo I created for the docs already. Once you’ve selected, you can press &lt;strong&gt;Continue&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fpp9vynr8xlq568gma8yk.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fpp9vynr8xlq568gma8yk.png" alt="select-repo" width="800" height="373"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Now your docs site is ready to be published. Review your settings, then click on &lt;strong&gt;Publish site&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fgfvspjgvyczh4wa4cqs3.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fgfvspjgvyczh4wa4cqs3.png" alt="publish-site" width="800" height="378"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Once published, you’ll find a summary data on your dashboard. Click on the live link to see your site preview.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F0mwf3iw9pn9dwnciuqow.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F0mwf3iw9pn9dwnciuqow.png" alt="preview-site-link" width="799" height="375"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;You’ll see a live preview like the image below, with a few files and placeholder data to get you started.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F91u0zw8veo5cjijhb424.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F91u0zw8veo5cjijhb424.png" alt="preview-site" width="800" height="321"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Now you have to update the docs with your own content.&lt;/p&gt;




&lt;h3&gt;
  
  
  Stage 2 - Edit content
&lt;/h3&gt;

&lt;p&gt;Once your docs is published, the content files are pushed to your github repo. Visit the repository you connected (you can find the link to your repo on the component where your live-preview link is). Open and clone the repo to your local machine.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fnnb4saspbne3yralap2z.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fnnb4saspbne3yralap2z.png" alt="github-repo-link" width="799" height="375"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;After the cloning is completed, open the folder in your code editor of choice.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F6dqaebrkm8nrtn9wsr2a.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F6dqaebrkm8nrtn9wsr2a.png" alt="open-in-editor" width="800" height="425"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;To preview the page locally, ensure you are in the project directory, then run &lt;code&gt;npm install&lt;/code&gt; to install all dependencies.&lt;/p&gt;

&lt;p&gt;Next, run &lt;code&gt;npm run dev&lt;/code&gt; to preview.&lt;/p&gt;

&lt;p&gt;Now you’re ready to start editing your docs content. You’re mostly going to edit the files in &lt;code&gt;src/content&lt;/code&gt; for page content, &lt;code&gt;docs.json&lt;/code&gt; for information architecture and &lt;code&gt;data/site.ts&lt;/code&gt; for brand customization.&lt;/p&gt;

&lt;p&gt;You’ll work on the content file first because you’ll need them to create the information architecture (navigation and sidebar) of the documentation.&lt;/p&gt;

&lt;p&gt;You can edit the existing files or create a new &lt;strong&gt;.MDX&lt;/strong&gt; file if you need more content. For this guide we’ll be working with the existing files.&lt;/p&gt;

&lt;h3&gt;
  
  
  Edit File Content.
&lt;/h3&gt;

&lt;p&gt;Every page in the MDX file has 2 sections, the upper-part for the frontmatter and the lower part for MD and MDX content.&lt;/p&gt;

&lt;p&gt;The frontmatter contains meta-data about the page like the page title, description etc. and is useful in describing the page content and it’s seo visibility.&lt;/p&gt;

&lt;p&gt;You can learn more about how &lt;a href="https://docs.thally.io/guides/frontmatter" rel="noopener noreferrer"&gt;frontmatter in Thally&lt;/a&gt; works.&lt;/p&gt;

&lt;p&gt;The MD and MDX section is where you write your Markdown files or import MDX (React-like) components.&lt;/p&gt;




&lt;p&gt;Open introduction.md and change the title of the introduction page to &lt;strong&gt;“What is Mastra?”&lt;/strong&gt;. And it’s description to &lt;strong&gt;“Discover what Mastra is, who it is for and how to start building with Mastra”&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fuodr7w1rp3dcyhrs3zss.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fuodr7w1rp3dcyhrs3zss.png" alt="introduction-page" width="800" height="428"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;For the content on the section, please copy the file content from the &lt;a href="https://github.com/Dev-Liz/mastra-test-doc" rel="noopener noreferrer"&gt;Github repo&lt;/a&gt; for this project.&lt;/p&gt;

&lt;p&gt;The file content would be plain text, except where other components are necessary. Visit &lt;a href="https://docs.thally.io/components/badge" rel="noopener noreferrer"&gt;components&lt;/a&gt; to see all Thally components available to you and how to use them.&lt;/p&gt;

&lt;p&gt;Every other headings in the page must be from heading 2 (denoted with ##) and below. The page title is automatically an heading1.&lt;/p&gt;

&lt;p&gt;Once you’re done editing the file, save and ensure also to change the file name to align with its title.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Edit all other files too&lt;/strong&gt;.&lt;/p&gt;

&lt;h3&gt;
  
  
  Information Architecture
&lt;/h3&gt;

&lt;p&gt;Once your content files are ready. Navigate to &lt;code&gt;docs.json&lt;/code&gt; to edit the navigation for the docs.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fcijrmos2l0nqdzonmgpp.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fcijrmos2l0nqdzonmgpp.png" alt="navigation" width="800" height="425"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;In the &lt;strong&gt;"tabs"&lt;/strong&gt; array objects, values for &lt;strong&gt;"tab"&lt;/strong&gt; properties are what you see on the navigation bar, while &lt;strong&gt;"groups"&lt;/strong&gt; and &lt;strong&gt;"pages"&lt;/strong&gt; are the sidebars. Check out the file on github and edit to have the exact navbar on the final ui.&lt;/p&gt;

&lt;h2&gt;
  
  
  Finishing up
&lt;/h2&gt;

&lt;p&gt;Once you you’re done with the edits, ensure to commit your changes. Then run the prompts below before pushing to github.&lt;br&gt;
&lt;code&gt;npx --yes @thallylabs/cli@latest check&lt;br&gt;
npm run build&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;Once your files have been pushed to github, Thally automatically tracks and loads the changes to your site. Refresh your live preview link to see your updated site.&lt;/p&gt;

&lt;p&gt;Viola! You have built your first Thally documentation site.&lt;/p&gt;

&lt;h2&gt;
  
  
  Conclusion
&lt;/h2&gt;

&lt;p&gt;This article explained why technical writers need efficient tools like Thally to keep up with the pace of how software products are being shipped in the AI era. It further introduced Thally and how it works, then guided you on a journey to building a Mastra documentation with Thally.&lt;/p&gt;

&lt;p&gt;If you would like to learn more about how Thally works, please visit the &lt;a href="https://thally.io/" rel="noopener noreferrer"&gt;Thally website&lt;/a&gt; and &lt;a href="https://docs.thally.io/" rel="noopener noreferrer"&gt;official documentation&lt;/a&gt; for relevant information.&lt;/p&gt;

</description>
      <category>documentation</category>
      <category>thally</category>
      <category>mastra</category>
      <category>ai</category>
    </item>
    <item>
      <title>Capabilities Of AI Agents</title>
      <dc:creator>Elizabeth Bassey</dc:creator>
      <pubDate>Mon, 31 Aug 2026 09:34:48 +0000</pubDate>
      <link>https://dev.to/devliz/capabilities-of-ai-agents-4eep</link>
      <guid>https://dev.to/devliz/capabilities-of-ai-agents-4eep</guid>
      <description>&lt;p&gt;AI agents are highly flexible, and there a few core features that power their intelligence and efficiency. These features work together to ensure that the agent understands goals, plans steps and interacts with other systems. They include:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Autonomous Action:&lt;/strong&gt; Agents can perform complex tasks and workflows with little or no human intervention.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Reasoning and Planning:&lt;/strong&gt; Agents leverage advance AI models to make informed decisions and adapt to chaging environments.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Continous Learning:&lt;/strong&gt; Agents can learn from experience and continously improve their performance over time.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;While the above listed features enable a single agent perform tasks, working with other agents often enables an agent to reach its maximum potential.&lt;/p&gt;

&lt;h2&gt;
  
  
  &lt;strong&gt;Multi-agents collaboration&lt;/strong&gt;
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fisvg75zq979ccnk3rzv6.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fisvg75zq979ccnk3rzv6.png" alt="Multi-agent" width="799" height="446"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;When agents work together, they’re able to share knowledge, divide complex tasks and co-ordinate their actions to achieve large-scale goals that may be impossible for a single agent to manage alone. &lt;/p&gt;

&lt;p&gt;This ability to chain actions and collaborate makes them invaluable in the workplace.&lt;/p&gt;

&lt;h2&gt;
  
  
  How Agents Help In The Workplace
&lt;/h2&gt;

&lt;p&gt;Agents analyze situations, use multiple tools and make informed decisions without requiring constant human Input. They are also capable of handling multi-step tasks that a model alone cannot, such as:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Researching a topic&lt;/li&gt;
&lt;li&gt;Trouble shooting code&lt;/li&gt;
&lt;li&gt;Accessing a system by chaining together actions etc.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;AI agents can perform actions across many industries. Examples include:&lt;/p&gt;

&lt;h3&gt;
  
  
  Customer Service
&lt;/h3&gt;

&lt;p&gt;Agents can create support tickets, process simple refunds, and autonomously resolve complex customer issues using internal knowledge bases without human intervention.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;&lt;em&gt;Example workflow for autonomous refund process:&lt;/em&gt;&lt;/strong&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;A customer asks for a complex refund.&lt;/li&gt;
&lt;li&gt;The main orchestrator agent sends the task to a verifcation agent to check the rules and look up the order details.&lt;/li&gt;
&lt;li&gt;The verification agent sends the approved information to the fulfilment agent.&lt;/li&gt;
&lt;li&gt;The fulfilment agent then handles the money refund all by itself and sends the final confirmation email to the customer.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F6xyfvo92kkb216xs92st.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F6xyfvo92kkb216xs92st.png" alt="Customer Service Agent" width="800" height="609"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  Marketing
&lt;/h3&gt;

&lt;p&gt;Agents can generate personalized marketing campaigns, including drafting ad copy, finding and creating images, scheduling posts and analyzing user behaviour.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;&lt;em&gt;Example workflow for a personalized campaign launch:&lt;/em&gt;&lt;/strong&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;The main orchestrator agent starts a new product campaign.&lt;/li&gt;
&lt;li&gt;It tells a copywriting agent to create graphics aligned with the company’s brand Identity.&lt;/li&gt;
&lt;li&gt;The scheduling agent chooses the best times to post online to maximize engagement from the target audience.&lt;/li&gt;
&lt;li&gt;Finally, an analytics agent reviews the performance of the ads and tells the main orchestrator agent how to make them better.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F9d6ctz7u5ibkeonzz5fe.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F9d6ctz7u5ibkeonzz5fe.png" alt="Marketing Agent" width="800" height="609"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  Research and Analysis
&lt;/h3&gt;

&lt;p&gt;Agents can perform multi-step research using web searches to gather current data. Summarizing findings and then writing a final report or drafting an email.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;&lt;em&gt;Example workflow for generating a market analysis report:&lt;/em&gt;&lt;/strong&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;The orchestrator agent is asked to write a report. &lt;/li&gt;
&lt;li&gt;It tells a specialized research agent to search the internet for relevant fact and staticstics.&lt;/li&gt;
&lt;li&gt;The raw data the research agent gathers go to a data cleaning agent to be normalized and properly formatted.&lt;/li&gt;
&lt;li&gt;A synthesis agent reviews the clean data and writes the first draft of the report.&lt;/li&gt;
&lt;li&gt;The final report is then sent out by the orchestrator agent.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F432lxhpy1ojvmcfda6lw.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F432lxhpy1ojvmcfda6lw.png" alt="Research and analysis agent" width="800" height="609"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  AI Agents vs Traditional chatbots
&lt;/h2&gt;

&lt;p&gt;The biggest distinction between a traditional chatbot and an agentic system is the ability to act autonomously across multiple systems to resolve a complex issue&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;&lt;em&gt;Resolving an issue with a chatbot&lt;/em&gt;&lt;/strong&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;Customer initiates complex request:&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Imagine a customer requires assistance with a mult-part issue, such as: “I need a refund for order #123, but I used two different gift cards and a credit card”.&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;Data Access Limitations&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;The chatbot can only access the order status API (to confirm the item was shipped/returned. But cannot access the finance/policy API needed to verify rules or process the payment splits.&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;Static Response&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;The chatbot responds with its only option for non-standard issues: “I am unable to process complex refunds, please wait for a human agent or call our support line.&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;Failure point&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;The chatbot fails to resolve the issue. The customer is forced to wait and a human agent must spend time manually gathering the necessary data (order details, payment sources, policy), that an agentic system can handle automatically.&lt;/p&gt;
&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;The complex refund is unresolved. The chatbot proved to be functionally limited, forcing the customer to experience a long wait time before their issue is addressed.&lt;/p&gt;




&lt;p&gt;Comparing the two scenerios involving a complex customer refund. The first scenerio utilized an AI agent that provided autonomous refund procesing (review the &lt;strong&gt;customer service&lt;/strong&gt; section above), while the second used a traditional chatbot. The chatbot failed, whereas the agentic system succeded. The key takeaway is that chatbots are limited predefined scripts while aI agents can autonomously act.&lt;/p&gt;

</description>
      <category>agents</category>
      <category>ai</category>
    </item>
    <item>
      <title>AI Agents: A High-Level Overview</title>
      <dc:creator>Elizabeth Bassey</dc:creator>
      <pubDate>Mon, 24 Aug 2026 16:40:59 +0000</pubDate>
      <link>https://dev.to/devliz/ai-agents-a-high-level-overview-5e7l</link>
      <guid>https://dev.to/devliz/ai-agents-a-high-level-overview-5e7l</guid>
      <description>&lt;p&gt;In my quest to learn about Agents progressively, I’m currently taking the &lt;a href="https://cloud.google.com/blog/topics/training-certifications/free-gemini-enterrprise-training" rel="noopener noreferrer"&gt;Google Cloud Agentic Summer course&lt;/a&gt;, powered by &lt;a href="https://developers.google.com/program/gear" rel="noopener noreferrer"&gt;Gemini Enterprise Agent Ready (GEAR).&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;I’ll be making frequent posts to share and re-enforce my learning around agents and ai-native documentation here. So, if this is something you’re interested in, please feel free to work with me.&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;strong&gt;PS: The posts for this challenge will be an incorporation of my notes from the GEAR course and practical case studies of agentic documentation projects I try myself.&lt;/strong&gt;&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;&lt;em&gt;So, let’s get into it:&lt;/em&gt;&lt;/p&gt;




&lt;h2&gt;
  
  
  What is an AI Agent?
&lt;/h2&gt;

&lt;p&gt;An AI agent is a software system that uses Artficial Intelligence, usually Large language model (LLM) to achieve a specific goal on behalf of the user.&lt;/p&gt;

&lt;p&gt;Think of it as an assistant who can carry out a task on your behalf and has all the right tools needed to execute this task.&lt;/p&gt;

&lt;h2&gt;
  
  
  Components of an agent
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fell5tcnauqi7hylryqre.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fell5tcnauqi7hylryqre.png" alt="agent components" width="799" height="446"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;An agent at a basic level is made up of 3 major components:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;An LLM:&lt;/strong&gt; An agent needs to have some sort of model it uses for inference or intelligence.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Tools:&lt;/strong&gt; An agent needs tools to interact with the world around it,&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Contextual memory:&lt;/strong&gt; This gives an agent the ability to retain, organize and use information from past interactions and user preferences to guide future actions.&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  LLMS
&lt;/h3&gt;

&lt;p&gt;LLMs are the thinking models of an agent. This means that the model has the ability to self-reflect built into it. These models are good for agents where tasks may be complex and the model needs to consider a set of ideas or responses before it makes the final response to the user or another agent.&lt;/p&gt;

&lt;h3&gt;
  
  
  Tools
&lt;/h3&gt;

&lt;p&gt;Many agents use a protocol called &lt;strong&gt;Model context protocol (MCP)&lt;/strong&gt; to access and use tools. MCPs are like an API except they provides an additional instructions about how an API is actually used and what the meaning of the inputs and outputs are. This gives the agent knowledge about when and where to use a specific MCP tool or an API in specific situations.&lt;/p&gt;

&lt;h3&gt;
  
  
  Memory
&lt;/h3&gt;

&lt;p&gt;Memory in its simplest form is the context window for an agent. It enables the agent to act as a smart assistant that can keep track of continous threads of instructions. &lt;/p&gt;

&lt;p&gt;There are other forms of memory like short term or long term memory that you can also put with an agent architecture. &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Agents generate context-based memories as they perform interactions with their users or another agent in a system. As the context builds, the agents will generally have a better understanding of the task, what tools are available, and other items that are relevant to the goal.&lt;/li&gt;
&lt;li&gt;It may also use short-term or long-term memory to augment its context in order to achieve one of its objectives.&lt;/li&gt;
&lt;li&gt;However, contexts, just like when you’re working on a goal, requires active management.&lt;/li&gt;
&lt;li&gt;You want to think about updating your window as your task evolves, which could mean:

&lt;ul&gt;
&lt;li&gt;Compressing context&lt;/li&gt;
&lt;li&gt;Summarizing context&lt;/li&gt;
&lt;li&gt;Throwing context out if its not relevant&lt;/li&gt;
&lt;li&gt;Using other memory pieces to bring more context into the agent.&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Agent Patterns
&lt;/h2&gt;

&lt;p&gt;Agent patterns are ways in which you can create an agent or how you can create a team of agents that work together for your goal.&lt;/p&gt;

&lt;h3&gt;
  
  
  Basic Pattern
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F2elk5ltvrhua4mghsrb3.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F2elk5ltvrhua4mghsrb3.png" alt="Basic-agent-pattern" width="800" height="453"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;The most basic agent pattern is an agent with no loops or other agents. In this example, the agents has a set of instructions, some tools, and it's connected to a model.&lt;/p&gt;

&lt;p&gt;This pattern is useful for when we want to get started with an agent, or an agent where the object and directive is very clear. It’s also a great starting point for us to learn about agentic behaviour and then apply this to more complex use-cases down the road.&lt;/p&gt;

&lt;h3&gt;
  
  
  Sub-agent Pattern
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fipfcuhg8zt4k9qe30839.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fipfcuhg8zt4k9qe30839.png" alt="Sub-agent-pattern" width="799" height="447"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;In the sub-agent pattern, the main agent handles most task. But will offer more specific or specialized task to another agent that it has access to.&lt;/p&gt;

&lt;p&gt;In the sub-agent pattern, we typically hand-off a task for completion, but we are selective about the context that is applied.&lt;/p&gt;

&lt;p&gt;We might do this for something like processing an invoice. Where the agents that actually gets invoice information from a document is a highly specialized agent and the overall agent is a general worker who can move the work from step-to-step to get it through the entire processing pipeline.&lt;/p&gt;

&lt;h3&gt;
  
  
  Orchestrator Pattern
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F7u6kmjie1xkv23l2k1lq.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F7u6kmjie1xkv23l2k1lq.png" alt="Orchestrator agent pattern" width="800" height="441"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;In this pattern, the starting agent starts as a router, the router agent then sends request along to the next agent that it has determined can best answer a request that a user or another agent has. &lt;/p&gt;

&lt;p&gt;While the router may seem simple, identifying the intent that a user or another agent has, can actually be very difficult to do right. It has to be fast at doing this and to get the user to the right agent for the next level of intent, to answer a question for example. &lt;/p&gt;

&lt;p&gt;You can think of this like an overall agent that handles a store-front for questions related to ordering, orders or support, and has a handoff that intent to the next available agent in it.&lt;/p&gt;

&lt;p&gt;These are only a few agent patterns, do well to expolore other agent patterns out there.&lt;/p&gt;

</description>
      <category>ai</category>
      <category>agents</category>
    </item>
    <item>
      <title>Building A Fruit Vendor &amp; AI Nutritionist Platform With AI Studio</title>
      <dc:creator>Elizabeth Bassey</dc:creator>
      <pubDate>Wed, 12 Aug 2026 16:45:30 +0000</pubDate>
      <link>https://dev.to/devliz/building-a-fruit-vendor-ai-nutritionist-with-ai-studio-53j9</link>
      <guid>https://dev.to/devliz/building-a-fruit-vendor-ai-nutritionist-with-ai-studio-53j9</guid>
      <description>&lt;p&gt;&lt;em&gt;This post is my submission for &lt;a href="https://dev.to/deved/build-apps-with-google-ai-studio"&gt;DEV Education Track: Build Apps with Google AI Studio&lt;/a&gt;.&lt;/em&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  What I Built
&lt;/h2&gt;

&lt;p&gt;I built a fruit vendor platform that personalizes the buyer's request based on their health needs (specifically for those who can't afford to buy or are skeptical about using supplements).&lt;/p&gt;

&lt;h3&gt;
  
  
  The plaform features:
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Fruit products&lt;/li&gt;
&lt;li&gt;AI Nutritionist &lt;/li&gt;
&lt;li&gt;Vitality Quiz&lt;/li&gt;
&lt;li&gt;Consultation Booking&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Features I used:
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;I used Imagen API for images&lt;/li&gt;
&lt;li&gt;Gemini for platform copies &lt;/li&gt;
&lt;li&gt;Gemini AI for AI consultation.&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  My Prompt
&lt;/h3&gt;

&lt;blockquote&gt;
&lt;p&gt;I need to create a functional landing page design for a fruit-themed business. Let's say a fruit themed business that offers fruit salads, juice, smoothies etc. &lt;/p&gt;

&lt;p&gt;But I do not just want it to be about selling the fruits or product. I want it to also share valueable health and nutrition benefits and recipes for different health aspect, for example: for building glowing skin, brighter vision, staying healthy, weight gain or loss etc.&lt;/p&gt;

&lt;p&gt;This is because we understand that supplements are expensive and might not be easily affordable compared to fruits. And some people are just skeptical about supplements (because they're not sure how supplement are processed) but would rather go for fruits because they're natural, so our products are exactly what they need.&lt;/p&gt;

&lt;p&gt;Share how our tips and recipes are credible because we work with gym professionals, health coaches and nutritionists. With call to action about how people can place their order or reach out to our professional consultants. Make it in such a way that, a user who just craved fruit salad or juice, ends up finding more health tips and value and can easily reach out for consultation when they want. Make the storytelling very captivating and engaging too. And don't forget to give the brand a suitable name.&lt;/p&gt;

&lt;p&gt;Use Imagen for visuals gemini for copy generation.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;h2&gt;
  
  
  Demo
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F9fn0e54w0ydbdlrm3jrj.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F9fn0e54w0ydbdlrm3jrj.png" alt="Fruit vendor and ai nutritionist platform" width="799" height="471"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Applet&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;
&lt;div class="crayons-card c-embed text-styles text-styles--secondary"&gt;
    &lt;div class="c-embed__content"&gt;
      &lt;div class="c-embed__body flex items-center justify-between"&gt;
        &lt;a href="https://accounts.google.com/v3/signin/identifier?continue=https://aistudio.google.com/apps/33a49791-cde7-476c-b313-aaae4d44a70b&amp;amp;followup=https://aistudio.google.com/apps/33a49791-cde7-476c-b313-aaae4d44a70b&amp;amp;passive=1209600&amp;amp;flowName=WebLiteSignIn&amp;amp;flowEntry=ServiceLogin&amp;amp;dsh=S1209851966:1786553946005353" rel="noopener noreferrer" class="c-link fw-bold flex items-center"&gt;
          &lt;span class="mr-2"&gt;accounts.google.com&lt;/span&gt;
          

        &lt;/a&gt;
      &lt;/div&gt;
    &lt;/div&gt;
&lt;/div&gt;


&lt;h2&gt;
  
  
  My Experience
&lt;/h2&gt;

&lt;p&gt;This is a product I'm actually trying to work on, but I needed an initial prototype to see what the design would look like. I was thrilled to see AI studio generate the entire components and logic and even integrated an AI functionality.&lt;/p&gt;

&lt;p&gt;And when there was an error with a prompt to fix, AI studio fixed it itself. &lt;/p&gt;

&lt;p&gt;Gemini did a good job on the copies too. However, I think I could still improve on the them.&lt;/p&gt;

&lt;p&gt;I also love that I could export my codes, so I can continue to work on them on locally.&lt;/p&gt;

</description>
      <category>deved</category>
      <category>learngoogleaistudio</category>
      <category>ai</category>
      <category>gemini</category>
    </item>
    <item>
      <title>How I’m Learning To Use AI In My Workflow As A Junior Dev</title>
      <dc:creator>Elizabeth Bassey</dc:creator>
      <pubDate>Tue, 11 Aug 2026 09:10:31 +0000</pubDate>
      <link>https://dev.to/devliz/how-im-learning-to-use-ai-in-my-workflow-as-a-junior-dev-3m2h</link>
      <guid>https://dev.to/devliz/how-im-learning-to-use-ai-in-my-workflow-as-a-junior-dev-3m2h</guid>
      <description>&lt;p&gt;Recently I have been struggling between staying focused to learn coding and building with AI to get projects on my portfolio faster. But as a person who loves to learn from the ground up, I  have decided to stay with the former. However I also want to keep up with the industry standard to stay relevant. &lt;/p&gt;

&lt;p&gt;So here is my approach to balancing both:&lt;/p&gt;

&lt;h2&gt;
  
  
  Learn the fundamentals (without AI):
&lt;/h2&gt;

&lt;p&gt;Fundamental is key. Focusing on the fundamentals at this early stage would help me understand what is important and why. For example:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;How the web works&lt;/li&gt;
&lt;li&gt;The concepts of the clients, server and APIs.&lt;/li&gt;
&lt;li&gt;Why every HTML tags and attributes are used&lt;/li&gt;
&lt;li&gt;Why using semantic elements over divs improves accessibility&lt;/li&gt;
&lt;li&gt;Why CSS is relevant and different ways to implement it&lt;/li&gt;
&lt;li&gt;Why frameworks and libraries?&lt;/li&gt;
&lt;li&gt;How frameworks build upon their vanilla counterparts.&lt;/li&gt;
&lt;li&gt;How to figure and debug my codes&lt;/li&gt;
&lt;li&gt;Knowing a good code from a bad one.&lt;/li&gt;
&lt;li&gt;And generally improving my problem-solving skills&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Generating codes with AI without understanding these fundamentals would be building a house on a shaky ground, which would eventually collapse.&lt;/p&gt;

&lt;h2&gt;
  
  
  Enhance my learning with AI Chats:
&lt;/h2&gt;

&lt;p&gt;Once I have mastered the fundamentals, adding AI to my learning toolbox enhances my learning experience. In earlier coding days, one would have to run to platforms like stackoverflow, reddit etc. to find a similar problem and an approach to solving it. Or be extremely good at googling and asking questions in general. These skills are still very relevant. But AI just makes things easier.&lt;/p&gt;

&lt;p&gt;An AI chat is that senior dev just a prompt away. It responds really fast, saves time and improves learning.&lt;/p&gt;

&lt;h3&gt;
  
  
  What I wouldn’t do in this phase though:
&lt;/h3&gt;

&lt;p&gt;Copying AI responses directly into my code without understanding them. &lt;/p&gt;

&lt;h3&gt;
  
  
  Best way to approach this:
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Ask AI to explain every line of code and why:&lt;/strong&gt; This will help me understand why every code decision is made.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Type the codes out myself into my project:&lt;/strong&gt; This will get me familiar with the code and help solidify my learning.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Use AI to automate concepts I already understand:
&lt;/h2&gt;

&lt;p&gt;The goal of AI is to speed up my workflow right? Recently I explored using AI Agent directly in my code (using Github copilot), to automate my tailwind design and style tokens. The AI did a great job importing tailwind and google fonts. Created the root variables. But did not get the variables in the &lt;a class="mentioned-user" href="https://dev.to/theme"&gt;@theme&lt;/a&gt; directory right. &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fs6sj20mvcisc5w9zwfx4.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fs6sj20mvcisc5w9zwfx4.png" alt="ai-agent-in-code-prompt" width="800" height="425"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fhwlow5nzzyszsd1a2pu6.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fhwlow5nzzyszsd1a2pu6.png" alt="ai-agent-in-code-generated" width="800" height="426"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fxu3jp568fetn30y7zlnj.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fxu3jp568fetn30y7zlnj.png" alt="ai-agent-in-code-result" width="799" height="423"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;I knew it wasn’t correct and could fix the errors myself because this is a process I’ve had to code manually for several times. &lt;/p&gt;

&lt;p&gt;During this project:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;I learnt to feed context to the agent.&lt;/li&gt;
&lt;li&gt;I learnt to review before accepting the code generated by the agent.&lt;/li&gt;
&lt;li&gt;I learnt to fix the bad codes myself.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;This experience even though I had to go back and forth with my prompt, gave me the confidence to want to explore Agents further. &lt;/p&gt;

&lt;h2&gt;
  
  
  Explore Context-Driven Prompting With AI Agents:
&lt;/h2&gt;

&lt;p&gt;This is the area I wish to explore next. In my previous project, I had to give the agent access to specific files (like index.css) for context, alongside a series of prompts. But typing too many prompts into the agent at once can overwhelm it.&lt;/p&gt;

&lt;p&gt;In context driven prompt, I will have to create a dedicated file (.md), where I write my project constraint and standards for the Agent to follow. This would provide a persistent, and structured way to configure the agent compared to just prompting into the chat. And it will be easy to track with Git.&lt;/p&gt;

&lt;p&gt;A context file can be a universal markdown file like AGENTS.md or an agent-specific file like CLAUDE.md.&lt;/p&gt;

&lt;h2&gt;
  
  
  Explore Spec-Driven Development With AI-Agent
&lt;/h2&gt;

&lt;p&gt;This is the stage where I get to fully delegate my end-to-end tasks to the Agent. Here, I’ll have to write a list of files with full features that are executable to the Agent. It contains the product requirements, business logic, technical requirements, acceptance criteria etc. Basically what the Agent has to build and how to go about building it.&lt;/p&gt;

&lt;p&gt;At this level, I think one has to be considered a senior dev because you’ll have to know exactly what technologies, requirements and criteria you’re giving to the agent.&lt;/p&gt;

&lt;p&gt;I guess this approach does it for me. Now I have something to follow through for every project I work on, knowing what level I have to work without or with AI progressively.&lt;/p&gt;




&lt;p&gt;I hope this helps someone too. And If you’re already comfortably using AI-agents in your workflow, please share what approach works best for you!&lt;/p&gt;

</description>
      <category>ai</category>
      <category>agents</category>
      <category>webdev</category>
    </item>
    <item>
      <title>Learn to code from scratch or build with AI? - A Junior dev’s dillema</title>
      <dc:creator>Elizabeth Bassey</dc:creator>
      <pubDate>Mon, 10 Aug 2026 17:30:32 +0000</pubDate>
      <link>https://dev.to/devliz/learn-to-code-from-scratch-or-build-with-ai-a-junior-devs-dillema-2d98</link>
      <guid>https://dev.to/devliz/learn-to-code-from-scratch-or-build-with-ai-a-junior-devs-dillema-2d98</guid>
      <description>&lt;p&gt;As a junior dev in the AI-agent era (who needs to get a job soon🙈), I've had to sit between actually learning to code and falling under the pressure of coding with AI (with absolutely no idea what I’m doing!).&lt;/p&gt;

&lt;p&gt;Almost every content on youtube screams “coding is dead! Why learn to code in an era where code is cheap?!”. Every job description defines an Engineer who is able to 5x or 10x their productivity with AI agents. Yet, as a junior who barely understands concepts enough to build from end-to-end, I want to know exactly what I’m doing to build with confidence but I also do not want to live under a rock while the world is moving with great speed. So I have to create a balance. &lt;/p&gt;

&lt;p&gt;Well…this is what I have come to be at peace with:&lt;/p&gt;

&lt;p&gt;1️⃣ That learning to code is still important&lt;/p&gt;

&lt;p&gt;2️⃣ That AI is not my enemy.&lt;/p&gt;

&lt;p&gt;3️⃣ That I can do both.&lt;/p&gt;




&lt;h2&gt;
  
  
  ✅ Learning To Code Is Still Important
&lt;/h2&gt;

&lt;p&gt;I think for the longest time (before the AI era) coding was an art. It was a thing people enjoyed doing, even as a hobby. A thing many would still enjoy doing without being paid, and a way people got their brain stimulated. &lt;/p&gt;

&lt;p&gt;Coding keeps you learning everyday which is very healthy for the brain. You meet blockers, stay on them, figure things out and then comes the adrenaline rush! The reward for an accomplishment you’re proud of!&lt;/p&gt;

&lt;p&gt;You’re able to explain every concept of what you build because you own it, and you’re able to trace and figure errors when they appear.&lt;/p&gt;

&lt;p&gt;But then, coding is just a part of an entire product cycle and most implementation can be time consuming. Teams still have to figure things like the design, technical, business and even marketing needs of the products they’re trying to build. This is where AI comes in.&lt;/p&gt;

&lt;h2&gt;
  
  
  ✅ AI is not an enemy
&lt;/h2&gt;

&lt;p&gt;Businesses want to ship fast, get users feedback and improve on the product. And staying on a feature implementation for a long time is not going to help achieve that.&lt;/p&gt;

&lt;p&gt;AI is a tool or that assistant whose major strength is speed but would still require your judgement for how things are done.&lt;/p&gt;

&lt;p&gt;It helps with the mundane and repetitive tasks so you can focus on the things that matter.&lt;/p&gt;

&lt;p&gt;But if AI has to rely on my judgement, how do I figure what is wrong if I do not even know what is right in the first place?&lt;/p&gt;

&lt;h2&gt;
  
  
  ✅ Learning to code alongside AI - (Finding a balance)
&lt;/h2&gt;

&lt;p&gt;Learning to code teaches you to know what is right, so you can easily spot what is wrong when you see it. &lt;/p&gt;

&lt;p&gt;So here is how i’m attempting to find my balance (learning to code alongside AI):&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;I will keep learning to build from scratch while using AI to understand concepts better and faster.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;At a point where I feel comfortable with a coding concept, I will delegate that part to AI (verifying the output ofcourse), while moving to more difficult concepts I have to learn.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;At another point where I’m even more confident with my coding skill, I will delegate a larger chunk of my coding tasks to an AI agent (using a specification). While verifying, and focusing on more crucial aspects.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;With these in mind, I wouldn’t feel like an Imposter using AI agents anymore, but a dev who knows her onions and still needs to 10x her productivity.&lt;/p&gt;

&lt;p&gt;And if you’re in a state like mine, I hope this helps you too🤗&lt;/p&gt;




&lt;p&gt;If you read uptill this point, thank you so much for staying around😊…I plan be here more often sharing stuff around AI, Agents and Frontend (coding in general).&lt;/p&gt;

&lt;p&gt;I promise to share more practical stuff as I explore (just needed to get this particular thoughts out here today!).&lt;/p&gt;

&lt;p&gt;And if you’re a junior dev also learning in this era I’d love to here from you!!! Please do well to use the comment section.&lt;/p&gt;

</description>
      <category>ai</category>
      <category>webdev</category>
      <category>agents</category>
    </item>
  </channel>
</rss>
