JS

JS Intersection Observer API For Lazy Loading Image

Intersection Observer API can be used to detect intersection between two elements. The most common case to use is lazy loading image.Lazy loading means we load the image when it’s needed, in common case is when the image is shows up in the browser viewport. Note: When testing it, you may notice the intersection callback […]

Continue Reading...

MongoDB | Mongoose | NodeJS

Mongoose Not Creating Collection

If collection not created or the create() or save() callback is never triggered, most likely the issue is related to how the model created. From Mongoose doc: Note that no tanks will be created/removed until the connection your model uses is open. Every model has an associated connection. When you use mongoose.model(), your model will use […]

Continue Reading...

NGINX | Web Dev

ERR_CONTENT_LENGTH_MISMATCH

OS: MacOS SierraWeb Server: NGINX My local web dev environment using NGINX proxy to Webpack dev server. I use domain name to open the dev web instead of localhost. But today, the web page won’t open and showing ERR_CONTENT_LENGTH_MISMATCH in browser console when requesting some files. I thought the issue caused by browser plugins, but […]

Continue Reading...

Vue JS

Set API End Point Before Vue App Loaded

Case scenario: We have two API end points to call based on user’s setting, lets say ‘region’ The base URL is set in Vuex store and persisted in local storage or cookie When user reloading the page, the API call should be calling the correct API end point based on the saved region How we […]

Continue Reading...

Random Opinion/Thought

Freedom? What is it?

I think the only living creatures we call “animal” have real freedom. Do you think you have freedom? Do you think what you see on internet is your freedom or information that controlling your mind and behavior? Don’t answer, just… Think… Or…. Never stop asking

Continue Reading...

Web Accessibility

Web Accessibility Notes

All input form has label right close to it. Nice form sample from Udacity lesson here. Use 16pt as min font size. This also helps you to eliminate auto-zoom on iOS Safari 😩 Do not set focusable on all contents! Only set focusable (tabindex=”0″) to elements which needs user interaction. Keep the element tab order […]

Continue Reading...

Random Opinion/Thought

WordPress Gutenberg Editor

It’s been quite a while since my last post using WordPress. And now I’m using latest WordPress. When I was trying to create my first post, I was surprised with new editor. I see it is intended for helping user to write faster without any HTML knowledge, but apparently it’s too smart and annoying in […]

Continue Reading...