Open in app

Sign In

Write

Sign In

Akshay Jain
Akshay Jain

136 Followers

Home

About

5 days ago

Next JS Image Component Learning Points

Use import {Image} from ‘next/image’; These images are lazy loaded when they come in the viewport through scrolling Put images in the “images” folder beside .next folder An optimized image in webp or avif format is loaded on the webpage If fetching images using url, then we need to provide the height and width on the Image component, because NextJs does not know upfront the size of the image Another way to provide dimensions on Image component is using layout={“fill”} and objectFit={“contain” | “cover” | .. } this makes image component equal to size of parent

Nextjs

1 min read

Nextjs

1 min read


Sep 8, 2022

Use a Google Sheet as a single source of Truth for UI Data management rather than a Figma file.

The design of the component created in Figma has lots of details, text colour, background colour, and border colour, + these colour needs to be changed if we hover over the component, or if we keep the element in an active state. Here colour information is actually data, and thus…

Figma

3 min read

Use a Google Sheet as a single source of Truth for UI Data management rather than a Figma file.
Use a Google Sheet as a single source of Truth for UI Data management rather than a Figma file.
Figma

3 min read


Jun 2, 2022

Access React Child Component’s state in parent component

You have a parent component, in which you want to keep control of child component’s state, it is possible by replicating the child’s data in parent. By passing a ref from parent component to child component. For ref to work, child component should be wrapped in forwardRef. Main Part Whenever you update the child state, update that ref also at the same time. With this done. You have access to all the child states as it is also saved on the ref.

React

1 min read

Access React Child Component’s state in parent component
Access React Child Component’s state in parent component
React

1 min read


Jan 19, 2022

Replace Docker Desktop with Rancher Desktop and Docker daemon on Mac in 5 mins

Docker Desktop would no longer remain a free product for large organizations above a certain size. Larger techs with revenue greater than $10 million would be able to afford Docker Desktop’s $5 per user/month starter pricing. This post does in no way discourages organizations from paying and I believe that…

Docker

2 min read

Replace Docker Desktop with Rancher Desktop and Docker daemon on Mac in 5 mins
Replace Docker Desktop with Rancher Desktop and Docker daemon on Mac in 5 mins
Docker

2 min read


Aug 18, 2021

Use Snippets tab of Chrome browser inspector to run your code instead of

Use Snippets tab of Chrome browser inspector to run your code instead of console

Chrome

1 min read

Use Snippets tab of Chrome browser inspector to run your code instead of
Use Snippets tab of Chrome browser inspector to run your code instead of
Chrome

1 min read


Mar 21, 2021

Open Github repositories as VSCode Projects

While developing projects, we may need to take help from other projects hosted on github.com. General procedure involves cloning the repository, because it is not easy to navigate through the files on github.com. https://github.com/conwnet/github1s solves this simple issue of easing navigation through files in browser itself Checkout below repo link https://github1s.com/conwnet/github1s Instead of github.com it is github1s.com

1 min read

Open Github repositories as VSCode Projects
Open Github repositories as VSCode Projects

1 min read


Jan 5, 2021

Introducing Code review meetings as a new Sprint ceremony

Reviewing pull requests is very important in order to ensure that consistent practice is followed all throughout the code, thus all stakeholders should promote pull request review as an important task Considering a team of 6–7 developers will create 3–10 pull requests in a week it is important that we…

Code Review

3 min read

Make DAILY pull request review meetings part of sprint ceremony like DSM
Make DAILY pull request review meetings part of sprint ceremony like DSM
Code Review

3 min read


Nov 2, 2020

Managing color variables in front-end project

In every frontend code we use a lot of colours in scss. First bit of optimisation is to put all the colour variables in a separate file, so that we can get all the colours used in our project at one place Now second bit is about giving proper names…

Colors

3 min read

Managing color variables in front-end project
Managing color variables in front-end project
Colors

3 min read


Oct 22, 2020

Modifying dateString as per UTC-Offset to satisfactorily filter based on date

I work at Nium where we handle international money transfer, so we have pages where we show clients a list of transactions, and this is where I got a good case to make medium post! See the case — A user does a transaction in India at 2am 20-October, it…

Daterange

3 min read

Modifying dateString as per UTC-Offset to satisfactorily filter based on date
Modifying dateString as per UTC-Offset to satisfactorily filter based on date
Daterange

3 min read


Jul 13, 2020

Points to learn about returning from immer recipe function

Gist: -> Either return a new value *or* modify the draft A recipe function is used to update the value in immer library, here’s an example const recipe = draft => { draft.cool = true; } const newValue = produce(recipe, {cool: false}) console.log(newValue) // { cool: true } You mutate the draft to create a newValue, returning draft after modifying it…

Immer

2 min read

Immer

2 min read

Akshay Jain

Akshay Jain

136 Followers

I love learning

Following
  • Saurabh Mhatre

    Saurabh Mhatre

  • Bennett Garner

    Bennett Garner

  • Rajdeep singh

    Rajdeep singh

  • Fernando Doglio

    Fernando Doglio

  • Yasas Sri Wickramasinghe

    Yasas Sri Wickramasinghe

Help

Status

Writers

Blog

Careers

Privacy

Terms

About

Text to speech