Controlling embedded videos using voice commands

Microphone with filter
Microphone with filter
Photo by Thomas Le on Unsplash.

How does voice command work? Can you use voice command to control a video? How can you implement voice command as a feature in your React app? These are questions I asked myself as I was working on building an app with embedded video. I wanted to be able to control the video hands-free using voice command.

I ran into a common problem: I was not finding resources that walked through the steps required to set it up for my specific use case. …


Using Self-Referential Relationships to Add Meaningful Interactivity to your App

Image for post
Image for post
Photo by George Pagan III on Unsplash

Have you ever wondered how social media platforms such as Twitter, Instagram, and Facebook implemented a function to follow and unfollow other users? While building a social media app, I struggled with this for a long time, and thanks to a couple very helpful blogs, along with my amazing teammate (shoutout Aleksa!), I was able to build both features! And the best part is, it was not as difficult as it seemed.

Before getting into details, here’s a summary of the process:

  1. Create a User model with desired attributes
  2. Create a Follow model to act as joiner with foreign keys
  3. Create relationships in each model, referring to the corresponding class (this is what makes it…


5 steps to improve organization and workflow from day one

Image for post
Image for post
Photo by Proxyclick Visitor Management System on Unsplash

Building an application can be extremely complicated and time-consuming. The workflow you establish when starting your project will be the baseline for how everything to follow unfolds. If you start off disorganized and unclear, your app will suffer from it. Taking the time to develop an organized plan and set milestones from the beginning will ensure your final product can achieve its full potential.

Let’s walk through some standard pre-work checkpoints you can use to develop a standard process for building an app. Here are the five steps to take before you jump into code mode.

1. Outline Features


Highlighting Website Interactivity and Responsiveness

Image for post
Image for post
Photo by UX Indonesia on Unsplash

Designing your web application is one of the most important steps in the entire website build process. This is the step where you use details about your target user to form an engaging and welcoming experience, keeping them from getting frustrated or leaving quickly. Follow along below for some tips on how to integrate interactivity and responsiveness in an effective way.

Remember the Target User

The most important baseline for your design is to think about who your target users are and what they will be using your app to do. …


Improving workflow efficiency by using built-in shortcuts

Image for post
Image for post
Photo by Icons8 Team on Unsplash

Have you ever been working through a tedious coding project, and simple computer interactions were slowing you down? There are countless times where you will need to copy a line of code to reuse, shift around a code block, or find a previously written variable. There is also a constant need to be saving your file to ensure the code is up-to-date. Each of these small tasks take time, and it’s important to identify what improvements can be made.

Your time is valuable — I am a huge advocate for assessing a workflow, finding patterns, establishing goals for growth, and implementing change in order to constantly improve efficiency. As programmers, we need all interactions to be easy and repeatable. …

About

Hannah Kofkin

fullstack developer + designer

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