Tech Tales

Understanding the Rails Asset Pipeline

A comprehensive guide to understanding the Rails Asset Pipeline, its features, and its role in modern web development.

Next.js 15: Optimizing Cache for Better Performance

Explore the caching strategy updates introduced in Next.js 15

Row level security in Postgres

Explore how to implement Row Level Security (RLS) in Postgres

Keycloak Single Sign-On Integration with Rails using omniauth-keycloak gem

This guide walks you through setting up Keycloak locally using Docker, creating a realm, user, client and integrating Keycloak with a Rails application using the omniauth-keycloak gem for single sign-on (SSO).

Mock External Services in Rails with WebMock and Rack

Discover how to mock external services in Rails application using WebMock and Rack to simplify testing

Implementing Retrieval-Augmented Generation with LangChain, Pgvector and OpenAI

Learn how to implement Retrieval-Augmented Generation (RAG) using LangChain, Pgvector, and OpenAI to store document embeddings and generate context-aware responses

Understanding Retrieval-Augmented Generation (RAG) with OpenAI

Explore how to enhance language models using Retrieval-Augmented Generation (RAG) with OpenAI's API.

Managing Server State in React Application using React-Query

Explore how TanStack React Query simplifies server state management in React applications, covering topics such as caching, deduplication and state syncronization.

Organizing ActiveRecord Models into a Tree Structure with the Ancestry Gem in Rails

This blog explains how to organize ActiveRecord models into a tree structure using the Ancestry gem in Rails to manage parent-child hierarchical structures. It covers the setup, features, and querying methods that make managing hierarchical data both simple and efficient.

Passwordless Authentication Flow in Cognito User Pool

Learn the steps and implementation of a passwordless authentication flow using AWS Cognito and custom Lambda functions.

Understanding Database Connections in Rails: Behind the Scene

A comprehensive guide to database connections in Rails. Learn about configuring credentials, establishing TCP connections, setting session parameters, managing authentication, and optimizing performance with connection pooling. Understand how to ensure efficient communication between your Rails application and the database.

How to Convert a React App to Native Mobile Apps Using Capacitor.js

A detailed guide on converting a React app to native Android and iOS apps using Capacitor.js.

Unleash the Power of Hotwire(Part 1): Supercharge Your Rails Apps with enhanced user experience

A detailed guide to Hotwire in Rails exploring turbo-drive, turbo-frames and turbo-streams. Learn how to build blazing-fast applications with real-time updates without full page reloads.

Rails Autoloading - Classic and Zeitwerk

Discover the evolution from Rails Classic autoloader to the dynamic Zeitwerk.

How to setup vitest in Next.js 14

A detailed guide on setting up Vitest in Next.js 14.

NextJS Integration with Contentful

A detailed guide on integrating NextJS with Contentful, utilizing i18n for internationalization and Contentful's Content Delivery API for content management.

Next js 14 intercepting routes

Introduction to nextjs 14 intercepting routes

Setting Up Google Sign-In in a Next.js App: A Step-by-Step Guide

Elevate your Next.js app's security and user experience with seamless Google Sign-In integration in this step-by-step guide.

Running GitHub Actions Locally with act - A Comprehensive Guide

Exploring way to run Github actions locally with act.

Exploring Auth0 Custom Actions

A look at how to create, manage, and utilize custom actions in various workflows, including login/post-login, machine-to-machine, password reset, pre and post-user registration, and sending phone messages.

How to implement react hook form with headlessui

Implement react hook form with headlessui

Data Fetching Strategies in Next.js and Their Impact on Page Rendering and Performance

Explore Next.js data fetching strategies for efficient page rendering and performance. From pre-rendering, server-side rendering, to static-site generation to incorporating time-based and on-demand revalidation for real-time updates.

Streamlining Development: Setting Up Preview Environment in fly.io with Pull Requests

Learn how to optimize your development workflow by automatically setting up preview environments in fly.io whenever a pull request is opened. This blog post provides step-by-step guidance on configuring a preview app and a preview db in fly.io.

Using AWS S3 with Rails ActiveStorage for File Uploads

Guide to Setting Up AWS S3 Bucket for Rails Active Storage File Uploads

Server Actions in Next.js 14: Forms with Server Actions

Dive into Server Actions in Next.js 14. This post covers everything from syntax and setup to dynamic content updates, learn about form submission handling, network requests, and strategies for seamless user experiences.

An Introduction to Caching

