How to create new lines inside text prop values in Next.js and JavaScript in general.

How to Create New Lines Inside Text Prop Values in Next.js and JavaScript in General

Installing the latest version of MongoDB on macOS Monterey.

Installing the Latest Version of MongoDB on macOS Monterey

Narrowly escaping the need to remove Giscus.

Narrowly Escaping the Need to Remove Giscus

Reinstalling Git with Homebrew to get the latest version.

Reinstalling Git with Homebrew to Get the Latest Version

Fixing the path to Xcode after installing the latest version on macOS Monterey.

Fixing the path to Xcode after installing the latest version on macOS Monterey

Why you should use the npkill Node module.

Why You Should Use the NPKill Node Module

Why I chose plausible analytics with my Next.js site.

Why I chose plausible analytics with my Next.js site

Why being able to use dotenv with Next.js is so huge.

Why being able to use dotenv with Next.js is so huge

How one can use the Google Meet video conferencing app with screen sharing capability.

Using Google Meet for on-the-fly screen sharing

An application I created at the height of the COVID-19 pandemic as part of the course content of a Dynamic Web 1 (JavaScript) course I was (and still am) teaching.

Audio Visual Slider

I always had wanted to be able to create games using the HTML5 Canvas 2D API, so I built (and refactored) a Canvas 2D Breakout Game inspired by one I came across on MDN.

Canvas 2D Breakout Game

A little text to speech app I created so that cat lovers could be inspired to write about their cats using the Speech Synthesis API while being inspired by the app’s cat image slideshow.

Cat Whisperer

An app which creates a custom HTML5 video player using the Shadow DOM so that the video player can go full screen without issue.

Custom HTML5 Video Player and Shadow DOM

I have always wanted to closely tie audio and audio volume controls with visual and create multiple audio sources, which I tie to one input of type range. So what better way than with the HTML5 Web Audio and HTML5 Canvas 2D APIs!

Dragging Bubbles App

A fun little game made with JavaScript, SCSS/CSS3, and HTML.

Guess The Keys App

An idea I had been brewing for a while where students could join, save information from classes and collaborate.

LetsBCoding WordPress

An app which makes sounds on the web page when clicking it or dragging the computer's or mobile device's pointing device around the screen.

Making Music in the Browser

This search application utilizes two APIs, the fetch API method, the map() method, event listeners, createElement, appendChild, JavaScript array of objects, template string literal interpolation, vanilla JavaScript, and more!

Monsters API App

I recently upgraded this project to React 18 using a top-level React class component AND functional components. The class component contains the state, and the other components contain the props.

Monsters Rolodex 2022 Classes

This version of the Monsters API app utilizes React 18, functional components, AND hooks.

Monsters Rolodex 2022 (Hooks)

A real time communications app built with websockets/socket.io websocket library, Node.js, and Express.

Node Chat App

A real time collaborative drawing app built with websockets and the socket.io websocket library, express, and node canvas.

Node Collaborative Drawing

This client side version the OMDB API app addresses potential built-in API errors. I felt it important to introduce my students to application error handling and thus a basic form of "testing".

OMDB API JS App

An app which implements the OMDB API Using Nodejs, protects your API key, and deploys to Heroku.

OMDB API NodeJS

This application utilizes the Poke API based on Pokemon characters, the fetch API and AJAX, JavaScript promise chaining, the map method, the JS createElement method, checks for non-existent images and removes them or or sets their display properties to none, and more!

Poke API App

A piano deyboard application built with JavaScript, es6 modules, the Web Audio API, event delegation, Sass, and more.

Rockin Synth

A voice controlled notes app using the Speech Recognition Api and React.

Speech To Text

A Random Quote API Application using the What Does Trump Think? API.

Trump Talks Trash

A Web Audio API app which uses AJAX to retrieve a locally hosted audio file.

Web Audio API AJAX

An audio player in the form of a jukebox created with es6-javascript, html5-audio, oop, and includes a search-in-text searchbar.

Welcome to the Groove

A Wikipeadia Viewer application in which a user can search Wikipedia entries in a search box and see the resulting Wikipedia entries.

Wikipedia Viewer

How I came to add image lazy load functionality and next-gen WEBP image file format to an HTML, CSS, JS site's image gallery due to poor page performance.

Image Lazy Loading with Vanilla JavaScript

