Forem: Subham Kumar

26. Remove Duplicates from Sorted Array

Subham Kumar — Thu, 27 Nov 2025 17:03:07 +0000

Given an integer array nums sorted in non-decreasing order, remove the duplicates in-place such that each unique element appears only once. The relative order of the elements should be kept the same.

Consider the number of unique elements in nums to be k. After removing duplicates, return the number of unique elements k.

The first k elements of nums should contain the unique numbers in sorted order. The remaining elements beyond index k - 1 can be ignored.

Input: nums = [1,1,2]
Output: 2, nums = [1,2,_]
Explanation: Your function should return k = 2, with the first two elements of nums being 1 and 2 respectively.
It does not matter what you leave beyond the returned k (hence they are underscores).

Solution

So the array is sorted, means numbers are in increasing order but duplicates can be there like [0,0,1,1,2,2].

The question says remove duplicates in place, which basically means we don’t create new array.
We just take the same array and push all unique values to the front.

My way to think is very simple:

Take two variables
x stays at the place where the last unique element is
i runs the whole array
whenever I find a value bigger than nums[x], that means it’s a new unique value
so I increase x and put that value at nums[x]

That’s it.

Code:

var removeDuplicates = function(nums) {
    let x = 0
    for(let i = 0 ; i < nums.length; i++){
        if(nums[x] < nums[i]){
            x = x + 1
            nums[x] = nums[i]
        }
    }
    return x + 1
}

Now why x + 1?

Because x is index.
Index starts from 0.
But the answer they want is count of unique values.
So if last unique element is at index 2, then total unique are 3 → that’s why x + 1.

This is literally the whole logic. Simple two-pointer trick. If you want I can also explain the dry-run in the same simple tone.

Similar to this question there is one more question can solve to get better at it.

leetCode Question no 27.

Given an integer array nums and an integer val, remove all occurrences of val in nums in-place. The order of the elements may be changed. Then return the number of elements in nums which are not equal to val.

Consider the number of elements in nums which are not equal to val be k, to get accepted, you need to do the following things:

Change the array nums such that the first k elements of nums contain the elements which are not equal to val. The remaining elements of nums are not important as well as the size of nums.
Return k.

Input: nums = [3,2,2,3], val = 3
Output: 2, nums = [2,2,,]
Explanation: Your function should return k = 2, with the first two elements of nums being 2.
It does not matter what you leave beyond the returned k (hence they are underscores).

How to Update a React Native App Without Play Store (Using Google Drive + JSON)

Subham Kumar — Fri, 21 Nov 2025 03:12:38 +0000

Publishing an Android app on the Play Store takes time.
But what if you want to share your app immediately with your users and still push updates easily?

Good news:
You can build your own mini update system without any server — just using:

Google Drive
One JSON file
One APK file
A few lines of React Native code

In this article i will explains the whole process step-by-step in a clean, simple way.

Why Do We Need This?

When you distribute your app as an APK (e.g., via Google Drive, WhatsApp, Telegram), users will install it once.

But what happens when you release a new version?

They don’t automatically know.

So we create a small, smart system where:

You upload a new APK to Google Drive
You update a JSON file on Google Drive
Your app checks the JSON every time it opens
If a new version is available → show update popup
User downloads & installs the latest APK

This feels like a real update system — but without servers or Play Store.

How the System Works

Think of your app as a student.
Think of your JSON file as the teacher.

Every time the app opens, it asks:

Teacher, what’s the latest version?
The JSON replies:

{
  "latestVersion": "1.0.5",
  "downloadUrl": "YOUR_APK_LINK"
}

Your app compares:

Installed version (e.g., 1.0.0)
Latest version from JSON (e.g., 1.0.5)
If JSON version is higher → app shows an Update alert.

That’s it!

Step 1 — Create a JSON File on Google Drive

Make a file: update.json

{
  "latestVersion": "1.0.5",
  "changelog": "• Faster performance\n• Bug fixes\n• Small UI changes",
  "downloadUrl": "https://drive.google.com/uc?export=download&id=APK_FILE_ID",
  "forceUpdate": false
}

Upload to Google Drive → Right-click → Share →
Anyone with link → Viewer

