VueJS
Introducing utils@techformist - A Developer's Swiss Army Knife
· ☕ 4 min read
Today, I’m excited to introduce utils.techformist.com – a collection of client-side web utilities designed to make developers’ lives easier. Built with speed, simplicity, and privacy in mind, this tool suite aims to be your go-to resource for common development tasks. Why Another Utility Site? The web is full of utility sites, but many come with drawbacks:

Create a Client-Side PDF Generator with Nuxt 3
· ☕ 13 min read
We will walk through the steps to build a document analysis web application using Nuxt 3 and Azure Document Intelligence. This application allows users to - Features will include - 🔍 Create/pass a template in HTML and placeholders for values 🕶️ Real-time document analysis status 💾 Download merged content as PDF Here’s a quick demo.

Document Analysis App with Azure Document Intelligence
· ☕ 4 min read
We will walk through the steps to build a document analysis web application using Nuxt 3 and Azure Document Intelligence. This application allows users to - upload PDF or images specify fields (if needed) extract specific fields of information Features will include - 🔍 Extract custom fields from identification documents 🔄 Real-time document analysis status 💾 Download extracted data as JSON 🎨 UI with Shadcn-vue /Tailwind CSS Here’s a quick demo.

Teleport in VueJS
· ☕ 3 min read
Teleport is a new feature introduced in Vue 3. Teleport provides better control to developers on where exactly an element is rendered. Get Teleporting Let us create a new Vue 3 app to start playing around with teleport. We will use Vite, because it is 2021. 1 npm init @vitejs/app Provide a project name (teleport) and select vue as the template.

Create Reddit Reader Using Vue 3 & Vite
· ☕ 7 min read
Hello everyone! Hope you are all set for the new year. While you are waiting for the Y2020 to end with bated breath, here’s a post to kick start your Vue 3 journey. We will create a Reddit reader using Vue3 and Vite! This post is more useful for someone with basic knowledge of Vue and Vue 2.

Save div as Image in Vue
· ☕ 3 min read
We have previously seen how a div element can be saved to a file. In this post we will see how we can save div tag contents as an image in Vue. How do we print the div? Here are the steps at a high level - Draw contents of div to canvas.

Build a Simple Timesheet App using Vue & Vuetify
· ☕ 21 min read
In this post we will see how to create a simple timesheet app using Vue and Vuetify. This is not quite a comprehensive tutorial on Vue or Vuetify, rather a demo of front-end features, see how easy it is to build an usable app, and in general, how modern app development makes the whole process enjoyable.

Create Simple Tooltips in Vue
· ☕ 3 min read
Tooltips are omnipresent, or rather have to be. While there have been excellent standardisation of user experience since we saw what Bootstrap was capable of, there are days and applications that can throw off users with strange icons, buttons and navigation. Ergo, tooltips. The humble tooltip can provide helpful hints, short messages and guide user on what a particular button, text box or any other element will do before clicking the thingy and causing destruction of a planet.

Reusable Confirmation Dialog in Vuetify
· ☕ 3 min read
Dialogs are those thingies that popup on your UI and are handy to allow users to perform actions without navigating away from the screen. For example, here’s one that enables users to create new request.. .. and here’s an example from Vuetify site that shows a short message. The v-dialog component is the recommended way to show confirmation dialogs too.

Request Redirect for Nginx in SPAs
· ☕ 4 min read
Redirection can be easy enough on Nginx. Let’s see how we can utilise that for our single page applications coded in Vue, React, etc. Nginx and Redirection Nginx configuration is simple but powerful. All we need is a couple of lines to setup our server. Add the below lines to the Nginx configuration files (e.

Social Share Buttons in Vuetify
· ☕ 2 min read
Enabling social share buttons in Vuetify is quite easy. All you have to do is stitch together three components provided out of the box - Speed dial Buttons Icons We will create a quick demo on Codepen. Create a new Codepen, click on Settings, navigate to JS and add the below libraries -

Using Vue with Firestore
· ☕ 12 min read
Firestore can make up for a great backend application. You can get started quite easily, scale it up nicely, and in general, worry less about the “server” side of things. While it is quite easy to use Firestore as-is, using it in Vue opens up a whole new universe. But, first - let’s go through the grind of knowing why we would want to do this?

Masonry Layout in Vuetify
· ☕ 4 min read
Vuetify is a God-send for lazy developers like me. Thanks to Vuetify I have all styles standardized, customise UI to my heart’s content and create an app that is ready to take on any device. But, Vuetify does not support masonry layout for your grid. Here’s a look at available options if you need masonry layouts in your projects.