Concepts and techniques of caching, a vital strategy for enhancing the performance of software systems.

npm vs Yarn vs pnpm: A Comprehensive Comparison Guide

Compare npm, Yarn, and pnpm effortlessly for smarter package management decisions

Exploring the GlideApps Data Grid React Package: A Comprehensive Guide to Efficient Data Management

Experience unparalleled performance, rich rendering, and full TypeScript support with the GlideApps Data Grid React package.

Asynchronous programming in Dart - Streams (Part II)

Explore Streams in Dart, their types, creation techniques, and best practices for seamless asynchronous event handling.

Asynchronous programming in Dart (Part I)

Explore the essentials of asynchronous programming in Dart, from Isolates to Async/Await, and unravel the secrets of efficient, non-blocking code execution.

Unlocking Global Reach: A Comprehensive Guide to Internationalization (i18n)

Explore a comprehensive guide to Internationalization (i18n) in web development, including its significance, implementation in React and Gatsby, advantages, performance considerations, and optimization

A Guide to Efficient Website Management: Understanding Content Management Systems (CMS)

Discover the potential of CMS for managing websites; its user-friendly, economical, and SEO-friendly.

Understanding How Strapi Works: A Comprehensive Guide

Unlock the potential of Strapi, the innovative headless CMS, with this guide. Explore its unique features, setup, content management, and API creation.

Understanding basic CSS Units for web design and bridging the gap between Designer and Developers.

A comprehensive guide for understanding the basic concepts of px, em, and rem units. Also learn about Tailwind config and how to use Figma's developer mode to close the gap between designers and developers.

Command the Command Line: Essential Terminal Commands Every Developer Should Know

Understand the Terminal, and its importance. Explore basics like opening tabs, listing files, navigating, and running commands. Master file operations, file viewing, searching, and much more.

Next MDX vs Next Contentlayer

A comparative overview of Next MDX and Next Contentlayer

How do we automate OTP using gmail tester in cypress & playwright e2e test

Automate OTP verification using the gmail-tester library in combination with Cypress and Playwright E2E tests

How Does Gatsby Work ?

A high level overview of how gatsby works.

Typescript 5

New features and improvements for typescript 5.x

Percentiles in Performance Testing

Understanding percentiles w.r.t performance

Chrome Profiler, A Complete Guide

Optimizing Web Performance Through Profiling and Analysis'

Testing Simplified: Playwright or Cypress - The Definitive Comparison

Simplify your testing journey by comparing the strengths and weaknesses of Playwright and Cypress, and discover the testing tool that perfectly aligns with your needs.

Streamlining User Access To OpenVPN A Step-by-Step Guide To Setting Up SSO For Your OpenVPN Server with Keycloak

Using a PAM module and Keycloak for authenticating connections to OpenVPN

XSS attacks

Exploring XSS Attacks and Expanding Security Knowledge through meetup

How to Test Received Emails with Cypress, Ethereal, and ImapFlow

Master email testing using Cypress, Ethereal, and ImapFlow to ensure accurate and reliable communication in our web applications.

What is the Difference between Server Side Rendering and Client Side Rendering

Understanding the key differences between rendering methods for Single Page Applications

A Beginners Guide to A/B Testing

Test, compare, and optimize: maximizing outcomes with AB testing strategies.

How Asynchronous JavaScript Works

Understanding how JavaScript works behind the scenes and handles asynchronous functions

Developing a design system, a design developer collabration

Building and scaling a design system with Figma, React and Storybook

The Way of the Frontend Debugging

An attempt to put together some debugging experiences, techniques and tools for frontend

Exploring the power of Redux-Saga by implementing cancellable polling.

An amazing alternative solution to websockets

Overcoming the challenges associated with Parallax Scrolling

Understanding and examining the pros and cons of the parallax scrolling strategies that can be used

Secret Injection for Github Actions using AWS Secret Manager

Fetch secrets from AWS secrets manager and inject them securely into your Github actions

Eagle Vision with Prometheus & Grafana

A unified approach towards monitoring health of your infra and applications

Integrate Sentry With Strapi

Ways of integrating Sentry with Strapi

Authenticated Requests to Strapi

Making requests to Strapi endpoints as an authenticated user

Tagged Templates

Understanding and exploring the applications built with tagged templates

Netlify Deployment Previews for Self-hosted GitLab on Private Network

Deploying to Netlify from a private, self-hosted GitLab instance

Strapi Local Plugin Development

