Building A Crousal Maker Tool with NextJS ⭐

Hey Coder 👋 Welcome to my another blog post .

On December 6 i was exploring and learning how to generate a beautiful html component into a PDF in react app, then i found that there is a libraries name can convert and download it easily .

As a linkedin user i also want likes and impression on my posts, and one of the best to engage and rank our post is by uploading a Crousal And to upload a crousal your crousals should be in a PDF format .

So, i get an idea that let's create a "Crousal Maker" app because canvas good crousals are premium.

// Detect dark theme
var iframe = document.getElementById('tweet-1738266525835145490-536');
if (document.body.className.includes('dark-theme')) {
iframe.src = "https://platform.twitter.com/embed/Tweet.html?id=1738266525835145490&theme=dark"
}

For the UI library, ShadcnUI was chosen which is a lightweight and customizable component library for NextJS. It provides many common UI elements like buttons,inputs, cards etc out of the box. This helped speed up development and provided a polished look and feel.

Other key technologies included for capturing screenshots of the crousal previews. This allows completely customized crousals to be downloaded in high quality PDF or image formats.