The emerging new balance of power and why it is EVEN MORE IMPORTANT for everyone to become more technologically aware and savvy.

The emerging new balance of power

Authenticating to Github via HTTPS using a username and password is no longer a valid way of connecting to Github via the Command Line (Mac) or Command Prompt (Windows).

The New HTTPS Authentication to Github

Because sometimes we are not physically in the same location, but perhaps we want to collaborate on code within the same editor, we can connect with each other via VS Code’s Live Share extension.

Why I fell in love with VS Code’s  Live Share and why you should too

I have been wracking my brain lately as to how to engage team members more via live code collaboration. This extends to both the classroom and work.

Successfully Using Live Share Extension in VS Code

Lately the opportunity arose to demonstrate how the Windows Command Prompt (aka CMD, acronym for Windows Command Processor) works and how to get around one’s Windows computer.

Windows CMD basics and Commands By Example

Technology will lead us down a path of DIY (Do It Yourself), and the arrival of the pandemic confirmed that.

The New World: Do It Yourself (DIY)

How to change the default format for screenshots created on your Mac.

Changing Mac default screenshot file format to jpg

How iTunes Match saved me from losing iTunes Purchases bought under previous Apple IDs.

How iTunes Match saved me from losing iTunes Purchases bought under previous Apple IDs

How to configure ESLint to recognize async/await in a Node.js/Express.js application.

How to enable async await in a Node.js/Express

Why I switched from MongoDB Compass to Robo 3T in local development.

MongoDB Compass vs Robo 3T vs Local Mongo Shell

Restoring a file to a specific state using Git.

Reverting a File to a Specific Revision in Git

Using a POST request in a local environment using VS Code's REST Client extension.

Using POST request with VS Code's REST Client

An alternative to the Postman Collaboration Platform for API Development. It is a VS Code extension called REST Client.

Using VS Code's REST Client extension instead of Postman

Sometimes we are in a rush and we push our git commits to remote with messages that might contain typos, or we find later on that we could have simply made a better commit message.

Rewording a pushed git commit message

How one can hide the default alternate placeholder image both when an image does not exist or the link passed to the value of its src attribute is broken.

Hiding a "N/A" value of a src attribute  of an img tag from an API

Installing Python 3.8.0+ on your Mac with pyenv.

Installing Python 3.8.0+ on your Mac with pyenv

How to add the host property to your webpack.config.js file, thereby permitting you to view your app in localhost on other shared network devices.

Adding host property to webpack config

Setting up more than one wireless printer with HP ePrint using the Hp Smart App.

How to set up more than one wireless printer with HP ePrint using the HP Smart App

How to enable the auto-complete feature in Git.

Enabling the auto-complete feature in Git with Z-shell

How to replace the old pre-installed default version of Python on Mac OS with the latest version of Python via Homebrew.

Installing the latest version of Python on Mac OS Catalina and overriding the old default pre-installed version

How I finally resolved the diminished rendering in the browser issue I encountered when using VS Code's Live Server.

The real reason behind why VSCode seemed to go haywire on me

How to add the confetti-js npm package to an application you are hosting on Github gh-pages.

When deploying an app to gh-pages that uses confetti-js

Recently I completed an application using localStorage called Storage Fun With Forms. I really wanted to make something fun that my students could  enjoy and learn from as well!

Building A Storage Fun With Forms App

How to add the really cool jscolor color picker to an application!

The really cool jscolor color picker

A new way that I implemented Flexbox to achieve a sticky footer in the new application I created for my students called "Storage Fun With Forms".

Sticky Footers in the age of coronavirus

How challenges, road blocks, and mistakes can lead to fruitful progress as a web designer or developer.

How challenges, road blocks, and mistakes can lead to fruitful progress as a web designer or developer

How to record, save, and download Blackboard Collaborate Ultra audio/video sessions.

Recording Saving and Downloading Blackboard Collaborate Ultra Sessions

Forking a repository on Github and subsequently creating a pull request on the original repository.

Forking A Repository on Github and Subsequently Creating a Pull Request

How I solved the issue of moving buttons on click, and what the side effects were of that move!

How to prevent buttons from moving on click

How to use the Live Server extension for VS Code.

VS Code and the Live Server extension

Why one should switch over to the ZShell from Bash if one has macOS Catalina installed on their machine.

Switching Shells on macOS Catalina