Now convert the Drive URL:
Example Drive link:
https://drive.google.com/file/d/1abcXYZ/view?usp=sharing
Direct JSON link:
https://drive.google.com/uc?export=download&id=1abcXYZ

Save this — your app will fetch this URL.

Step 2 — Update Version in Your React Native App

Go to:
android/app/build.gradle
Update:

versionCode 2
versionName "1.0.1"

Always increase versionCode before building a new APK.

Step 3 — React Native Code to Check for Updates

Use this code in App.js or your root screen:

import { Alert, Linking } from "react-native";
import DeviceInfo from "react-native-device-info";
import { useEffect } from "react";

const CHECK_URL = "https://drive.google.com/uc?export=download&id=YOUR_JSON_ID";

export default function App() {

  useEffect(() => {
    checkForUpdate();
  }, []);

  async function checkForUpdate() {
    try {
      const response = await fetch(CHECK_URL);
      const data = await response.json();

      const current = DeviceInfo.getVersion();
      const latest = data.latestVersion;

      if (isUpdateNeeded(current, latest)) {
        Alert.alert(
          "Update Available",
          data.changelog,
          [
            { text: "Update", onPress: () => Linking.openURL(data.downloadUrl) },
            { text: "Later", style: "cancel" }
          ]
        );
      }
    } catch (err) {
      console.log("Failed to check update:", err);
    }
  }

  function isUpdateNeeded(current, latest) {
    const c = current.split('.').map(Number);
    const l = latest.split('.').map(Number);

    for (let i = 0; i < 3; i++) {
      if ((l[i] || 0) > (c[i] || 0)) return true;
      if ((l[i] || 0) < (c[i] || 0)) return false;
    }
    return false;
  }

  return (
    // Your app UI
  );
}

Step 4 — What Happens When New APK Is Released?

Whenever you upload a new APK:

Upload new APK to Google Drive
Get direct APK link:

https://drive.google.com/uc?export=download&id=APK_ID
**
Update JSON:
**

{
  "latestVersion": "1.0.6",
  "downloadUrl": "NEW_APK_LINK",
  "changelog": "New features added"
}

Once JSON is updated → All users get update popup next time they open the app.

How to Update JSON on Google Drive (Correct Method)

There are two correct ways, and you should pick only ONE:

*METHOD 1: Replace the JSON File (BEST & EASIEST)
*
If you replace the file using Google Drive’s “Manage versions”, then:

The public link stays the same

Your app will always get the newest JSON file

You don’t need to recreate the link ever again

Steps

Go to Google Drive
Right-click your JSON file
Manage versions
Click Upload New Version

Upload the updated JSON file

Done (The link remains same → app fetches updated JSON automatically)

*METHOD 2: Upload New JSON & Update the FILE_ID
*

If you upload a brand-new JSON file instead of replacing:

Google Drive creates a new File ID (ID changes)
Your app will continue reading the OLD JSON
You must update FILE_ID in the app

BTW I never used 2nd method.

Complete Guide: Setting up React Native CLI for Android on macOS (2026 Edition)

Subham Kumar — Thu, 30 Oct 2025 03:38:06 +0000

If you’re on macOS and want to develop React Native apps using the CLI (not Expo), this guide walks you through everything — from installing Java to running your first Android emulator and building an APK.

`🧩 Prerequisites

You’ll need:

macOS (Intel or Apple Silicon)

Node.js & npm installed

Terminal (zsh or bash)`

⚙️ Step 1 — Install Watchman

Watchman is a file watcher used by React Native to track code changes.

brew install watchman

Verify installation:

watchman --version

Step 2 — Install OpenJDK 17 (via Zulu)

brew install --cask zulu@17

React Native requires Java for Android builds.
The Zulu distribution is stable and widely recommended.

Verify:

 java -version

You should see:
openjdk version "17.0.17" 2025-10-21 LTS OpenJDK Runtime Environment Zulu17.62+17-CA

Step 3 — Install React Native CLI

npm install -g react-native-cli

react-native --version

Step 4 — Install Android Studio (Recommended)

Although you can install SDKs manually, using Android Studio is the easiest and most reliable way.

Option 1 (Recommended UI method)
Download from
👉 https://developer.android.com/studio

Choose the macOS (Apple Silicon or Intel) version.
Open .dmg → drag Android Studio to Applications.
Launch it → follow the Standard installation wizard.
It will install:
- Android SDK
- Platform Tools (adb)
- Emulator
- Build Tools