Local plugin development in strapi

How to Release Artifacts Using Gitlab CICD

A guide on how to publish your generated artifacts using Gitlab CI/CD pipeline.

Test cases using Jest and React Testing Library

Setup and write test cases in react using Jest and React testing library

Batching in React

Difference in batch updates before and after React18

Understanding how Redis eviction policies work

Redis can be used as an LRU cache with right kind of eviction policy. We can have some fun figuring out how this actually works

Guide to set up Gitlab CI for Rails tests

Learn to run rails test on Gitlab CI pipeline

Working around rate limiting external apis with Elixir

Fetch movie rating from several API without hitting rate limits on failure retries

Using Index of an array as KEY Can Lead to Bad Consequences

Ways of implementing keys and cases in which index can be used as key and vice-versa

Real world usecase for GenServer and Agent in Elixir

Understand Agents in Elixir with a real world use case of refreshing OAuth2 access token

What I Learned while working on an Elixir App

Learn tips about working on an Elixir App

Poor Man's High Availability Vault Server With Auto Unseal Using KMS

Achieve high availability for vault server with auto unseal using KMS

Nuances of Elixir Releases for Phoenix Applications

Understand some of the scenarios of deploying a Phoenix application using Elixir Releases

Diving into the internals of Gem packaging

A real world use case with Elixir Recursion

Learn to solve a business use case with Elixir Recursion

A Full Stack Guide to Graphql: React Client

Build a React app with graphql.

Auto Deploy to Heroku Using Gitlab CI

Auto Deploy to Heroku Using Gitlab CI

SSH Access Management - Control SSH Access With Vault OTP Engine (PART 2)

SSH Access Management - Control SSH Access With Vault OTP Engine (PART 1)

Encrypting and storing Kubernetes secrets in Git

Learn how to encrypt & store Kubernetes secrets in Git

A Full Stack Guide to Graphql: Elixir Phoenix Server

Build a full-blown GraphQL service which will let you query, change and create records in the database using elixir's web framework: Phoenix

The Full-Stack guide to GraphQL: NodeJs Server

Build a full-blown GraphQL service which will let you query, change and create records in the database

Extract data from a QR code in Elixir

Learn to extract data from a QR code in Elixir

A quick introduction to parallelism in JavaScript

Use web workers to spawn computationally expensive background tasks without interrupting the user interface workflows

Overlap an image over a QR code using Mogrify

Learn to overlap an image over QR code using Mogrify in Elixir

Decluttering Translations in Rails Apps

Approaches for clean rails translation files as application grows

Sorbet - A static type checker for Ruby

Adopting and incorporating a gradual type system for Ruby

Switching an existing Phoenix app from Brunch to Webpack

Learn to switch an existing Phoenix app from Brunch to Webpack

Ruby 2.5 adds KeyError#receiver and KeyError#key

Learn about KeyError#receiver which returns receiver associated with the KeyError object & KeyError#key returns the key which caused the exception

Ruby 2.6 added options to Exception#full_message

Learn about options which Expection#full_message accepts

Using Pundit for authorization in Rails - recipes and best practices

Make better authorization for your application.

Frozen middleware with Rack freeze

Learn about freezing middleware with rack-freeze

Interceptor : Your Own Mock Server inside the browser

Introducing Interceptor - A browser extension that mocks backend responses and how to use it.

RubySpec for Tracepoint

Learn more about ruby by contributing to RubySpec

Elixir Remote Debugging

Learn how to connect to a production Elixir node from the local shell and use the debugger GUI to set breakpoints and debug.

ReactJS : Server side rendering with router v4 & redux

Autodeploy from github using AWS CodeDeploy

Elixir/Phoenix deployments using Distillery

Deploy Elixir/Phoenix apps using Distillery plugin

React.js : Server side rendering

APIs supporting snake_case and camelCase with Rails

Supporting API conventions for client like reactjs can be quite tricky. This post talks about approach to make APIs accessible using snakecase or camelCase.

Continuous Deployment using Docker Cloud

Working with Rails, Webpack and Heroku

Deploying a Rails app with Webpack asset management on Heroku can be tricky. However, Heroku provides lifecycle hooks on its NodeJs buildpack that will help make this easier.

Understanding Exit Signals in Erlang/Elixir

Erlang is a powerful concurrent programming language that has Processes as a first class citizen. These are isolated by default. Just like in Unix, these processes can communicate using Signals. In this post we will see how to achieve that in Elixir.

