Image for post
Image for post

Before continuing on this tutorial, ensure you have reviewed/read part 1 before moving forward: Setting your own spring boot server via JDBC part 1 | by Michael Tong | Dec, 2020 | Medium

In part 2, we will talk about how to set up endpoints to perform crud operations, as well as the structure of the rest of the application.

To have some context as to how the application will be implemented, let’s take a look at the following image:


Image for post
Image for post
Photo by Markus Spiske on Unsplash

Have you ever figure out an idea for your own project and you finished building your UI but you just don’t know how to start up your own backend server?

Reading this article I assume you have mastered basics of core java before moving forward.

I will talk about how to get a spring jdbc project running on a pc. And this article will be talking about how to install all the required components onto your machine.


Image for post
Image for post
Photo by Phil Desforges on Unsplash

Reading from the title, you are probably thinking: why not use a 3rd party library to build the table and get the job done? Won’t it be more convenient to just use a library that has pagination and filter build in.

It depends on what you are trying to accomplish.

If your goal was simply to build a simple table with pagination built in, then feel free to use a library. …


Image for post
Image for post
Photo by Halacious on Unsplash

You have probably typed something in a google search bar and see suggestions coming up before you finish typing?

Yes, it is common these days but imagine not having the functionality in place? Won’t it be annoying to finish typing a key term that you know you will be using multiple times.

In this article, we will be talking about on how to implement the autocomplete feature in react.

To understand how to implement this, here are key components to remember:

  • understand condition that hide/show autocomplete
  • understand how to scroll on autocomplete items as user press up and down to…


Infinite Scroll With Photo Gallery in React
Infinite Scroll With Photo Gallery in React
Photo by kimi lee on Unsplash

To understand the context of what and how infinite scroll works, you can read the following article: https://medium.com/dev-genius/infinite-scroll-with-photo-gallery-in-vanilla-javascript-9dc1d3896cf7

This article is pretty much a react version of the article I just included. The focus of this article is to understand how infinite scroll works as well as how to display a loading indicator when images are being retrieved. By reading this article, I assume you have background and experience coding in react and javascript in general.

As mentioned in the article provided, we have to understand three things:

  • HTML that contains the images and a loading indicator
  • a CSS file…


Image for post
Image for post
Photo by Vincentas Liskauskas on Unsplash

Like most people in the world, you probably have a facebook account.

Have you ever wondered why as you scroll down along the main page you can see more posts popping up?

Today we are going to explain how that works with vanilla javascript, css and html.

To understand how all of these works let’s first understand how the whole application will be built all together. There are three components to this:

  • html that contains the images and a loading indicator
  • a css file that controls the animation of loading indicator and how big the images are
  • a javascript file…


What is CSS Grid and How Does it Work?
What is CSS Grid and How Does it Work?
Photo by Michael Dziedzic on Unsplash

Have you ever went onto a beautiful website and wondered why certain tables are aligned the way, or at least, be able to adjust as the user stretches or minimize the screen?

In CSS, there are generally a few ways to do it:

  • flex-box
  • CSS grid
  • media query

All these properties allow HTML elements to be ordered in a different horizontal/vertical format as well as adjusting its width/height according to the screen size.

Interesting right? Today we will go through CSS grid, which combines the benefits of what flex-box and media query offers.

What is CSS grid?

CSS grid is a layout method designed…


Image for post
Image for post
Photo by Science in HD on Unsplash

Have you ever look at a factory and wonder how things are created so quickly, in such an automated fashion?

When we are buying something that came up out of a factory, we are never concern how the factory produced what we are looking for. We are only concerned about getting what we requested, which is the item we are buying ourself.

That’s how the factory pattern works in java.

With factory pattern, objects are created without exposing the creation logic to the client and refer to newly created object using a common interface.

What? What does that even mean?


Image for post
Image for post
Photo by RetroSupply on Unsplash

As we know, java is a strongly typed class. It expects every single object instance or class it runs into to be specified a type.

And that’s fine if your application works as a single standalone application that does not interact with any third part source codes. Reality is, it doesn’t really work that way and most likely you might be interacting with other external sources.

Let’s say we have the following code:

We are assuming this function will return the string in all scenarios. …


What is a Promise in JavaScript?
What is a Promise in JavaScript?
Photo by Xu Haiwei on Unsplash

That’s right! Promise is all about waiting for feedback.

Today we will be talking what a promise is and also about the following types of promises:

  • promise.all
  • promise.allSettled
  • promise.any
  • promise.race

Before we talk about any of this, let’s understand what a promise is.

A promise is an object that will return a resolved object or reject an object sometime in the future.

To put it simply, a request is made and this request, once completed, will tell us if it is successful or not.

Let’s look at the following example:

Hm…where are the promises? Sure, I am fetching data…

Michael Tong

Coding is nothing but a renovation of ideas through fundamental concepts. Stay sharp and stay hungry to learn!

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