React Tips

React form state management without the useState() Hook.

Photo by Kelly Sikkema on Unsplash

In this tutorial, we will explore React form state management using React Final Form. React Final Form allows us to manage state without the need for the useEffect() hook.

What is React Final Form?

High performance subscription-based form state management for React

The observer pattern is a software design pattern in which an object, named the subject, maintains a list of its dependents, called observers, and notifies them automatically of any state changes, usually by calling one of their methods.

Who uses React Final Form?

Among others,


Source Control

Get a local copy of your favorite JavaScript developer’s public code and run it on your local machine.

Photo by Victor Serban on Unsplash

So you found the public GitHub account of your favorite JavaScript/React developer and want to run some of the examples in their repositories. Or a tutorial mentions “the complete solution can be found here.” Great. Now what?

Cloning is done through the command ‘git clone’ and it is a process of receiving all the code files to the local machine.

What We Will Do

For the this tutorial we will use one of my GitHub accounts with a few repositories, but you can use any GitHub account you desire. …


NPM Packages

Create an account in the NPM registry, write some code for your package and publish

Photo by Jess Bailey on Unsplash

Have you ever wondered where those npm packages you install come from Well, wonder no longer, they come from developers like you!

What We Will Do

In this tutorial, we will create and publish to the NPM registry, an NPM package using the following steps.

  • Create an NPM registry account.
  • Write some code that will become your NPM package.
  • Test this locally.
  • Add module.exports to export what will be made available in your package to those who install it.
  • Publish your package to the NPM registry.
  • Test your NPM package by using npm install.

Our focus will be on the process and not the…


Database Tips

Create, get(as list and rows), modify, add and remove data from an Array

PostgreSQL is an open source relational database that supports some amazing data types. In prior articles, we looked at performing CRUD-like operations on the jsonb data type as well as converting a jsonb array of objects in to a recordset for easy querying.

What We Will Do

In this article, I’d like to focus on another data type, the Array data type. Why? Because Arrays are great for storing, at a minimum, lists. Lists of text, numbers and more.

Array Type

PostgreSQL gives the opportunity to define a column of a table as a variable length single or multidimensional array. …


Database Tips

Using the OFFSET and FETCH clauses in Microsoft’s SQL Server.

Photo by K. Mitch Hodge on Unsplash

A common need when working with large amounts of data is how to fetch the data and display it in a reasonable amount of time.

The solution to this problem is pagination. Pagination can be done on the front-end, back-end, or both.

Note: This article is specific to Microsoft’s SQL Server. For MySQL or PostgreSQL, see this article.

Pagination

Pagination, also known as paging, is the process of dividing a document into discrete pages, … Server-side pagination is appropriate for large data sets providing faster initial page load.

Server-side pagination…


Database Tips

Using the LIMIT, OFFSET and FETCH NEXT operators.

Photo by Annie Spratt on Unsplash

A common need when working with large amounts of data is how to fetch the data and display it in a reasonable amount of time.

The solution to this problem is pagination. Pagination can be done on the front-end, back-end, or both.

Note: This technique works well in PostgreSQL and MySQL. For Microsoft SQL Server see this article.

Pagination

Pagination, also known as paging, is the process of dividing a document into discrete pages, … Server-side pagination is appropriate for large data sets providing faster initial page load.

Server-side pagination is more…


React Tips

In a registration form, using useState hooks for each input versus using a user object and a single useState hook.

Photo by Glenn Carstens-Peters on Unsplash

In this article we will explore two ways of tracking state using a simple registration form.

The user enters their name, email address and a password and we keep track of state in two different ways.

  • The first way will be to use the useState hook for each input field.
  • The second way will be to use a user object and a single useState hook with the user object.

Both are valid ways but the second may be preferred for larger forms.

Let’s Get Started

You can use an existing React project (I often keep a “SandBox” application for experimenting) or bootstrap a…


React Tips

Use useEffect to fetch data in a functional component and use setInterval to refresh that data as desired.

Photo by Damir Spanic on Unsplash

What We Will Learn

Although React’s useEffect hook allows you to do many things, In this tutorial we will walk through how to use the useEffect hook specifically to fetch data from an API, and refresh that data periodically.

You can use whatever API you prefer but we will be using the fake API https://jsonplaceholder.typicode.com/ to fetch posts.

https://jsonplaceholder.typicode.com/posts

UseEffect

By using this Hook, you tell React that your component needs to do something after render. React will remember the function you passed (we’ll refer to it as our “effect”), and call it later after performing the DOM updates.

Something important to notice in the…


Freelancing Tips

A Decent Additional Income Stream

Photo by Viacheslav Bublyk on Unsplash

Can you make money on Fiverr?

The short answer to this is yes! I’m not saying you will make a living from Fiverr, maybe you can, but it can certainly be a decent additional income stream.

For me, if I took every request, I could earn between $500-$1,500 of additional income per month.

What I have found is it is best to have several “Gigs”. Why? Because they may not all be in demand at the same time. I have four Gigs.

  • Tutor in all levels of Calculus.
  • Write technical articles and content.
  • Perform technical or mock interviews by phone…

gravity well (Rob Tomlin)

Self-Employed Software Developer, Trainer, Consultant. Keeping up to date. I’ve noticed in over 28 years of programming, one’s current skills have a shelf life.

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