Techformist

Build a Simple Timesheet App using Vue & Vuetify

📅 Oct 28, 2020 · 📝 Jan 1, 2021 · ☕ 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

📅 Oct 21, 2020 · 📝 Nov 1, 2020 · ☕ 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.

Learning Golang with Fiber

📅 Oct 14, 2020 · 📝 Oct 22, 2020 · ☕ 10 min read

I started with Golang not too long ago, and I loved the fact that I can create a web application with a couple of lines of code. But, as always frameworks help to take that web application to places. Being a practical person who develops apps for side projects and for a living, I cannot simply overstate this fact.

Golang vs. NodeJS for Web Apps - A Small-scale Developer View

📅 Oct 7, 2020 · 📝 Oct 21, 2020 · ☕ 7 min read

If you had enough of single threaded behaviour of Node and are ready for the next level (/s) - I strongly recommend you evaluate Go for your next project. Javascript is the most used language in the world and that status will not change in a hurry - thanks to its frontend nature.

Reusable Confirmation Dialog in Vuetify

📅 Sep 30, 2020 · 📝 Oct 13, 2020 · ☕ 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.

Find user's country without Geolocation and IP Lookup

📅 Sep 23, 2020 · 📝 Oct 13, 2020 · ☕ 2 min read

I have this nagging problem of determining an end user’s country/region in my web apps. The reasons for doing that are many - Automatic conversion of an event date/time Display regional news Show prices in user’s currency .. and so on We could do two things to determine a user’s region -

Multiple Ways to Define Functions in Javascript

📅 Sep 16, 2020 · 📝 Oct 13, 2020 · ☕ 3 min read

We have looked at functions quite a bit on this blog over the last two years. We have seen many avatars of a function including a function object, a function’s method, function of functions, and so on. But, what we have not done is to document all the ways in which we can define functions.

Request Redirect for Nginx in SPAs

📅 Sep 9, 2020 · 📝 Sep 14, 2020 · ☕ 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

📅 Sep 2, 2020 · 📝 Sep 5, 2020 · ☕ 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

📅 Aug 26, 2020 · 📝 Sep 5, 2020 · ☕ 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

📅 Aug 19, 2020 · 📝 Aug 29, 2020 · ☕ 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.

Tooltip in Vuetify

📅 Aug 12, 2020 · 📝 Aug 30, 2020 · ☕ 3 min read

I am a big fan of Vuetify - it has far too many components available out of the box and makes my life as easy as it gets. But that does not prevent me from getting annoyed by small “stuff” that matter. Take tooltip as an example. Vuetify has v-tooltip component to enable tooltips -

Routing and Route Auth in Nuxt

📅 Aug 5, 2020 · 📝 Aug 30, 2020 · ☕ 3 min read

Nuxt enables automatic routing. All you need to do is - Create the Nuxt app Create Vue pages under pages root directory All pages will automatically be routes in the app - no need for a distinct Vue router definition. Automatic Routes in Nuxt Consider the below pages in an example app https://my-app.