<?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: Vipul Snehadeep Chawathe</title>
    <description>The latest articles on DEV Community by Vipul Snehadeep Chawathe (@cvipuls).</description>
    <link>https://dev.to/cvipuls</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.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1138822%2F40667799-3fbf-4fe5-b26d-0161aab29ce7.png</url>
      <title>DEV Community: Vipul Snehadeep Chawathe</title>
      <link>https://dev.to/cvipuls</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/cvipuls"/>
    <language>en</language>
    <item>
      <title>I am seeing so many posts on Google Gemini Code Wiki. But https://deepwiki.org/ has been around for quiet some time now.</title>
      <dc:creator>Vipul Snehadeep Chawathe</dc:creator>
      <pubDate>Mon, 17 Nov 2025 14:18:36 +0000</pubDate>
      <link>https://dev.to/cvipuls/i-am-seeing-so-many-posts-on-google-gemini-code-wiki-but-httpsdeepwikiorg-has-been-around-for-ma5</link>
      <guid>https://dev.to/cvipuls/i-am-seeing-so-many-posts-on-google-gemini-code-wiki-but-httpsdeepwikiorg-has-been-around-for-ma5</guid>
      <description>&lt;p&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__cover"&gt;
          &lt;a href="https://deepwiki.org/" class="c-link align-middle" rel="noopener noreferrer"&gt;
            &lt;img alt="" src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdeepwiki.com%2Fopengraph-image.png%3F8391a278ea71bf13" height="auto" class="m-0"&gt;
          &lt;/a&gt;
        &lt;/div&gt;
      &lt;div class="c-embed__body"&gt;
        &lt;h2 class="fs-xl lh-tight"&gt;
          &lt;a href="https://deepwiki.org/" rel="noopener noreferrer" class="c-link"&gt;
            DeepWiki | AI documentation you can talk to, for every repo
          &lt;/a&gt;
        &lt;/h2&gt;
          &lt;p class="truncate-at-3"&gt;
            DeepWiki provides up-to-date documentation you can talk to, for every repo in the world. Think Deep Research for GitHub - powered by Devin.
          &lt;/p&gt;
        &lt;div class="color-secondary fs-s flex items-center"&gt;
            &lt;img alt="favicon" class="c-embed__favicon m-0 mr-2 radius-0" src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdeepwiki.org%2Ffavicon.ico"&gt;
          deepwiki.org
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
&lt;/div&gt;




</description>
      <category>gemini</category>
      <category>discuss</category>
      <category>deeplearning</category>
      <category>resources</category>
    </item>
    <item>
      <title>New Beginnings Personal Growth Productivity Tool</title>
      <dc:creator>Vipul Snehadeep Chawathe</dc:creator>
      <pubDate>Mon, 20 Jan 2025 02:39:38 +0000</pubDate>
      <link>https://dev.to/cvipuls/new-beginnings-personal-growth-productivity-tool-344e</link>
      <guid>https://dev.to/cvipuls/new-beginnings-personal-growth-productivity-tool-344e</guid>
      <description>&lt;h2&gt;
  
  
  What I Built
&lt;/h2&gt;

&lt;p&gt;This project is for individuals wanting to be productive on new beginnings for personal growth. They must have a theme to pursue. It groups the tasks related to the theme into categories, and sequences those categories as an everyday agenda. As tasks get resolved, the user can continue with substitution by successive tasks. GitHub model LLMs may also help with identifying substitute tasks. The UI is of 2 web pages with link for navigating between themselves close to the bottom of the pages.&lt;/p&gt;

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

&lt;p&gt;&lt;iframe width="710" height="399" src="https://www.youtube.com/embed/BGPsPPYE_Q8"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;h2&gt;
  
  
  Repo
&lt;/h2&gt;


&lt;div class="ltag-github-readme-tag"&gt;
  &lt;div class="readme-overview"&gt;
    &lt;h2&gt;
      &lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fassets.dev.to%2Fassets%2Fgithub-logo-5a155e1f9a670af7944dd5e12375bc76ed542ea80224905ecaf878b9157cdefc.svg" alt="GitHub logo"&gt;
      &lt;a href="https://github.com/CVipulS" rel="noopener noreferrer"&gt;
        CVipulS
      &lt;/a&gt; / &lt;a href="https://github.com/CVipulS/New_beginnings_tool" rel="noopener noreferrer"&gt;
        New_beginnings_tool
      &lt;/a&gt;
    &lt;/h2&gt;
    &lt;h3&gt;
      
    &lt;/h3&gt;
  &lt;/div&gt;
  &lt;div class="ltag-github-body"&gt;
    
