TILs - Fueling Curiosity, One Insight at a Time

At Codemancers, we believe every day is an opportunity to grow. This section is where our team shares bite-sized discoveries, technical breakthroughs and fascinating nuggets of wisdom we've stumbled upon in our work.

Published
Author
user-image
Syed Sibtain
System Analyst
We handle navigation in Gatsby using the Link Component. So if we put both external and internal links in the Link element, we receive the following warning in the console:
External Link was detected in a link component. Use the link component only for internal links.

This is because the Link component is designed to interact with Gatsby's client-side navigation, which is better for single-page apps and uses the window.history API to update the URL without reloading the entire page.

So in case of external links, we should prefer a simple a tag and pass the href attribute.

Also gatsby prefetches the linked pages by starting a low priority request over a link, when we take the mouse on it onMouseOver, it makes the request high priority.
Published
Author
user-image
Ayush Srivastava
System Analyst
Difference between DOM element properties clientWidth clientHeight , offsetWidth offsetHeight , scrollWidth scrollHeight

• clientWidth /clientHeight is the visual portion of box content, borders and scrollbars not included, but padding is included
• offsetWidth/offsetHeight is the size of visual box including borders. Can be calculated by adding width/height and padding and borders.
• scrollWidth/scrollHeight is the size of the box content, including the parts that are hidden outside the scrolling area
Published
Author
user-image
Ayush Srivastava
System Analyst
Linked Lists

Linked list are a linear data structure like arrays. But unlike arrays they are not stored in a single place in memory. They are made up of connected nodes, where each node consists of data and address of the next node.

Why do we need Linked List?

• Arrays can store the similar data but they have an upper limit, we need to speculate the size of array in advance, and the allocated memory is generally equal to the speculated size of the array
• Inserting and deleting data in between of Array is tedious, but in case of Linked List if we have the head node we can traverse to any node through it and insert new node
Published
Author
user-image
Keshav Chakravarthy
Set log level carefully, because depending on the level some logs may never be passed to the backend and will be unavailable for future debugging.
Published
Author
user-image
Vaibhav Yadav
Senior System Analyst
We can use git shortlog instead of git log to group commits by author using --group=author option.
Published
Author
user-image
Keshav Chakravarthy
we can pin specific docker image to use by tagging the commit SHA

Code

build:
  stage: build
  image: docker@sha256:the_sha
  services:
    - docker:dind@sha256:the_sha

Published
Author
user-image
Keshav Chakravarthy
To get help on gitlab CI the forum link is forum.gitlab.com
Published
Author
user-image
Syed Sibtain
System Analyst
Aliases in Graphql.
Let’s say we have a query that return us the cars Data. If we add both the queries, we will get an error.
Fields "cars" conflict because they have differing arguments. Use different aliases on the fields to fetch both if this was intentional.
UseCase Example:
👇This will throw error

Code

{  
  cars(filter: "name = Cars") {
    edges {
      node {
        name
        speed        
      }
    }
  }
  cars {
    edges{
      node{
        name
      }
    }
  }
}


👇This will work

Code

{  
  slowCars: cars(filter: "Cars") {
    edges {
      node {
        name        
      }
    }
  }
  fastCars: cars {
    edges{
      node{
        name
      }
    }
  }
}


It works because we are using aliases here. Aliases let us change the names of the data that is displayed in a query’s results. It is incredibly helpful when we need to fetch the same data using different filters.

Extra Resources: https://blog.logrocket.com/using-aliases-graphql/#:~:text=What%20are%20GraphQL%20aliases%3F,it%20according%20to%20your%20specifications.

Showing 48 to 50 of 82 results

Ready to Build Something Amazing?

Codemancers can bring your vision to life and help you achieve your goals

Let's Talk