A large software product does not have to be complex. It can be a huge arrangement of simple independent units that communicate in a predetermined fashion.
We can quantify the complexity of an application by the…
Have a look at the Zillow registration page below. It may look a bit verbose and busy. It may seem like we can take away the password requirements. Should it be there even before the user types it?
Many sites won’t show the password requirements until the user finishes typing…
Let's create a robust boilerplate that helps us focus on application building.
Create a react application with the below command.
npx create-react-app my-app --template pwa-typescriptRename the project name from my-app as you need. Also, note we use pwa-typescript template which provides the setup for a progressive web app.
Delete…
We laid out our design system foundations using tailwind in the previous section. Now let's create the base components that serve us like atoms or base building blocks for our application.
Let's build them one by one. A couple of things before that.
We are going to place these components…
The foundation part of the design system comprises all basic styling necessities for a project.
We will go through them one by one and create them using tailwind css.
We can either extend or completely reset the colors. Let's reset the colors. The brand Color of epicgames.com is #007dfc …
Font size is often associated with hierarchy. But using a lot of font sizes will make our UI look amateur. In this article, we will see the factors that help us to bring hierarchy to any design with simple steps.
Disclaimer: This article is best viewed in desktop mode. If…
Let's create everything under the UI for our epic clone project.
Once we get our infrastructure under our UI right, plugging UI components will become a breeze.
Clone the start branch to follow. Clone the final branch to follow the concepts skimming through the code quickly.
// Repository
github.com/karthickthankyou/epic-clone//…
In object-oriented and functional programming, an immutable object is an object whose state cannot be modified after it is created. This is in contrast to a mutable object, which can be modified after it is created. — Wikipedia
Imagine you are working in a warehouse.
Let’s look at two cases.
…
Create the next immutable state tree by simply modifying the current tree — Immer.
Software is all about reducing the pain points of people. We can see the effects of software making lives easier than they used to be all around us.
But what about software developers’ pain points?
Now…
‘My mother language is for my heart. English is for my stomach.’
— An English trainer from my college.
What percentage of people in the world know only their mother tongue and nothing else?
In many grown countries like Japan, Switzerland, Italy, etc the necessity to learn another language for…
