Tuesday, February 27, 2024
HomeArtificial Intelligence (AI)Unveiling the Power of ChatGPT: Crafting a Custom JavaScript Bookmarklet

Unveiling the Power of ChatGPT: Crafting a Custom JavaScript Bookmarklet

Using ChatGPT to Automate Code Writing: A Journey of Discovery

Over the past few months, I have delved into the possibilities of using ChatGPT to assist in writing code. In this article, I will walk you through the process of utilizing ChatGPT for this purpose. As part of my daily routine, I encountered a repetitive task that I wanted to streamline. Creating “Also” references in my ZDNET articles involved multiple steps and was not only tedious but also caused strain on my wrist. Could I find a way to eliminate this annoyance without writing a single line of code? Could non-programmers achieve similar small-scale projects? The answer is yes, but the process is not as straightforward as one might hope. In a series of diary-like log entries, I documented each step I took to create this capability using ChatGPT’s programming-through-prompting approach. By reading these entries, you will gain insight into the process and the discoveries I made along the way. Let’s begin.

Log Entry 001 – Friday, 2:10pm
I have decided to task ChatGPT with writing code for me. There is a repetitive task that I perform multiple times a day, and it’s time to create a button that simplifies the process. I will contemplate this while working on another article.

Log Entry 002 – Friday, 2:45pm
It appears that the task is not as simple as I initially thought. Merely instructing ChatGPT to “write me a button that saves me steps” is insufficient. I need to be able to describe what I want the button to do, which is a skill in itself. Fortunately, my decades of coding experience enable me to create a specification and articulate my requirements. Time to ponder further. I will return.

Log Entry 003 – Friday, 4:02pm
First and foremost, I need to clearly describe what I want. Once I have done so, I can prompt ChatGPT to generate the necessary code for automating this process. The desired outcome is a reduction in the number of clicks required to create our “Also” links. These links consist of several elements: the string “Also: ” (including a colon and space), a hyperlink with the article’s name, and the entire text block in boldface. Although seemingly straightforward, the current process involves eleven steps, numerous mouse clicks, click and drag actions, and various keyboard inputs. My goal is to reduce this to a single click and paste operation.

Log Entry 004 – Friday, 4:57pm
I have described my process and identified a couple of issues, but I have yet to outline the specifics of the desired tool. For ChatGPT to generate the code, it must understand my intentions. More time for contemplation is required.

Log Entry 005 – Friday, 7:12pm
After careful consideration, I have decided to create a JavaScript bookmarklet rather than a Chrome extension. Bookmarklets are easily added to the bookmark bar and do not require extensive installation. To create the bookmarklet, I simply need to right-click on the bookmark bar, choose “Add page,” and enter the title. The JavaScript code itself will be pasted into the URL field. Here is a preliminary draft of what I want the bookmarklet to achieve: When pressed, it should retrieve the current URL and title of the page, create a rich text block in the clipboard containing the string “Also: ” followed by a hyperlink with the title and URL, and ensure the entire text block is bolded. If ChatGPT can provide me with a functional solution, all I will need to do is click the button, switch to the CMS, find the desired location, and paste. This will significantly expedite the process. Now, the only thing left to do is… well, everything.

Log Entry 006 – Saturday, 8:30am
Feeling adventurous, I decided to feed the exact description mentioned above to ChatGPT and see if it can generate working code. It’s worth a shot, after all.

Log Entry 007 – Saturday, 8:41am
Unfortunately, that approach did not yield the desired results. Instead, ChatGPT simply retained the contents of my clipboard. However, a part of ChatGPT’s response caught my attention. It highlighted that the ‘document.execCommand(‘copy’)’ function is marked as obsolete…

[Journalist spacing]

This journey of using ChatGPT to automate code writing has been an enlightening one. While it presented challenges, it also showcased the potential for non-programmers to tackle small-scale projects. By leveraging ChatGPT’s programming-through-prompting methodology, I was able to streamline a repetitive task and save time and effort. Although my initial attempt did not produce the desired outcome, it provided valuable insights. I will continue to explore the possibilities and refine my approach. With further experimentation and refinement, ChatGPT can become an invaluable tool for code generation and automation.

Thomas Lyons
Thomas Lyons
Thomas Lyons is a well renowned journalist and seasoned reviewer, boasting an illustrious career spanning two decades in the global publishing realm. His expertise is widely sought after, making him a respected figure in the publishing industry. As the visionary founder of Top Rated, he has set a benchmark for authenticity and credibility in information dissemination. Driven by a profound passion for Artificial Intelligence, Thomas's keen insight pierces through the noise of the AI sector. He is dedicated to helping his readers find the most accurate, unbiased, and trusted news and reviews. As your guide in the evolving world of AI, Thomas ensures you're always informed and ahead of the curve.

Most Popular