&lt;div id="readme" class="md"&gt;
&lt;div class="markdown-heading"&gt;
&lt;h1 class="heading-element"&gt;New Beginnings: Personal Growth Productivity Tool&lt;/h1&gt;
&lt;/div&gt;
&lt;div class="markdown-heading"&gt;
&lt;h2 class="heading-element"&gt;Overview&lt;/h2&gt;
&lt;/div&gt;
&lt;p&gt;This project is for individuals wanting to be productive on new beginnings for personal growth. They must be having a theme to pursue. It groups the tasks related to the theme into categories, and sequences those categories as an everyday agenda. As tasks get resolved, the user can continue with substitution by successive tasks. GitHub model LLMs may also help with identifying substitute tasks.&lt;/p&gt;
&lt;div class="markdown-heading"&gt;
&lt;h2 class="heading-element"&gt;Features&lt;/h2&gt;
&lt;/div&gt;
&lt;ul&gt;
&lt;li&gt;Theme-based personal growth tracking&lt;/li&gt;
&lt;li&gt;Categorized agenda management&lt;/li&gt;
&lt;li&gt;AI-powered task suggestions&lt;/li&gt;
&lt;li&gt;Local storage persistence&lt;/li&gt;
&lt;li&gt;Multiple category support:
&lt;ul&gt;
&lt;li&gt;Studying&lt;/li&gt;
&lt;li&gt;Habituation&lt;/li&gt;
&lt;li&gt;LibreSource&lt;/li&gt;
&lt;li&gt;Offering&lt;/li&gt;
&lt;li&gt;Reporting&lt;/li&gt;
&lt;li&gt;Creativity&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;div class="markdown-heading"&gt;
&lt;h2 class="heading-element"&gt;Requirements&lt;/h2&gt;

&lt;/div&gt;
&lt;ul&gt;
&lt;li&gt;Modern web browser&lt;/li&gt;
&lt;li&gt;Node.js (for testing)&lt;/li&gt;
&lt;/ul&gt;
&lt;div class="markdown-heading"&gt;
&lt;h2 class="heading-element"&gt;Getting Started&lt;/h2&gt;

&lt;/div&gt;
&lt;p&gt;To run this project locally, follow these steps:&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;Download the repository to your local machine. &lt;a rel="noopener noreferrer" href="https://private-user-images.githubusercontent.com/3293600/406326071-97a4d57f-2af9-4adc-b25d-590347ff33cd.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3Mzc3MDA5NTYsIm5iZiI6MTczNzcwMDY1NiwicGF0aCI6Ii8zMjkzNjAwLzQwNjMyNjA3MS05N2E0ZDU3Zi0yYWY5LTRhZGMtYjI1ZC01OTAzNDdmZjMzY2QucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI1MDEyNCUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNTAxMjRUMDYzNzM2WiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9NGY5YjYxNWUzNGIxZjJjMzZkNGQ3MDE1YmUxYjQyOTZmZmIyM2VjNzU4N2EwMzUzY2VhOGE1YjQwYzZjMmVmMyZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QifQ.KJiAJXOHr4c_DzAhVGQLWVlZ3qTVpanNySkFo4bTzyM"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fprivate-user-images.githubusercontent.com%2F3293600%2F406326071-97a4d57f-2af9-4adc-b25d-590347ff33cd.png%3Fjwt%3DeyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3Mzc3MDA5NTYsIm5iZiI6MTczNzcwMDY1NiwicGF0aCI6Ii8zMjkzNjAwLzQwNjMyNjA3MS05N2E0ZDU3Zi0yYWY5LTRhZGMtYjI1ZC01OTAzNDdmZjMzY2QucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI1MDEyNCUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNTAxMjRUMDYzNzM2WiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9NGY5YjYxNWUzNGIxZjJjMzZkNGQ3MDE1YmUxYjQyOTZmZmIyM2VjNzU4N2EwMzUzY2VhOGE1YjQwYzZjMmVmMyZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QifQ.KJiAJXOHr4c_DzAhVGQLWVlZ3qTVpanNySkFo4bTzyM" alt="Download Zip"&gt;&lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Unzip&lt;/strong&gt; it to a folder and then open the &lt;code&gt;src/home.html&lt;/code&gt; file in your web browser.&lt;/li&gt;
&lt;li&gt;You can start interacting with the application immediately.&lt;/li&gt;
&lt;/ol&gt;
&lt;div class="markdown-heading"&gt;
&lt;h2 class="heading-element"&gt;Project Structure&lt;/h2&gt;