Accept all SDK licenses when prompted.

Option 2: Install Android Studio via Homebrew Cask (semi-automated)

You can install the Android Studio app itself using Homebrew, but you’ll still need to open it once to complete SDK & emulator setup.

Steps:

brew install --cask android-studio

Then open it once:

open -a "Android Studio"

Inside the Android Studio UI:

Choose Standard Installation

Accept all SDK licenses

Wait for SDK, Platform Tools, and Emulator to install

After that, you can manage SDKs & virtual devices (AVDs) from command line later

Step 5 — Confirm SDK Location

Open Android Studio →
Preferences → Appearance & Behavior → System Settings → Android SDK

You’ll see something like:
/Users/<your-username>/Library/Android/sdk
That’s your $ANDROID_HOME.

🌿 Step 6 — Add Environment Variables

Open Terminal and run:

echo 'export ANDROID_HOME=$HOME/Library/Android/sdk' >> ~/.zshrc
echo 'export PATH=$PATH:$ANDROID_HOME/emulator' >> ~/.zshrc
echo 'export PATH=$PATH:$ANDROID_HOME/platform-tools' >> ~/.zshrc
echo 'export PATH=$PATH:$ANDROID_HOME/cmdline-tools/latest/bin' >> ~/.zshrc
source ~/.zshrc

Verify:

echo $ANDROID_HOME
adb --version
sdkmanager --list | head

Step 7 — Create an Android Emulator

Open Android Studio → Tools → Device Manager → Create Device
Then:

Select a Pixel device (e.g. Pixel 7)

Choose a system image (Android 13 or 14 recommended)

Download → Next → Finish

Click ▶️ (Play) to launch the emulator

Once it boots up, verify via terminal:
adb devices
✅ You should see:
emulator-5554 device
Step 8 — Run Your React Native App
Inside your project folder:

cd your-project
npx react-native run-android

This will:

Build the app using Gradle

Install it on your running emulator

Launch it automatically 🎉

To generate an APK file:
cd android ./gradlew assembleDebug

You’ll find your APK here:
android/app/build/outputs/apk/debug/app-debug.apk

You can install it on any Android phone:
adb install app-debug.apk

A Curated Guide to Frontend System Design: Essential Concepts and Topics

Subham Kumar — Sun, 07 Jul 2024 10:50:56 +0000

In today's tech landscape, mastering system design is crucial for cracking coding interviews and advancing your career. This guide covers key areas and concepts essential for frontend system design.

But thinking of what to study in system design is very confusing there are lots of thing that comes inside it.

so i google it and created a list.

Mastering Frontend System Design: A Comprehensive Guide

In today's tech landscape, mastering system design is crucial for cracking coding interviews and advancing your career. This guide covers key areas and concepts essential for frontend system design.

Key Areas in System Design

