jsPDF-livePreview

Shows live preview of pdf while writing the code, added grids and auto run code for a better UX and ease.(A code-editor for jsPDF library)

(live:https://js-pdf-live-preview.vercel.app)

• While working with a project, I had too generate pdfs, but I was totally embarrased of fixing small anomalities or design with downloading the pdf each time. So I created this☺.

code:

• Used monaco-editor as the code editor.
• Added custom commands in suggestions of monaco-editor for jsPDF.
• Used blob to open pdf in browser's pdf-viewer without downloading
• Used Codepan template for Select optons(https://codepen.io/mrphang/pen/XWxKdpV).
• Used getCSSSCAN template for checkbox(https://getcssscan.com/css-checkboxes-examples).

features:

• Shows preview of generated pdf side-by-side.
• Added auto-run code option for live preview and also shows error alert in jsPDF code if button is used.
• Added grids with custom color and spacing for better control over preview.
• Custamized suggestions according to the jsPDF.

Next(if worked on it) =>{Integrate AI prompt-bar to auto-write jsPDF code by giving a prompt}

I am glad if you are reading this :) And will more glad if you will contribute (even a suggestion).Rest is on You.