Author Image

Welcome to KaioTech

KaioTech

TechGroup

A TechGroup that develops innovative solutions for the modern world. We are a team of experienced developers and designers who are dedicated to helping businesses succeed in the digital age.

Certified Kubernetes Security Specialist
Istio and IBM Cloud Kubernetes Service
Artificial Intelligence and Machine Learning
Software Development
Software Maintenance
Design Systems
Cloud Transformation
Optimization

Techstack

Publications

Flatten Json objects by traveller-tree
traveller-tree 7 Mar 2024
HoHai

This lib provide 2 features. Get schema of json object Flat json object into array of elements.

NodeJS Cloud Tranformation Software Development
Details

Recent Posts

Hero Image
Sentry - Handle Exception

is Sentry a singleton ? Based on the typical usage of Sentry in JavaScript/TypeScript applications, Sentry is generally implemented as a singleton. Here’s a brief explanation: Singleton pattern: Sentry is typically initialized once at the application level, and then used throughout the application without needing to create new instances. Global configuration: The Sentry SDK is usually configured once with a call to Sentry.init(), which sets up global error handling and configuration.

Wednesday, October 9, 2024 | 5 minutes Read
Hero Image
Flutter State Management

Shopping Cart Application List items for shopping Click Add/‘Remove’ item in shopping Show total number of added items in shopping card Problem with current data structure The first thing you need to do is to define a data structure to store your app’s state. To do that, we must determine what’s considers to be the app’s state We know there are at least 2 components that require state: the product list and card icon.

Tuesday, September 24, 2024 | 4 minutes Read
Hero Image
React Query

+++ draft = true +++ Reference Global state Avoid prop drilling Access data accoss our application without copying flowchart A["PostsContext()"] B["posts state: [posts, setPosts]"] C["status state: [status, setStatus]"] D["PostsContext()"] E["refetch function hook"] A--create-->B C--refer-->B D--refer-->B Global components: Not remove dedup requests export function PostsContext({ children }) { // Every time call `PostsContext` function, we will create bellow objects const [posts, setPosts] = React.useState([]); const [error, setError] = React.useState(); const [status, setStatus] = React.useState("loading"); const refetch = async () => { try { setStatus("loading"); const posts = await axios.get("/api/posts").then((res) => res.data); setPosts(posts); setStatus("success"); } catch (err) { setstatus("error"); setError(err); } }; const contextValue = React.useMemo(() => ({ posts, status, error, refetch, })); return <context.Provider value={contextValue}>{children}</context.Provider>; } Consumer export default usePosts() { const {posts, status, error, refetch} = React.useContext(context); // Every component use `usePosts` then `refetch` will be called at mounting time // Not remove dedup requesting React.useEffect(() => { refetch() }, []); return { posts, status, error, refetch, } } Fix dedup requests export function PostsContext({ children }) { // Every time call `PostsContext` function, we will create bellow objects const [posts, setPosts] = React.useState([]); const [error, setError] = React.useState(); const [status, setStatus] = React.useState("loading"); // Add new ref object which cannot reset between re-rendering const activePromiseRef = React.useRef(false); // Stick `refetch` function with a new ref object // If any other requests that happen while the promise is still pending we will reuse the promise from the original request const refetch = () => { if (!activePromiseRef.current) { activePromiseRef.current = async () => { try { setStatus("loading"); const posts = await axios.get("/api/posts").then((res) => res.data); setPosts(posts); } catch (err) { setStatus("error"); setError(err); } finally { activePromiseRef.current = false; } }(); // Execute immediately } // If any other requests that happen while the promise is still pending we will reuse the promise from the original request (we don't fire extra one) return activePromiseRef.current; }; const contextValue = React.useMemo(() => ({ posts, status, error, refetch, })); return <context.Provider value={contextValue}>{children}</context.Provider>; }

Thursday, April 18, 2024 | 2 minutes Read

Accomplishments

Linux Foundation System Administrator
Linux Foundation March 2018 - March 2019

This course helps to understand the key concepts such as networking, storage, security, maintenance, logging and monitoring, application lifecycle, troubleshooting, API object primitives etc. It also help to grow the ability to establish basic use-cases for end users.

View Certificate
Machine Learning
Coursera Jun 2020 - Jan 2021

This course provides a broad introduction to machine learning, datamining, and statistical pattern recognition. Topics include: (i) Supervised learning (parametric/non-parametric algorithms, support vector machines, kernels, neural networks). (ii) Unsupervised learning (clustering, dimensionality reduction, recommender systems, deep learning). (iii) Best practices in machine learning (bias/variance theory; innovation process in machine learning and AI).

View Certificate
Grokking the System Design Interview
educative Jan 2018 - Sept 2018

This course is a complete guide to master the SDIs. It is created by hiring managers who’ve been working at Google, Facebook, Microsoft, and Amazon. We’ve carefully chosen a set of questions that have not only been repeatedly asked at top companies, but also provide a thorough experience to handle any system design problem.

View Certificate
Mastering Multithreading Programming with Go (Golang)
Udemy Nov 2017 - Mar 2018

Discover how to create responsive and high performance software. Develop programs with Golang that are highly Concurrent and Parallel. Improve your programming skills in Go with more advanced, mulithreading topics.

View Certificate

Achievements

Best Presenter

Champion

Graduation

Award Winner