How to add images in the body of Gatsby markdown posts when using Netlify CMS.

Images in Gatsby Post Content when using Netlify CMS

Using Git Large File Storage in your repositories.

Git Large File Storage

What tools will help you in checking your source code AND html markup, thereby reducing the number of errors present in your code base or html markup.

The importance of taking time out to check your code and html markup

The importance and advantage of the -u flag when pushing a local git repository to remote for the first time.

The importance and advantage of git push -u

How to circumvent the inability to use your old Sass installation on on your Macbook Pro when upgrading to OS Catalina.

Using node-sass instead of system Sass in macOS Catalina

Resources providing information about APIs for developers and what pitfalls to watch out for when working with APIs.

APIs for Developers and what pitfalls to watch out for

How to take awesome screenshots without any of the accidental deselect or inaccuracies hastle in older versions of the OSX operating system.

How to take a screenshot on your Mac (Mojave or later)

How to reconnect a Github repository to the Github Integration app for Jira after discovering that your

Github Integration App Smart Commits on Jira

Creating a sticky footer after having already built the basic infrastructure and code of my Message Me app.

How to create a sticky footer when you originally didn't account for having one

Adding media queries to a React element's inline styles.

The window object, React hooks, and GatsbyJS

When the Homebrew command brew update fails.

When the Homebrew command brew update fails

The importance of specialization, and the importance of doing things we believe in instead of what others expect us to do.

Specialization and the Importance of Not Spreading Oneself Too Thin

The pitfalls of using the npm package multer-s3 for uploading files onto Amazon Simple Storage Service (aka S3) and what might be viable alternatives.

Multer, Amazon S3 and AWS Amplify

I first learned about and started using graphql with GatsbyS, and I loved it, but I really got to know more about it when I learned how to use it for the backend with Nodejs.

Nodejs and graphql

Github automated security fixes and how they work.

Github automated security fixes (beta)

I talked about how I have been trying to add Netlify CMS to interglobalmedianetwork.com, my business website.  I just completed implementing it a little while ago today.

Gatsby, gatsby-image, and Netlify CMS

During the past couple of days I have been working on adding a netlfiy-cms to my Gatsby site.

Gatsby, terser, and source-maps

Node Security/npm audit appeared for the first time in my Terminal window in March of last year (2018).

Outdated JavaScript tooling, vulnerabilities and security

Google Chrome has become surveillance software. It’s time to switch. But does Firefox stand up against it?

The Browser War: Chrome vs Firefox

The second patch that was made to Firefox to fix a second vulnerability in the browser software and how important it is to keep abreast of cyber security news and  what is going on around us and the tools we use every day.

Firefox 0 day flaw update

The bug I encountered when typing non-alpha numeric characters in a text editor on my Mac, and how I came to fix the issue.

The Apple dictation and text editors bug

Web security and why one would choose GatsbyJS over other static frameworks.

GatsbyJS and Security

Adapting your gatsby site to the limitations of gatsby-image.

Adapting your gatsby site to the limitations of gatsby-image

Yesterday I pretty much completed the site. There are still things to do, add, etc. But that will happen over time as needed.

Outdated Content And Google Custom Search

I recently changed my hosting for my business site to Netlify from gh-pages, but my Macbook Pro, which I use for development, does not point to the newly propagated site.

Why Your Local Machine (Computer) May Not be Pointing to Your Newly Propagated Site

How to deploy an app or site hosted on a Github repository to Github gh-pages with git subtree.

Deploying to gh-pages with git subtree

How to add new content to your hugo website that is hosted on Github gh-pages.

Adding new content to your hugo website hosted on gh-pages

Creating a Custom HTML5 Video Player And The Shadow DOM.

Creating a Custom HTML5 Video Player And The Shadow DOM

Why is there data recovery? Because sometimes you may lose a commit. Stuff happens! Remember. Nothing is perfect.

Hi there!

Latest Podcast

Listen to the latest episode

Latest Post

How to Create New Lines Inside Text Prop Values in Next.js and JavaScript in General

Specialties

Full Stack JS

Full Stack JS

Dev Workflows

Dev Workflows

Git For Developers

Git For Developers

Git For Non-Developers

Git For Non-Developers

Command Line

Command Line

One on One Instruction

One on One Instruction

Dev Tips

Dev Tip #1

Dev Tip #2