Networking
- How the Web Works: Understand the fundamentals of how data travels across the web.
- Communication Protocols: Learn about HTTP, HTTPS, and other protocols that enable web communication.
- REST APIs: Explore REST principles for building scalable web services.
- GraphQL: Discover how GraphQL allows for more efficient and flexible data queries.
- gRPC: Investigate gRPC for high-performance remote procedure calls.
Communication
- Short Polling: Poll the server at regular intervals for updates.
- Long Polling: Maintain a connection until the server has new information.
- Web Sockets: Enable real-time, bidirectional communication between client and server.
- Server-Side Events: Push updates from the server to the client over a single connection.
- Web Hooks: Set up HTTP callbacks to notify external systems of events.
Security
- XSS (Cross-Site Scripting): Protect against malicious scripts injected into web pages.
- iFrame Protection: Prevent clickjacking and other iFrame-based attacks.
- Security Headers: Use HTTP headers to enhance security measures.
- Client-Side Security: Safeguard data and interactions on the client side.
- Secure Communication (HTTPS): Encrypt data in transit to protect against interception.
- Dependency Security: Manage and secure third-party dependencies.
- Compliance and Regulations: Adhere to legal and industry standards.
- Input Validation and Sanitization: Ensure input data is clean and safe.
- SSRF (Server-Side Request Forgery): Mitigate attacks where the server makes unintended requests.
- Feature Policy: Control which web features can be used in your application.
- Server-Side JavaScript Injection: Prevent unauthorized code execution on the server.
- SRI (Subresource Integrity): Verify the integrity of resources loaded externally.
- CORS (Cross-Origin Resource Sharing): Manage cross-origin requests securely.
- CSRF (Cross-Site Request Forgery): Protect against unauthorized actions on behalf of a user.
Testing
- Unit and Integration Testing: Test individual units and their integration.
- E2E and Automation Testing: Perform end-to-end tests to simulate real user interactions.
- A/B Testing: Compare two versions of a webpage to determine which performs better.
- Performance Testing: Measure the responsiveness and stability of your application.
- Test-Driven Development: Write tests before coding to ensure functionality.
- Security Testing: Assess the security of your application against vulnerabilities.
Performance
- Performance Overview: Understand the key aspects of web performance.
- Performance Importance: Learn why performance matters for user experience.
- Performance Monitoring: Continuously track performance metrics.
- Performance Tools: Use tools to diagnose and fix performance issues.
- Rendering Patterns: Optimize how content is rendered on the screen.
Database & Caching
- Local Storage: Store data locally within the user's browser.
- Session Storage: Keep data available for the duration of the page session.
- Cookie Storage: Use cookies to store small amounts of data persistently.
- IndexedDB: Utilize a low-level API for large-scale storage in the browser.
- Normalization: Structure your database to reduce redundancy.
- HTTP Caching: Cache HTTP responses to improve load times.
- Service Worker Caching: Use service workers for offline capabilities.
- API Caching: Cache API responses to reduce load on servers.
- State Management: Manage the state of your application efficiently.
Logging and Monitoring
- Telemetry: Collect and analyze data about application usage and performance.
- Alerting: Set up alerts for critical issues and performance degradation.
- Fixing Issues: Identify and resolve issues based on logs and monitoring data.
Accessibility
- Keyboard Accessibility: Ensure all functionality is accessible via keyboard.
- Screen Reader: Support screen readers for visually impaired users.
- Focus Management: Manage focus order for a seamless user experience.
- Color Contrast: Maintain sufficient contrast for readability.
- Accessibility Tools: Use tools to identify and fix accessibility issues.
- Fixing Accessibility Issues: Implement fixes to improve accessibility compliance.

Detailed Design Concepts

Low-Level Design (LLD)

Component Design: Design reusable and modular UI components.
Config-Driven UI: Create UIs driven by configuration data.
Shimmer UI: Implement loading animations to enhance user experience.
Routing & Protected Routes: Manage navigation and protect routes in your app.
State Management + Libraries: Handle application state using libraries like Redux.
Multi-Language Support: Support multiple languages in your application.
Infinite Scroll: Load content dynamically as the user scrolls.
Accordion: Implement collapsible sections for content organization.
Nested Comments: Design a system for threaded comments.
Image Slider: Create interactive image sliders for media content.
Pagination: Divide content into pages for better navigation.
Real-Time Updates: Push updates to the UI in real time.
Live Chat: Implement a live chat feature.
Search: Build an efficient search functionality.

High-Level Design (HLD)

Photo Sharing App (Instagram): Design a scalable photo-sharing platform.
Ecommerce App (Amazon, Flipkart): Architect an online shopping system.
News Media Feed (X): Create a news feed system.
Video Streaming (Netflix): Design a video streaming service.
Music Streaming (Spotify): Architect a music streaming platform.
Live Commentary (CricBuzz): Build a system for live sports commentary.
Email Client (Gmail): Design an email client with advanced features.
Google Docs: Create a collaborative document editing tool.
Google Sheets: Architect a collaborative spreadsheet application.
Diagram Tools (Excalidraw): Design an interactive diagramming tool.
Cab Services (Uber, Ola, Rapido): Build a ride-hailing service.
Analytics Dashboard (Google Analytics): Create an analytics dashboard.
Edtech Platform (Bloom Tuition): Design an online education platform.

Conclusion

System design is a vast field, but breaking it down into these categories can make it more manageable. Dive into each area, understand the core concepts, and practice designing systems. Happy learning!

In upcoming articles, I will delve deeper into each topic and provide detailed explanations.

If there are any topics I haven't listed, please let me know in the comments, and I will update the article accordingly.