Photo by Jason Dent on Unsplash

As a full-stack engineer, I’ve worked on several apps built on Laravel backend and Vue.js frontend, and sometimes it can be a bit of a hassle trying to get some simple things in place at the intersection of both stack ends. Luckily for us, Vue.js provides a sleek way to have the best of both worlds.

I have some logic like validation error/feedback handling being handled in Laravel’s templating engine — blade, but I also want to be able to easily add a reactive password visibility toggler with Vue.js, without needing to rewrite my blade error rendering codes, especially since…


Photo by Alexander Andrews on Unsplash

Although things within our codebase don’t always turn out the way we imagine they would, and (obviously) not all refactoring make for better performance, but sure, from time to time we all battle the tendency of becoming too wrapped up in our own over-engineering bubble — trying so hard to get our implementation perfect from the start. I have learned over time not to worry so much about getting it right from the start but instead, making small changes in incremental steps while prioritizing the bits with the most performance implication.

Let’s consider a scenario that can potentially require some…


Photo by recha oktaviani on Unsplash

Bugs are an almost inescapable impediment during development, and sometimes we get stuck with some of the really really pesky ones. Lucky for us we do have some really powerful tools accessible in our engineering toolbelts — the dev tools. Browsers have gotten really powerful, and quite capable of much more than rendering web pages. They’re packed full of awesome tools that can really help improve different aspects of our web development processes if we know just where to look.

If you’re working on an application with a backend built on Laravel PHP framework, and some frontend functionalities built around…


Photo by jesse orrico on Unsplash

NB: All my featured code snippets will be summarized to only capture the most crucial details in context of the topic aspect under discussion.

As complexity grows through the development cycles of our application, we may from time to time, start to feel the need to replicate one or more existing functionality in multiple parts of our app. A good example of such a handy functionality is a notification system, since we may need to fire up a notification for more than one occasion throughout our app.

For context, consider two Vue components; UserProfile.vue, and MessageInbox.vue. …


Photo by Jon Tyson on Unsplash

“Are you sure you want to…?” — A million-dollar question (almost literally)

The question above typifies a fairly popular fail-safe mechanism in many User Experience designs, especially around actions whose consequences cannot be easily undone. When a user triggers certain actions like; delete an account, delete a record from a list, etc., we want to be sure that they meant to, otherwise, there’ll be too many users unintentionally tripping up these totally avoidable landmines within our applications, which consequently culminates in bad User Experience.

There’s an endless list of nifty tricks and tools out there to create a practical action…


Handling single file uploads with Uppy in a Laravel & Vue.js app

Photo by Mathew Schwartz on Unsplash

Disclaimer:

This content is developed to give junior-intermediate Laravel/Vue.js developers (or enthusiasts) a general sense of how to implement Uppy file uploader JS plugin within a Laravel & Vue.js based application. My featured implementation isn’t necessarily ‘perfect/superior/acclaimed’. My intention is to help you find a path to your own ‘perfect’ implementation — one that’ll hopefully suit your use case better.

Before we begin, I’d like to assume a few things — not covered herein:

  • You already have some experience working with Laravel, Vue.js, NPM, and other such related development tools.
  • You have a working installation of Laravel based application
  • Your…


Bootstrap confirm-delete dialog modal in a Laravel based web app

Photo by Volodymyr Hryshchenko on Unsplash

Disclaimer:

This content is developed to give junior-intermediate Laravel/Vue.js developers (or enthusiasts) a general sense of why and how to implement reusable vue.js components in a Laravel-based-backend application. My featured implementation isn’t necessarily ‘perfect/superior/acclaimed’. My intention is to help you find a path to your own ‘perfect’ implementation — one that’ll hopefully suit your use case better.

Before we begin, I’d like to assume a few things — not covered herein:

  • You already have some experience working with Laravel, Vue.js, NPM, and other such related development tools.
  • You have a working installation of Laravel based application
  • Your database is setup


Curious as to how you can connect to your database directly from inside PhpStorm?

Photo by Frederick Tubiermont on Unsplash

JetBrains’ PhpStorm is a very powerful IDE built especially for PHP development and has grown in popularity among web developers of this language. It is my preferred choice of IDE for PHP based projects, and I’m pleased to share this with you, of the many benefits I enjoy using the IDE. I’m not sure how popular this particular feature is, but maybe one or two people will find it handy in their development process.

Step 1 — Locate the Database tab and click to open menu

  • You probably have the menu docked in on the far right vertical bar as…


Humans, machines, and Artificial Intelligence (AI)

Photo by Franck V. on Unsplash

Our species has only survived this long on the basis of its ability to continuously adapt to the environment and the ever-emerging changes all around. We have also thrived on our instinctive inclination towards solving problems — natural or man contrived.

Although the nature of naturally occurring environmental threats to humankind has been pretty much the same, and sometimes even predictable, threats that emerge as a result of human actions are constantly evolving with us.

We are only still here because of our ability to respond intelligently to situations as they emerge.

Interestingly, we did not acquire this trait at…


A quick look at the vue-good-table plugin

Photo by Mika Baumeister on Unsplash

Disclaimer:

This content is developed to give junior-intermediate Laravel/Vue.js developers (or enthusiasts) a general sense of what’s made possible via a handful of batteries shipped out-of-the-box with the plugin in view. My featured implementation isn’t necessarily ‘perfect/superior/acclaimed’. My intention is to help you find a path to your own ‘perfect’ implementation — one that’ll hopefully suit your use case better.

Before we begin, I’d like to assume a few things — not covered herein:

  • You have a working installation of Laravel based application
  • Your database is setup
  • and you have a terminal in place to run some commands

Some technical details about my local setup — just for reference

Versions:

  • Nginx…

David Abiola

Human & software engineer. Interested in ()=> {[Arts, Education, Music, Science, Tech, AI, co-Humans]};

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store