Artificial Intelligence has revolutionized the conventional way of website development. The coding skill of NLP models, for example ChatGPT has potential to eliminate the conventional ways. Advantages of ChatGPT as website developer are:
- A novice can develop websites and control upto an extent
- Codes can be easily generated with right prompts [Link]
- Debugging the code is very easy [Link]
- Easy generation of content.
Here, I will discuss how I have developed a tool, Patchify Image Online, posted on one of my website subdomain ZenTools using ChatGPT. ThePatchify Image Online tool is developed assist all users in creating patches of their images by defining the pixel size, especially for data preparation for research community working on deep learning.
ChatGPT can provide exactly what you want only on the basis of provided prompts. The more your prompt is specific, the closer the answer of ChatGPT to your expectation. So, lets start!
This following is what I wrote to ChatGPT:
I have a WordPress website. In my next post, I am writing about a tool and the tool segment too. Initially, a summary of tool and then code of tool that patchify an input image. That tool takes input image from Input button, user input for the pixels and then break the input image into patches by ProcessImage button. After that It automatically give download option to download the image patches. Write an html code for the above tool that I can insert on my WordPress website post by Custom HTML option and the tool can run to do its objective.
To create an HTML code snippet that can be inserted into your WordPress website post and run the tool you described, you can use the following code:
In this code:
- The HTML structure is defined, including headings for the summary, tool code, and download section.
- The
processImage()
function is triggered when the “Process Image” button is clicked. It retrieves the input image file, the pixel value from the user, and creates a canvas element to draw the image. - The
patchifyImage()
function is a placeholder for the actual image patchification logic. You need to implement
Here, I have not shown the complete code as it is long. I copied this code and inserted on in my post using Custom HTML option. In this post, I just showed you the way which I followed, you all can easily create posts and develop tools which you find needful for others.
Writing a specific prompt is an art which takes time for anyone to learn. You can go through my other posts, ChatGPT as an interviewer-I and II where I presented ChatGPT to interview on few topics and shows a few examples of being specific to prompts.
Clarity is power. The more clear you are about what you want the more likely you are to achieve it.
-Billy Cox