&lt;/div&gt;
&lt;div class="snippet-clipboard-content notranslate position-relative overflow-auto"&gt;
&lt;pre class="notranslate"&gt;&lt;code&gt;personal-growth-project
├── src
│   ├── common.js        #&lt;/code&gt;&lt;/pre&gt;…&lt;/div&gt;
&lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="gh-btn-container"&gt;&lt;a class="gh-btn" href="https://github.com/CVipulS/New_beginnings_tool" rel="noopener noreferrer"&gt;View on GitHub&lt;/a&gt;&lt;/div&gt;
&lt;/div&gt;


&lt;h2&gt;
  
  
  Copilot Experience
&lt;/h2&gt;

&lt;p&gt;As the challenge has choice of prompts, I've chosen the first one: "New Beginnings". Planning is the initial step. By selectively looking up online keywords from the prompt I formed a rough idea of the functionality to implement. My user story is the most direct way forward to grasp the gist of the solution concept. Role playing as the user, one wants to make new beginning related with a theme, say para sailing. Or maybe something with more known outcomes like learning history. For making progress, some routine agenda has to be fixed once. The tool should keep track and enable updates to such agenda for the user. Whenever the user desires new beginning, making a folder for the theme and running the tool should be the simplest and most effective way for the user to proceed.&lt;br&gt;
The main interaction with the app will be with a browser based web page showing the agenda. And then another for when any resolved agenda point leads the user to seek a successive agenda point. This can be cultivated into a browser extension, a web service, an offline (e.g. electron.js based) app, a single page app, a website. For users with GitHub AI model API keys the other page could enable the user to brainstorm with AI aid as well!&lt;br&gt;
Ah, well first things first now. Let's give CoPilot the specifics to generate placeholder code for starting with the app.&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.amazonaws.com%2Fuploads%2Farticles%2Flfouqxngma5t6vfg8236.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.amazonaws.com%2Fuploads%2Farticles%2Flfouqxngma5t6vfg8236.png" alt="Generating workspace" width="800" height="575"&gt;&lt;/a&gt;&lt;br&gt;
And it has generated the workspace.&lt;br&gt;
&lt;iframe width="710" height="399" src="https://www.youtube.com/embed/BjoS0O1rVcM"&gt;
&lt;/iframe&gt;
&lt;br&gt;
It's like a new recruit, from the little discussion it's drawn conclusions to be useful to me and mostly succeeded. I've done minor edit to the initial HTML and ReadMe, just to be precautious, that divulging from the core idea through the descriptive text could eventually lead to hallucinating. Speaking of staying on track, let me ask for setting up tests upfront, just in case. I make great stuff, so I am sure that will be of little use immediately. Nevertheless, it's a new beginning and we've got to start on the right foot.&lt;br&gt;
&lt;iframe width="710" height="399" src="https://www.youtube.com/embed/aD0v1JfL1o8"&gt;
&lt;/iframe&gt;
&lt;br&gt;
Right foot? As you can see in the recording, I spoke with copilot. It generated the transcript, in place of the chat. But when one speaks it takes it as a command, there's no option to edit in transcript. And it figures out what was meant by itself. Even as it's misrecognition of mocha.js test library made me fumble, it figured out the right thing to do!&lt;br&gt;
And now that I've erred by fumbling, just to make the score right, I've got to do something. I'm going to put it to test by pasting some code written in languages not at all related to our project. We have to play a little between serious work, otherwise how will I keep track of the work getting done, if not for the count of little bits of play?&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.amazonaws.com%2Fuploads%2Farticles%2Fl0mocf6ya733yx8t3lf6.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.amazonaws.com%2Fuploads%2Farticles%2Fl0mocf6ya733yx8t3lf6.png" alt="Translating pasted code" width="800" height="771"&gt;&lt;/a&gt;&lt;br&gt;
I've got another code fragment to transform, and I don't want all this congesting my chat thread. I'll use Quick Chat now.&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.amazonaws.com%2Fuploads%2Farticles%2F2a7o0yodshgyyqf6ja20.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.amazonaws.com%2Fuploads%2Farticles%2F2a7o0yodshgyyqf6ja20.png" alt="Quick chat" width="800" height="425"&gt;&lt;/a&gt;&lt;br&gt;
I'll remove my last chat request just for relief from all the translation right in front of me.&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.amazonaws.com%2Fuploads%2Farticles%2Fec46kygbmovz9b18my4d.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.amazonaws.com%2Fuploads%2Farticles%2Fec46kygbmovz9b18my4d.png" alt="Chat request removal" width="800" height="425"&gt;&lt;/a&gt;&lt;br&gt;
And now let's transform a ReBOL code fragment.&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.amazonaws.com%2Fuploads%2Farticles%2F5mu4g7ehhybmb4pdilss.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.amazonaws.com%2Fuploads%2Farticles%2F5mu4g7ehhybmb4pdilss.png" alt="Transforming ReBOL too!" width="800" height="425"&gt;&lt;/a&gt;&lt;br&gt;
CoPilot is getting all the fun. I want some of the action as well. I know... I'll replace it's suggested categories with my own, that should make it more aligned with the perception of a theme from the earlier user story. Let me write a comment listing my pick of categories. And lo and behold. As I continue typing, based on my comment, it keeps showing me ghost text, relieving me from the burden of imagining tentative substitutes for actual usage scenarios, while I evaluate the progress being made. (For those who are new to code editing, ghost text is text that maybe inserted by either Tab key for entirety or Ctrl + Right Arrow key combination for individual word at a time.)&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.amazonaws.com%2Fuploads%2Farticles%2Fzdudh2pjj7s39qjmjvrm.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.amazonaws.com%2Fuploads%2Farticles%2Fzdudh2pjj7s39qjmjvrm.png" alt="Ghost text completions" width="800" height="618"&gt;&lt;/a&gt;&lt;br&gt;
Now where was I? So much code gathered together from searching a whole lot of different things! It's best if we could collect some explanations now. I know what, the workspace extension (that we used for code generation by beginning with '@' character meant for extensions) from earlier has an explain (commands begin with a '/' character) command. One change I made at this time is to select the other LLM. The default one has been proposing coding solutions, so I just wanted to see how chatty the other one may get? My command was to explain how the javascript in the active editor worked? And it suggested code ranges to pick from below the search box in the title bar. Instead of making a choice, I selected all the code in the entire file. Ranges might be relevant for limited input of LLM prompts, but there's much more that can be added to this js file. I got a comprehensive reply, so much so that I've to move the chat temporarily to the editors section from the sidebar.&lt;br&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.amazonaws.com%2Fuploads%2Farticles%2Fw55gdcft2c8d5pf5yzto.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.amazonaws.com%2Fuploads%2Farticles%2Fw55gdcft2c8d5pf5yzto.png" alt="Preview other LLM and open in editor" width="800" height="795"&gt;&lt;/a&gt;&lt;br&gt;
One more thing I've highlighted in the screenshot is that it is also concerned with something about the literally translated code, that I should also be concerned about. I find the console logs helpful for debugging, but why is the output intended for the web page being entirely given to the console? Also the explanation has code fragment fix for the same, follow by kwy summary of improvements and suggested next steps. Next steps have ideas that a generic app from task management category mostly has, but some of them are relevant for completing our desired functioning as well. Like using localstorage that we coild use when making the page for task replacement. See for yourself.&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.amazonaws.com%2Fuploads%2Farticles%2Fpc6svpqbeqy814mxycf9.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.amazonaws.com%2Fuploads%2Farticles%2Fpc6svpqbeqy814mxycf9.png" alt="Chat has been moved to the editor" width="800" height="825"&gt;&lt;/a&gt; &lt;br&gt;
Since this is headed in a meaningful direction, I'd better export this for later reference.&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.amazonaws.com%2Fuploads%2Farticles%2Flnr6s2o5mcxyydiwwt1r.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.amazonaws.com%2Fuploads%2Farticles%2Flnr6s2o5mcxyydiwwt1r.png" alt="Exporting chat" width="800" height="795"&gt;&lt;/a&gt;&lt;br&gt;
After accepting the suggested change, I also previewed the tool's home page. As the export chat screenshot shows, the change blended right in, so for those who are inclined towards software development and are reasonably comfortable with vanilla web development, it's already as much as a usable template with JS array structure contrasting the markdown editing technique of some note taking apps. I made a .devdocs folder and named the file nextsteps. Since it's just another json file, let's peek inside.&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.amazonaws.com%2Fuploads%2Farticles%2F85ejrt065n1wpec89rlh.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.amazonaws.com%2Fuploads%2Farticles%2F85ejrt065n1wpec89rlh.png" alt="Exported JSON" width="800" height="618"&gt;&lt;/a&gt;&lt;br&gt;
Now continuing with our app, the agenda is abit full. Considering an individuals ongoing life, I should rationalize the number of category wise tasks and make such decisive alteration. From my own experience, I should be comfortable focusing for almost 25 minutes. I mean, being a human, glaring at a screen and such could be strenous. Assuming I still am thinking the same thing, I could do a set of focussing thrice before a proper switch to something else. There's already some order of the categories. One must want to know enough about things to take action regarding them. Then the routine stuff. Maybe after lunch one can find stuff happening in the wild regarding the theme. Then one might have something to offer, like for participating in marketplace and get compensated. Then log the day and review it. And finally while unwinding with friends and family, one may hit creativity and chance upon a novel idea. With so much on my mind, I've got to patch the code to reflect the purpose coherently.&lt;br&gt;
After a short while, I've commented the description paragraph, the code to display the tasks for the category, replaced the tasks by description, and set title attribute for catgories to description as all the static matter was getting too distracting for me. Now when the page is opened, let's start with looking up localstorage mentioned in the next steps during the explanation. In the DOMContentLoaded event handler there's a call to the displayAgenda function. Seems like this is the entry point when the page is loaded successfully by the web browser. Let's open inline chat asking to check for the theme.&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.amazonaws.com%2Fuploads%2Farticles%2F2a64k8kby3grkwa62xkw.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.amazonaws.com%2Fuploads%2Farticles%2F2a64k8kby3grkwa62xkw.png" alt="Editor InLine Chat" width="800" height="618"&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.amazonaws.com%2Fuploads%2Farticles%2Fqxkfj42li2khtdcdvi3m.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.amazonaws.com%2Fuploads%2Farticles%2Fqxkfj42li2khtdcdvi3m.png" alt="Prompting Editor InLine chat" width="800" height="618"&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.amazonaws.com%2Fuploads%2Farticles%2Fsmh69bo1oxgwpw3ba4p2.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.amazonaws.com%2Fuploads%2Farticles%2Fsmh69bo1oxgwpw3ba4p2.png" alt="Solution Proposal by Editor InLine Chat" width="800" height="618"&gt;&lt;/a&gt;&lt;br&gt;
Adding some class to the body was not what I intended, but that should be an example saving considerable time of going through the documentation for grasping the storage functionality of Web APIs. I'll now get some coding done by combining the above techniques, so we can continue with modifications. I asked for another page to setup the theme and tasks. I'll skip the exact prompt for brevity considering the copilot response is mostly non-deterministic. One reason I've to mention this is for the generated code, it is citing similar code alongwith attempted license look up result.&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.amazonaws.com%2Fuploads%2Farticles%2F21cvgk559ihbha5t7lwg.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.amazonaws.com%2Fuploads%2Farticles%2F21cvgk559ihbha5t7lwg.png" alt="Similar Code matching" width="800" height="618"&gt;&lt;/a&gt;&lt;br&gt;
As it has hallucinated that I want UI day/night theme rather than theme for the agenda for new beginning, so the citations are irrelevant, but I'll just trim and reshape the code for fitting our purpose. That's just what was done with the copy pasted PERL / ReBOL code fragments obtained from Bing searches CoPilot results from earlier.&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.amazonaws.com%2Fuploads%2Farticles%2F96uq8v355xlfh3symoei.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.amazonaws.com%2Fuploads%2Farticles%2F96uq8v355xlfh3symoei.png" alt="Edit with CoPilot One Request" width="800" height="618"&gt;&lt;/a&gt;&lt;br&gt;
On using the Edit with CoPilot the chat window switched to the other tab. This is different in that there's no extensions @ button for the reply box. And it's opened up all the files with diffs.&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.amazonaws.com%2Fuploads%2Farticles%2F51kn8hund60qq0orw5a2.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.amazonaws.com%2Fuploads%2Farticles%2F51kn8hund60qq0orw5a2.png" alt="Edit with CoPilot Multiple Files" width="800" height="618"&gt;&lt;/a&gt;&lt;br&gt;
I've made modifications to the form specific to new beginnings and want setup.js to be updated accordingly. I'll attach the file using the paperclip button.&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.amazonaws.com%2Fuploads%2Farticles%2Fjinnkwtb4lp3bu0vqc7v.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.amazonaws.com%2Fuploads%2Farticles%2Fjinnkwtb4lp3bu0vqc7v.png" alt="Attaching files" width="800" height="618"&gt;&lt;/a&gt;&lt;br&gt;
With few edits, I've got the setup page functioning.&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.amazonaws.com%2Fuploads%2Farticles%2Fmmpuscy5hvv608fl2dlg.jpeg" 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.amazonaws.com%2Fuploads%2Farticles%2Fmmpuscy5hvv608fl2dlg.jpeg" alt="GitHub Model Agenda Point suggestion" width="800" height="841"&gt;&lt;/a&gt;&lt;br&gt;
For the markdown response from the Curl based API call, it suggested using showdown converter by itself.&lt;br&gt;
Next let's seek code smells for refactoring. Here's how it replied to my prompt with workspace extension:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight markdown"&gt;&lt;code&gt;Collecting workspace information
&lt;span class="p"&gt;
1.&lt;/span&gt; &lt;span class="gs"&gt;**Hardcoded Agenda Points**&lt;/span&gt;:
&lt;span class="p"&gt;   -&lt;/span&gt; &lt;span class="gs"&gt;**Description**&lt;/span&gt;: The code assumes each category has exactly three agenda points.
&lt;span class="p"&gt;   -&lt;/span&gt; &lt;span class="gs"&gt;**Suggestion**&lt;/span&gt;: Dynamically handle the number of agenda points per category.
&lt;span class="p"&gt;
2.&lt;/span&gt; &lt;span class="gs"&gt;**DOM Manipulation Before DOMContentLoaded**&lt;/span&gt;:
&lt;span class="p"&gt;   -&lt;/span&gt; &lt;span class="gs"&gt;**Description**&lt;/span&gt;: The code manipulates the DOM before ensuring it is fully loaded.
&lt;span class="p"&gt;   -&lt;/span&gt; &lt;span class="gs"&gt;**Suggestion**&lt;/span&gt;: Ensure all DOM manipulations occur within the &lt;span class="sb"&gt;`DOMContentLoaded`&lt;/span&gt; event listener.
&lt;span class="p"&gt;
3.&lt;/span&gt; &lt;span class="gs"&gt;**Local Storage Parsing Without Error Handling**&lt;/span&gt;:
&lt;span class="p"&gt;   -&lt;/span&gt; &lt;span class="gs"&gt;**Description**&lt;/span&gt;: The code parses JSON from local storage without handling potential errors.
&lt;span class="p"&gt;   -&lt;/span&gt; &lt;span class="gs"&gt;**Suggestion**&lt;/span&gt;: Add try-catch blocks around JSON parsing to handle malformed data.
&lt;span class="p"&gt;
4.&lt;/span&gt; &lt;span class="gs"&gt;**Potential Null Reference**&lt;/span&gt;:
&lt;span class="p"&gt;   -&lt;/span&gt; &lt;span class="gs"&gt;**Description**&lt;/span&gt;: The code assumes elements like 

