Creating a pdf merger Web Application using chatgpt AI

n00🔑
3 min readJan 31, 2023

--

Hi readers, recently I was filling up an online form and it was required to merge, upload and submit documents in pdf format. Usually, I tend to use free online tools for merging pdfs(like ilovepdf, etc). But this time the files which I was uploading contained PII and financial information. We as end users have no visibility of what these online websites do with our data contained in the pdf files which we upload to them. So I started looking for open-source alternatives, and I was more interested in web-hosted open-source applications. Fortunately, I found this https://github.com/gotenberg/gotenberg project which fulfills the need to do multiple things with pdfs. I was able to deploy a full-fledged web app in under 15 minutes with a little bit of help from CHATGPT.

It exposes multiple APIs for each functionality. For example, for merging pdfs we have this API-

curl \
--request POST 'http://localhost:3000/forms/pdfengines/merge' \
--form 'files=@"/path/to/pdf1.pdf"' \
--form 'files=@"/path/to/pdf2.pdf"' \
--form 'files=@"/path/to/pdf3.pdf"' \
--form 'files=@"/path/to/pdf4.pdf"' \
-o my.pdf

You can read more about these here at documentation- https://gotenberg.dev/docs/modules/pdf-engines

Okay, so far so good. Now let us deploy gotenberg-

Prerequisites: a) docker b) laziness

#sudo apt update -y && sudo apt install docker.io -y

Steps

  1. Start gotenberg container-
sudo docker run --name pls_sub --rm --publish 80:3000 gotenberg/gotenberg:8

sudo docker run --name pls-sub --publish 80:80 --publish 3000:3000 -v /var/www/html:/var/www/html gotenberg/gotenberg:8

2. Now we can just call the merge api to merge the pdfs into one-


curl.exe --request POST 'http://152.67.6.28/forms/pdfengines/merge' --form 'files=@"C:\Users\content\Downloads\dummy.pdf"' --form 'files=@"C:\Users\content\Downloads\sample.pdf"' -o my.pdf

And we have combined pdf with name my.pdf

3. Using chatGPT to create a frontend HTML page for this API call-

Below is my example query to chatgpt:

Can you please create a html form for this curl api request, allowing user to add as many files as they need with add file button? 
curl \
--request POST 'http://152.67.6.28/forms/pdfengines/merge' \
--form 'files=@"/path/to/pdf1.pdf"' \
--form 'files=@"/path/to/pdf2.pdf"' \
-o my.pdf


curl \
--request POST 'https://pdfmerge.work/forms/pdfengines/merge' \
--form 'files=@"/path/to/pdf1.pdf"' \
--form 'files=@"/path/to/pdf2.pdf"' \
-o my.pdf

And this is the fully functional frontend just created by AI-

4. Now I did go further and asked AI to add make this page look beautiful by adding css and other graphics and this was the result-

5. Again, I told him to change this image and make the page more beautiful-

So, the conclusion is even AI is lazy. If you push it further it will do a better job!

Thanks for reading!

--

--

n00🔑
n00🔑

Written by n00🔑

Computer Security Enthusiast. Usually plays HTB (ID-23862). https://www.youtube.com/@pswalia2u https://www.linkedin.com/in/pswalia2u/ Instagram @pswalia4u

No responses yet