alicarbonteq

Atomic Design Methodology with React and TypeScript

Problems we have faced in most past projects, such as

1. Understanding of component state
2. Difficult code maintainability due to lack of standardization
3. Repeated code
4. Side effects
5. Amount of setup time for developers
6. Very specific components to each pages

alicarbonteq

Why next.js?

1. File-System Routing ‘pages/index.js’
2. Image optimization ‘next/image’
3. Fast Refresh
4. Static Assets ‘public/’
5. Built-in CSS support
6. API Routes ‘pages/api/user.js’
7. Code Splitting & Bundling
8. TypeScript Support

alicarbonteq

React Query

React Query is a server-state** library, responsible for managing asynchronous operations between your server and client

Redux, MobX are client-state libraries that can be used to store asynchronous data, albeit inefficiently when compared to a tool like React Query

With those points in mind, the short answer is that React Query replaces the boilerplate code and related wiring used to manage cache data in your client-state and replaces it with just a few lines of code.

With a few hook calls to useQuery and useMutation, we also get to remove any boilerplate code that use to manage our server state eg.

alicarbonteq

Fallacies of Distributed Systems

Understanding these misconceptions about distributed systems like microservices, SOA, and others will help you build better, more flexible software architecture.

Are you working on a distributed system? Microservices, Web APIs, SOA, web server, application server, database server, cache server, load balancer - if these describe components in your system's design, then the answer is yes. Distributed systems are comprised of many computers that coordinate to achieve a common goal.

More than 20 years ago Peter Deutsch and James Gosling defined the 8 fallacies of distributed computing. These are false assumptions that many developers make about distributed systems. These are usually proven wrong in the long run, leading to hard to fix bugs.

The 8 fallacies are:

alicarbonteq

Conflict Resolution (Vector Clock in Distributed System)

Definition

Vector Clocks are used in a distributed systems to determine whether pairs of events are causally related. Using Vector Clocks, timestamps are generated for each event in the system, and their causal relationship is determined by comparing those timestamps.

Vector clock is use to control the ordering of multi-version records.

• Use in key-value store like riak, Dynamo
• Enables causality to be captured
• With vector clocks, we assume we know about each participating process
• Suppose there are N processes in the group [1…N]