Skip to main content

Posts

About Me

Hello Fellow Devs ,  I am a full stack web developer at Intermediate stage . While making projects and learning new topics I encounter various issues and unknown / less known topics on which very few articles or solutions are available but they are very important . To fix it I started this blog . In this I will be sharing stuff related to web development . You can help me by sharing articles you like and let me know an article , topic , problem / issue or question through comment section . Happy Learning !
Recent posts

Github Copilot New Pricing Explained 2025

Introduction Github introduced a new pricing model for Copilot , it will be in action from 4th June 2025 . It introduced a new plan Pro+ and added some limitations on other plans . Let's understand them all : OverView of Plans Let's first have a overview of all the plans github offers for copilot . For full comparison you can read this . Free Plan In free plan you can have access to almost all copilot features with limitations like only able to use base AI models like GPT 4.1 , o3-mini , gemini 2.0 , etc.. with 50 premium request per month , 2000 auto completions , etc. Pro Plan ( 10 USD ) It comes will all copilot features with access to some advance AI Models like : Claude 3.7 Sonnet , gemini 2.5 pro , openai o1 , etc. with 300 monthly premium requests and unlimited request on base model GPT 4.1 with other features . In this you can also purchase premium requests with 0.04$ / request . It is not enabled by default but you can enable it in your settings in github dashboard . ...

GitHub Copilot Chat Is Now Open Source – Everything you wanna know about it

Introduction As you have already heard , microsoft announced to open source it's most famous VsCode extension Github Copilot Chat . It will open a wide range of possibilities to developers . Developers will be able to now fork it , add new features and can now even create their personalised AI code editor . According to microsoft , it will help them to stay on their core development principles : open, collaborative, and community-driven . You can read official post here   What actually is Open Sourced ? Microsoft announced Github Copilot Chat extension to be open-source under MIT License , which include 3 modes Chat , Edit and Agent mode . It's not the full Github Copilot , features like : AutoComplete , Next Edit , etc. are still private . Also it's the VsCode UI frontend logic , you still needs to make changes to it if you want to use custom AI model with this .  Is Github Copilot Plans now dead ? This question is very common that if the copilot chat extention is open sou...

How to host website asset on aws s3 bucket with custom domain

Introduction There are many hosting providers which hosts website assets like images and videos at very reasonable cost but they all have some limit on their free plan whereas in aws s3 bucket we get 100 gb of free bandwidth forever and very cheap pay as you go prices . Today I will show you how to hosts your website assets on aws s3 bucket . Host on aws s3 bucket with default url  On your aws account dashboard ( create one if you don't have ) go to the s3 bucket and create a " general purpose " bucket with your desired name ( preferably your website domain like example.com ) , while creating the bucket uncheck "Block all public access" and then create the bucket with default settings . Now go to your bucket name > Permissions > Bucket Policy , click on edit and paste this :- note : replace the bucket name with your bucket name , like example.com in this case . It will allow you to access your object / Files on bucket with public url . That's it , ...

How to debug Nextjs in VSCode | 2025 latest

Introduction In NextJs , debugging is tricky . You can either do it in browser developer tools or inside VsCode . The official docs shows both ways but it is outdated for VsCode and doesn't help anymore . So after encountering the same problem and going through a bunch of articles and stackoverflow questions I finally found the correct configuration . So I am sharing the same with you all . The Steps are pretty straight forward , So let''s get into it : Step 1 Add the inspect option in package.json file . To allow server side debugging , we have to add this into our dev command , like this :- Step 2 Inside your VsCode project create a file inside .vscode dir ( if you don't have then create one in root folder of your project ) with name launch.json . Now simply add this same configuration in it and save it :- Step 3 After doing above steps we are ready to debug the app , stop your app terminal and go to the " debug and run" option in VsCode sidebar ( or use...

Resources to host your website assets for completely free

Introduction   Today I am gonna share some resources through which you can store all of your website assets at zero cost with unlimited bandwidth . Let's start : Cloudinary  Cloudinary offers a free plan which is suitable for mazority of the sites . Through this not only you can upload your assets but also you can customise them by just editing it's url on the go . You can optimise the assets and make use of cloudinary cdn at no extra cost . You can check out it here for more detail . Amazon S3 Bucket  If you are looking for a resource for larger assets and affordable cost then Amazon S3 bucket is a go . It offers Pay for what you use prices , majority of the time it will be free as aws offers 100gb of free bandwidth at 0 cost . AWS S3 let's you use your custom domain for transferring assets , you can simply do this by using your domain name as your bucket name and adding some records in your domain DNS . Click here for tutorial and more details .  Note : While usi...

Vibe Coding | The Clearification

Introduction In this post I will share what I thought about Vibe Coding and what are it's advantages , disadvantages . who should use it , how it should be used and many more similar questions . This will clarify many of the questions , generally comes in learners or non coders mind . So let's start  What is Vibe Coding ? If you already know then you can skip this part . In simple terms , Vibe coding is telling the ai what you want to build in simple language ( English ) , solve errors , add new features and everything else related to code . Vibe Coding for non devs ? Vibe coding is designed for developers , not for non developers . Many AI tools like Cursor AI let's you vibe code at very accuracy which let the non devs think that they can easily make anything with it , offcourse you can , but it comes with a price . When a non dev vibe code it totally depends on AI and AI create many bugs . In real world when you deploy an app created using AI there are highly chances that...

How to Make Tailwind Css OKLCH Colors Compatible with All Browsers in a Next.js App

Introduction From tailwind v4.0 there are many major changes introduced in it , one of which is using oklch as color format . Although these are very good colors with compatible in all major modern browsers but some are adapting to it and older browsers doesn't support it yet . when we deploy our webapp we have to make it compatible for majority of our users . In tailwind we don't have a fallback color mode yet which can be applied in browsers which don't support oklch color model . To overcome this issue we can use @csstools/postcss-oklab-function  .  What it does ? With this library , we can use it as PostCss plugin and when shifting our app in production it will add fallback colors for oklch , which will be applied to browsers who doesn't support oklch model yet . Like this :- How to use it ? It has a straight forward use . In this case I will show how to use it with NextJs webapp .  Step 1 : Installation  Install the lib with this command in your nextjs app :- ...