Visualizing Parallel Requests in Elixir

Elixir, built on the battle-tested Erlang VM, is a language that has concurrency as its core ideas. I will introduce a monitoring utility shipped with the VM that helps us visualize HTTP requests.

New in ActiveRecord: #in_batches

Rails 5 has a new feature added to ActiveRecord that makes working with batch data much more efficient. The `Model.in_batches` function passes a batch of records wrapped inside an ActiveRecord collection.

Say goodbye to vendor prefixes with Autoprefixer

Autoprefixer is a tool that adds vendor prefixes to CSS based on the usage patterns and current state of support. This results in clean code and smaller CSS files.

DIY Ruby CPU profiling - Part IV

Ruby's TracePoint API is very powerful for building custom profilers. As the final post of the DIY CPU profiler series, this post will introduce how to get method runtime statistics and generate relevant graphs.

DIY Ruby CPU profiling - Part III

Ruby's TracePoint API is very powerful for building custom profilers. In this post I will talk about hooking into Ruby code execution life cycle using this API

DIY Ruby CPU profiling - Part II

Ruby's TracePoint API is very powerful for building custom profilers. In this post I will talk about Wall time and CPU time, and how to measure them for Ruby programs.

DIY Ruby CPU profiling - Part I

Ruby's TracePoint API is very powerful and allows us to write custom profiling code without slowing down the execution of programs. In this post, I will introduce CPU profiling and 2 strategies to write one.

Cake walk: Using bower with rails

Traditionally, Rails 3.x and above come with Sprockets and asset management functions. However, using a JavaScript or CSS library with Sprockets means we'd have to roll them into gems with a specific directory heirarchy. Instead, we can leverage Bower to handle that for us.

What you need to know about software process and tools as a non-tech product owner - Part 2

Using Git for Knowledge sharing

An Introduction to JSON Schema

JSON schema can help bring order to handling complex JSON interactions in APIs. For instance, you can avoid checking the types of incoming JSON and rely on JSON schema to do the validation. This post talks about similar usecases.

What you need to know about software process and tools as a non-tech product owner - Part 1

Form object validations in Rails 4

Interacting with complex web forms tends to become hairy pretty quickly. Using Form or Service objects to abstract out the complexity can help wrangle complexity. This post talks about how we use them to make code simpler.

Design and Development Process

Making an Indian agency work for your startup

Random Ruby tips from trenches #1

CSS3 Box Model behaviour

CSS Box Model is one of the fundamental concepts layout inside a browser. In this post you'll learn about the box-sizing property.

Rendering images for Retina or any high DPI screens.

There is a proliferation of high resolution screens on mobile devices, and non-optimized images tend to look ugly on them. This post introduces ways to use optimized images for use in HTML on high DPI screens.

Setting up Emacs as Ruby development environment on OSX

How rails reloads your source code in development mode?

In this post, I will talk about how Rails 3.x reloads code in the development environment.

Isolate Namespace in Rails Engines - A hack in itself

Setting up Source Maps for CoffeeScript in Rails

Redefine rake routes to add your own custom tag in Rails

Non native fullscreen for OSX on emacs 24.3

Introducing Invoker - Manage processes in development envionment

Invoker is a utility we wrote to ease setting up of local development environments and top level .dev domains. Read on to know how to use it.

All you need to know about writing a mountable Rails Gem with rspec

Profile Ruby 2.0 apps using DTrace - part 2

Ruby 2.0 and above has in-built support for DTrace hooks. This lets us profile Ruby programs. In this post, I'll go into the details of the features of DTrace.

Vim tab completion for RubyMotion

Rails Autoload Path

Profile Ruby 2.0 apps using DTrace - Part 1

Ruby 2.0 and above has in-built support for DTrace hooks. This lets us profile Ruby programs. In this post, I'll introduce DTrace and how to add DTrace probes to a Ruby program.

Using Backbone JS in multipage application

This post talks about using the Backbone library with a Rails backend, and goes through some challenges and gotchas encountered during the process.

Zoom pane in tmux

Poor man's rspec mode for emacs

Bundler: Cleanup old unused gems

Git checkout previous branch

Remove branches merged into master

Upgrading to Mountain Lion and your development environment

A nearly step-by-step guide to upgrade to Mountain Lion, and setting up a Ruby development environment

The kitchen sink libraries

The problem with kitchen sink libraries is feature creep. Sometimes all we need are small libraries that are easily readable.