document.body.firstElementChild.nextElementSibling

 always exist.
&lt;span class="p"&gt;   -&lt;/span&gt; &lt;span class="gs"&gt;**Suggestion**&lt;/span&gt;: Add checks to ensure these elements exist before manipulating them.
&lt;span class="p"&gt;
5.&lt;/span&gt; &lt;span class="gs"&gt;**Inconsistent Element Insertion**&lt;/span&gt;:
&lt;span class="p"&gt;   -&lt;/span&gt; &lt;span class="gs"&gt;**Description**&lt;/span&gt;: The code inserts new elements before 

document.body.lastElementChild.previousElementSibling

, which may not always be the intended location.
&lt;span class="p"&gt;   -&lt;/span&gt; &lt;span class="gs"&gt;**Suggestion**&lt;/span&gt;: Use a more reliable method to determine where to insert new elements, such as a specific container element.
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;For the red squiggles, it also offers fixes. And similar fixes are available for the terminal too! So I considered serving the folder through localhost as one web browser confines local storage to an individual file rather than a folder. And made a typo while checking for Python!&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.amazonaws.com%2Fuploads%2Farticles%2F5k2kyz5tyavfryt1a7t0.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.amazonaws.com%2Fuploads%2Farticles%2F5k2kyz5tyavfryt1a7t0.png" alt="Terminal also has editor like diagnostic fixes" width="800" height="618"&gt;&lt;/a&gt;&lt;br&gt;
Next, I requested for optimizations for everything from code maintainability to better usability. Amongst its suggestions was updating the form so all the points textboxes are now tidied up at least. It's human physiology to get strained by glaring at the screen even as all the work was handled by automation available by CoPilot's integration with VSCode. (Actually, I did fetch my GitHub PAT by myself so I was active too.) So now I just want to get commit message from CoPilot and then move onto making my submission. I removed the exported chat from .devdocs folders as it had all sorts of identifiers, and I want the posted repository to be okay safety wise.&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.amazonaws.com%2Fuploads%2Farticles%2Filmdj2wivv4szuo5xwxx.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.amazonaws.com%2Fuploads%2Farticles%2Filmdj2wivv4szuo5xwxx.png" alt="AutoGenerate Commit message by GitHub CoPilot" width="800" height="618"&gt;&lt;/a&gt;&lt;/p&gt;
&lt;h2&gt;
  
  
  GitHub Models
&lt;/h2&gt;

&lt;p&gt;The Phi 4 model by Microsoft is newly launched at the time of this writing. TLDR: It is used to obtain agenda point suggestion by the setup web page.&lt;/p&gt;

&lt;p&gt;Again, this has been shown by the demo at time 4:18 &lt;iframe width="710" height="399" src="https://www.youtube.com/embed/BGPsPPYE_Q8?start=258"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;This is an offline first app as it demonstrates what's do-able in 24 hours instead of growing expertise over a longer span. So instead of intricate details of securing the persistence of GitHub PAT, a password input field is given for making use of one's own privacy practices to enable AI suggestions. The prompt is hard coded in the source code. The API call is based on translating the Curl command in the model description, as the js description was node dependent and I've assumed the end user is unlikely to be a development tooling consumer, and may mostly know about using web browsers at best. As the response is markdown formatted, so it's translated using showdown. Showdown was setup as instructed by GitHub CoPilot with very little manual intervention.&lt;/p&gt;

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

&lt;p&gt;I believe, analogous to formatted pasting options inside office apps, AI code transformation will be enabled by the CoPilot extension in an upcoming release. Also more LLMs, such as Mistral and Command R+ will be coming soon. I had a blast (Just read the above narrative)!&lt;/p&gt;

&lt;p&gt;As I was able to prepare such a functional and ready to use within such a short time frame, it'll be gratifying to see forked variants popping up with scenario specific features, like server based solution for aggregating themes for users, backing up their agenda centrally, and such way more things than I might imagine. Having how to go about one's day to keep compounding on the progress being made should be the key to new beginnings. I do dog fooding on my own creations as well. So, there might be other works growing on the same core idea.&lt;br&gt;
:)&lt;/p&gt;

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