<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Aaradhanah Appalo Eleven</title>
    <description>The latest articles on DEV Community by Aaradhanah Appalo Eleven (@geekaara).</description>
    <link>https://dev.to/geekaara</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F383631%2F0a20d8ca-e32f-4e55-870b-16e4ce46df68.png</url>
      <title>DEV Community: Aaradhanah Appalo Eleven</title>
      <link>https://dev.to/geekaara</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/geekaara"/>
    <language>en</language>
    <item>
      <title>LLM Prompt Injection &amp; Guardrail Security</title>
      <dc:creator>Aaradhanah Appalo Eleven</dc:creator>
      <pubDate>Thu, 18 Jun 2026 03:37:19 +0000</pubDate>
      <link>https://dev.to/geekaara/llm-prompt-injection-guardrail-security-glm</link>
      <guid>https://dev.to/geekaara/llm-prompt-injection-guardrail-security-glm</guid>
      <description>&lt;p&gt;&lt;em&gt;A recall reference built from working through a 7-layer prompt-injection challenge. Focus: how each defense layer works, where it breaks, and most importantly how to defend.&lt;/em&gt;&lt;/p&gt;




&lt;h2&gt;
  
  
  The one idea underneath everything
&lt;/h2&gt;

&lt;p&gt;LLMs have &lt;strong&gt;no hard boundary between instructions and data&lt;/strong&gt;. Everything in the context window — system prompt, user message, retrieved documents — is one stream of tokens the model interprets. Prompt injection exploits exactly this: attacker-controlled &lt;em&gt;data&lt;/em&gt; gets read as &lt;em&gt;instructions&lt;/em&gt;. You cannot fully &lt;strong&gt;filter&lt;/strong&gt; your way out of it; you manage it with &lt;strong&gt;defense-in-depth&lt;/strong&gt;, knowing each individual layer is bypassable.&lt;/p&gt;




&lt;h2&gt;
  
  
  The defense layers (and where each cracks)
&lt;/h2&gt;

&lt;p&gt;A progression of controls from weakest to strongest, each with the lesson it teaches.&lt;/p&gt;

&lt;h3&gt;
  
  
  1–2. No / weak guardrails
&lt;/h3&gt;

&lt;p&gt;Baseline: the model just answers. &lt;strong&gt;Lesson:&lt;/strong&gt; an LLM holding secrets in its context with no controls will leak them on request.&lt;/p&gt;

&lt;h3&gt;
  
  
  3. Input filtering — block words in the user's message
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Defense:&lt;/strong&gt; scan the incoming prompt for banned terms ("code", "secret", "reveal") and block.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Weakness:&lt;/strong&gt; keyword blocklists are trivially evaded — synonyms, misspellings, split words, leetspeak, another language, oblique references. Filtering &lt;em&gt;strings&lt;/em&gt; doesn't filter &lt;em&gt;intent&lt;/em&gt;.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;What actually helps:&lt;/strong&gt; prefer allowlists to blocklists; classify intent semantically rather than matching keywords; treat all input as untrusted; rate-limit and log probing.&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  4. Output filtering — catch the secret in the response
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Defense:&lt;/strong&gt; string-match the known secret in the model's output and redact.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Weakness:&lt;/strong&gt; substring matching only catches the &lt;em&gt;contiguous&lt;/em&gt; secret. Fragmenting or transforming it (separators, per-character, encodings) means the literal string never appears, so there is nothing to match.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;What actually helps:&lt;/strong&gt; don't put secrets where the model can emit them in the first place; minimize sensitive data in context; treat output filtering as a brittle last line, never a primary control.&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  5. Input + output filtering combined
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Defense:&lt;/strong&gt; both of the above, stacked.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Weakness:&lt;/strong&gt; the weaknesses stack too — slip past the input filter with obfuscation, then past the output filter with fragmentation. Layering raises the bar but each layer is still individually defeatable.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Lesson:&lt;/strong&gt; layering is good, but "more filters" is not the same as "secure."&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  6. Second LLM as a guardrail — semantic check
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Defense:&lt;/strong&gt; a separate model reads the output and censors it if it recognizes the secret. It understands &lt;em&gt;meaning&lt;/em&gt;, not just strings, so it catches fragmentation and reversal.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Weakness:&lt;/strong&gt; a reasoning judge can be &lt;strong&gt;socially engineered&lt;/strong&gt; — reframe the secret so the judge believes it is harmless (e.g., "this code is expired / has changed"), or present it in a form the judge does not recognize. LLM-judging-LLM inherits all the same manipulability.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;What actually helps:&lt;/strong&gt; pair the LLM judge with deterministic checks; don't treat model-on-model moderation as airtight; constrain what the protected model can even access.&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  7. Human-in-the-loop review
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Defense:&lt;/strong&gt; a person reviews outgoing messages and redacts anything that reveals the secret.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Weakness:&lt;/strong&gt; &lt;strong&gt;humans see &lt;em&gt;rendered&lt;/em&gt; text, not raw bytes.&lt;/strong&gt; Content can be hidden from human eyes while still being read by the model — this is &lt;strong&gt;ASCII smuggling&lt;/strong&gt; (next section). The control fails &lt;em&gt;by construction&lt;/em&gt;.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;What actually helps:&lt;/strong&gt; never rely on human review of rendered text alone; &lt;strong&gt;sanitize and normalize the raw input stream before it reaches the model or the human.&lt;/strong&gt;
&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  Deep dive: ASCII Smuggling (the interesting one)
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;What it is.&lt;/strong&gt; An application-logic flaw that abuses the gap between the &lt;strong&gt;display layer&lt;/strong&gt; (the UI renders certain characters as nothing) and the &lt;strong&gt;raw data stream&lt;/strong&gt; (the model tokenizes everything, invisible characters included). Hidden text is embedded using characters invisible to humans but live to the LLM.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;The invisible vehicles:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Unicode Tags block (U+E0000–U+E007F)&lt;/strong&gt; — deprecated tag characters mirroring ASCII; invisible in essentially every renderer. The primary smuggling channel.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Zero-width characters&lt;/strong&gt; — ZWSP (U+200B), ZWNJ (U+200C), ZWJ (U+200D), BOM / ZWNBSP (U+FEFF).&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Bidirectional controls (U+202A–U+202E, U+2066–U+2069)&lt;/strong&gt; — the "Trojan Source" family; reorder displayed text vs. logical order.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Why it matters now.&lt;/strong&gt; LLMs are wired into email, calendars, documents, and RAG pipelines. Documented real-world impact (FireTail, Sept 2025) includes:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Identity spoofing&lt;/strong&gt; — a tampered calendar invite whose hidden text rewrites the organizer; the assistant reads the spoofed identity and the victim never accepted the invite.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Autonomous data exfiltration&lt;/strong&gt; — a hidden email instruction telling an inbox-connected assistant to search for and leak sensitive items.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Content poisoning&lt;/strong&gt; — a product review with a hidden "visit scam-store…" that the summarizer surfaces as if it were customer consensus.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;It bypasses the "Accept/Decline" gate and human review entirely. Their tests found &lt;strong&gt;Gemini, Grok, DeepSeek&lt;/strong&gt; vulnerable, while &lt;strong&gt;ChatGPT, Copilot, Claude&lt;/strong&gt; scrubbed the input.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;The key mental model:&lt;/strong&gt; this is &lt;strong&gt;not a model jailbreak — it is a pipeline / UI flaw.&lt;/strong&gt; The fix lives in the application, not the model.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Defenses:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Inspect and sanitize the &lt;strong&gt;raw payload the tokenizer receives&lt;/strong&gt;, not the rendered text.&lt;/li&gt;
&lt;li&gt;Strip Tags-block, zero-width, and control / format characters; &lt;strong&gt;NFKC-normalize&lt;/strong&gt;.&lt;/li&gt;
&lt;li&gt;Prefer an &lt;strong&gt;allowlist&lt;/strong&gt; of the Unicode categories you actually need over chasing bad ranges.&lt;/li&gt;
&lt;li&gt;Flag inputs where &lt;strong&gt;visible / printable length diverges sharply from the raw code-point count&lt;/strong&gt; — a strong "someone is probing me" signal.&lt;/li&gt;
&lt;li&gt;Apply all of this to &lt;strong&gt;retrieved / ingested content (RAG), not just user prompts&lt;/strong&gt; — a poisoned document is the same threat as a malicious message.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Log&lt;/strong&gt; the anomalies and treat them as attack telemetry. (AWS has published guidance on Unicode-smuggling defenses; Google declined to act on the disclosure — so responsibility sits with the application owner.)&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  Cross-cutting principles to remember
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;All input is untrusted&lt;/strong&gt; — including documents you retrieve and feed the model. RAG is a top injection vector.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;No instruction / data boundary&lt;/strong&gt; → you can't filter your way to safety; design assuming injection is possible.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Defense-in-depth, with humility&lt;/strong&gt; — layer controls, but assume each is individually bypassable.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Deterministic beats probabilistic&lt;/strong&gt; for security-critical checks where you can manage it; don't rely solely on an LLM or a human to "notice."&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Normalize bytes at the boundary&lt;/strong&gt; — before the model and before the human.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Minimize secrets in context&lt;/strong&gt; — assume anything the model can see can eventually leak.&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  Staying current on this topic
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;Frameworks &amp;amp; standards&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;OWASP Top 10 for LLM Applications / OWASP GenAI Security Project&lt;/strong&gt; — the canonical threat list; follow the latest revision.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;MITRE ATLAS&lt;/strong&gt; — adversarial threat landscape for AI systems (a catalog of attack techniques).&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;NIST AI Risk Management Framework&lt;/strong&gt; — the governance / risk side.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;People &amp;amp; blogs worth following&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Simon Willison&lt;/strong&gt; (simonwillison.net) — popularized the term "prompt injection"; ongoing, sharp coverage.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Johann Rehberger / Embrace The Red&lt;/strong&gt; (embracethered.com) — deep on ASCII smuggling, data exfiltration, and AI-agent attacks.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Lakera&lt;/strong&gt; (blog + the &lt;strong&gt;Gandalf&lt;/strong&gt; game) — prompt-injection research and a great hands-on trainer.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;FireTail blog&lt;/strong&gt; — the ASCII-smuggling disclosure referenced above.&lt;/li&gt;
&lt;li&gt;Vendor security write-ups: &lt;strong&gt;Anthropic, OpenAI, Google, Microsoft&lt;/strong&gt;.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Papers &amp;amp; alerts&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;arXiv cs.CR&lt;/strong&gt; for new research.&lt;/li&gt;
&lt;li&gt;Set &lt;strong&gt;Google Scholar / news alerts&lt;/strong&gt; for "prompt injection", "indirect prompt injection", "LLM security".&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Community &amp;amp; events&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;DEF CON AI Village&lt;/strong&gt;; security newsletters such as &lt;strong&gt;tl;dr sec&lt;/strong&gt;; relevant Discords and subreddits.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Hands-on practice (the best way to retain it)&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Lakera Gandalf&lt;/strong&gt;, &lt;strong&gt;Prompt Airlines&lt;/strong&gt;, &lt;strong&gt;Secure Code Warrior&lt;/strong&gt; (what you just did), and AI-security labs as &lt;strong&gt;HackTheBox / PortSwigger&lt;/strong&gt; roll them out; CTFs with AI categories.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;A sustainable habit:&lt;/strong&gt; follow ~3 of the people above, set one Scholar/news alert, and do one hands-on lab a month. That keeps the muscle memory fresh without drinking from the firehose.&lt;/p&gt;




&lt;p&gt;&lt;em&gt;Reminder: these notes describe attack **classes&lt;/em&gt;* so you can defend against them. The real value is the defensive half — sanitize at the boundary, treat all input (including retrieved content) as untrusted, and never rely on a model or a human to simply "notice."*&lt;/p&gt;

</description>
      <category>ai</category>
      <category>cybersecurity</category>
      <category>llm</category>
      <category>security</category>
    </item>
    <item>
      <title>How to Create a File Upload Page in React to Display Excel Data as a Table and Send it as an Array of Objects</title>
      <dc:creator>Aaradhanah Appalo Eleven</dc:creator>
      <pubDate>Tue, 18 Jul 2023 03:35:05 +0000</pubDate>
      <link>https://dev.to/geekaara/how-to-create-a-file-upload-page-in-react-to-display-excel-data-as-a-table-and-send-it-as-an-array-of-objects-22m2</link>
      <guid>https://dev.to/geekaara/how-to-create-a-file-upload-page-in-react-to-display-excel-data-as-a-table-and-send-it-as-an-array-of-objects-22m2</guid>
      <description>&lt;p&gt;In today's digital world, efficient data management plays a crucial role in various applications across diverse domains. One powerful feature that simplifies data import and manipulation is the ability to upload Excel files (XLSX) directly into web applications. In this tutorial, we'll explore how to build a React application that allows users to upload an XLSX file, display its data as a table, and seamlessly send the data to a backend as an array of objects. This functionality finds valuable applications in real-world scenarios, such as data import and management, inventory control, HR operations, and more.&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 1: Set Up the React Project
&lt;/h2&gt;

&lt;p&gt;Create a new React project using create-react-app. Open your terminal and run the following command:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;npx create-react-app excel-file-upload
cd excel-file-upload
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Step 2: Install Dependencies
&lt;/h2&gt;

&lt;p&gt;We'll use xlsx for Excel file parsing, react-dropzone for file drop functionality, and react-bootstrap for styling. Install these dependencies by running:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;npm install xlsx react-dropzone react-bootstrap @mui/material @mui/icons-material

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Step 3: Create the Excel File Uploader Component
&lt;/h2&gt;

&lt;p&gt;Now, let's create the ExcelFileUploader component. Replace the content of src/App.js with the following:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;// src/ExcelFileUploader.js
import React, { useState } from "react";
import * as XLSX from "xlsx";
import Dropzone from "react-dropzone";
import { Button } from "react-bootstrap";
import Row from "react-bootstrap/Row";
import Col from "react-bootstrap/Col";
import { Box, Modal } from "@mui/material";
import CloseIcon from "@mui/icons-material/Close";

const ExcelFileUploader = () =&amp;gt; {
  // State variables
  const [data, setData] = useState([]);
  const [showForm, setShowForm] = useState(false);
  const [deletePrevious, setDeletePrevious] = useState(false);

  // Handle form close
  const handleFormClose = () =&amp;gt; {
    setShowForm(false);
  };

  // Handle file drop
  const handleFileDrop = async (acceptedFiles) =&amp;gt; {
    const file = acceptedFiles[0];
    if (file.type !== "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet") {
      alert("We support only xlsx format. Please upload an Excel file.");
      return;
    }
    const reader = new FileReader();

    reader.onload = function (e) {
      const data = e.target.result;
      const workbook = XLSX.read(data, { type: "binary" });
      const sheetName = workbook.SheetNames[0];
      const worksheet = workbook.Sheets[sheetName];
      const parsedData = XLSX.utils.sheet_to_json(worksheet, { header: 1 });

      // Assuming the first row contains the column headers
      const headers = parsedData[0];
      const rows = parsedData.slice(1);

      const result = rows.map((row) =&amp;gt; {
        const obj = {};
        headers.forEach((header, index) =&amp;gt; {
          obj[header] = row[index];
        });
        return obj;
      });

      setData(result);
    };

    reader.readAsBinaryString(file);
  };

  // Handle form submission
  const handleSubmit = (e) =&amp;gt; {
    e.preventDefault();
    if (data.length &amp;gt; 0) {
      // Convert data to the required format for backend
      const stockArray = data.map((item) =&amp;gt; ({
        Name: item.Name,
        Description: item.Description,
        SKUCode: item["SKU Code"],
        StockCategory: item["Stock Category"],
        Price: item.Price,
        BrandName: item["Brand Name"],
        ProductName: item["Product Name"],
      }));

      // Send data to backend
      postAddCatering(stockArray);
    } else {
      alert("Please upload an Excel file before submitting.");
    }
  };

  // Send data to backend API
  const postAddCatering = async (stockArray) =&amp;gt; {
    // Replace "https://example.com/" with your actual backend API URL
    const url = "https://example.com/";
    const myHeaders = new Headers();
    myHeaders.append("Content-Type", "application/json");

    const raw = JSON.stringify({
      payload: {
        body: {
          query_type: "upload_stocks",
          stock_array: stockArray,
          supplier_id: 1,
          deletePrevious: deletePrevious,
        },
      },
    });

    const requestOptions = {
      method: "POST",
      headers: myHeaders,
      body: raw,
      redirect: "follow",
    };

    try {
      const response = await fetch(url, requestOptions);
      const dataResponse = await response.json();
      if (dataResponse.success === true) {
        alert("Stock List Uploaded Successfully");
        window.location.reload();
      } else {
        alert("Please try again");
        window.location.reload();
      }
    } catch (error) {
      alert("Please try again");
      window.location.reload();
    }
  };

  // Render the component
  return (
    &amp;lt;div&amp;gt;
      &amp;lt;Dropzone onDrop={handleFileDrop}&amp;gt;
        {({ getRootProps, getInputProps }) =&amp;gt; (
          &amp;lt;div {...getRootProps()}&amp;gt;
            &amp;lt;input {...getInputProps()} /&amp;gt;
            &amp;lt;p&amp;gt;
              Drag and drop an Excel file here, or &amp;lt;strong&amp;gt;click to select one&amp;lt;/strong&amp;gt;
            &amp;lt;/p&amp;gt;
            &amp;lt;Button&amp;gt;Select&amp;lt;/Button&amp;gt;
          &amp;lt;/div&amp;gt;
        )}
      &amp;lt;/Dropzone&amp;gt;
      &amp;lt;div style={{ paddingBottom: "20px", paddingTop: "20px", paddingLeft: "40%" }}&amp;gt;
        &amp;lt;Button onClick={() =&amp;gt; setShowForm(true)}&amp;gt;Submit&amp;lt;/Button&amp;gt;
      &amp;lt;/div&amp;gt;
      {/* Display the table with data */}
      {/* ... (table code as in the original component) */}
      &amp;lt;Modal
        aria-labelledby="transition-modal-title"
        aria-describedby="transition-modal-description"
        open={showForm}
        onClose={handleFormClose}
        className="modalnvm"
      &amp;gt;
        &amp;lt;Box className="modalnvm-content"&amp;gt;
          &amp;lt;CloseIcon
            className="plzHover"
            fontSize="large"
            style={{ margin: 10, float: "right" }}
            onClick={handleFormClose}
          /&amp;gt;
          &amp;lt;label&amp;gt;
            &amp;lt;input
              className="paddingPlease"
              type="checkbox"
              checked={deletePrevious}
              onChange={(e) =&amp;gt; setDeletePrevious(e.target.checked)}
            /&amp;gt;
            &amp;lt;span className="paddingPlease"&amp;gt;
              Would you like to delete the previous stock catalog?
            &amp;lt;/span&amp;gt;
          &amp;lt;/label&amp;gt;
          &amp;lt;span style={{ paddingRight: "40%" }}&amp;gt;
            &amp;lt;Button onClick={handleSubmit}&amp;gt;Confirm&amp;lt;/Button&amp;gt;
          &amp;lt;/span&amp;gt;
        &amp;lt;/Box&amp;gt;
      &amp;lt;/Modal&amp;gt;
    &amp;lt;/div&amp;gt;
  );
};

export default ExcelFileUploader;

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;In this article, we have built a React application that allows users to upload an Excel file, view its content as a table, and send the data as an array of objects to a backend API. We used the xlsx library to parse the Excel file, react-dropzone for file drop functionality, and react-bootstrap for styling.&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>react</category>
      <category>tutorial</category>
      <category>javascript</category>
    </item>
    <item>
      <title>Study in Australia 101: Entrance tests to Landing</title>
      <dc:creator>Aaradhanah Appalo Eleven</dc:creator>
      <pubDate>Thu, 01 Sep 2022 03:38:07 +0000</pubDate>
      <link>https://dev.to/geekaara/study-in-australia-101-entrance-tests-to-landing-1a0p</link>
      <guid>https://dev.to/geekaara/study-in-australia-101-entrance-tests-to-landing-1a0p</guid>
      <description>&lt;p&gt;Australia is one of the best higher education hubs in the world. Due to its relaxed entry requirements, attractive scholarships, and stay back for a few years, it helps students gain experience and repay student loans.&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 1: Entrance&amp;nbsp;Tests
&lt;/h2&gt;

&lt;p&gt;The students from non-English speaking countries must take English language tests to get admission. Most universities prefer IELTS. The minimum overall score should be 6.5 with no bands less than 6.00. There are a plethora of free resources to prepare for the same. The one I used was edX's free course for my preparation is &lt;a href="https://www.edx.org/course/ielts-academic-test-preparation"&gt;https://www.edx.org/course/ielts-academic-test-preparation&lt;/a&gt;.&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 2: Shortlisting Universities and&amp;nbsp;Programs
&lt;/h2&gt;

&lt;p&gt;Shortlist universities and programs according to your preference. Some of the criteria to consider are the course structure, graduate employment, research, student support, alumni network, your budget, the scope of your course back home, etc. The entry for the programs is flexible so that you can change your domain.&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 3: Applying to the Universities
&lt;/h2&gt;

&lt;p&gt;The application process is pretty straightforward. Firstly, create an account, fill in the details, and submit the required documents. Most universities have a support system to help with the application make use of it.&lt;br&gt;
Step 4: Receiving the offer and paying the&amp;nbsp;deposit&lt;br&gt;
You'll receive mail about your application status. The acceptance rate for Aussie universities is pretty high compared to the US. If you get accepted, you might receive scholarships from the universities. Don't panic! There are scholarships for your previous academic credentials and your place of origin. It entirely depends on the universities and programs you apply to. Then you need to accept the offer and pay the deposit, which is a part of your first-semester fee and accept the offer.&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 5: Receiving COE and taking&amp;nbsp;OSHC
&lt;/h2&gt;

&lt;p&gt;After accepting the offer, you'll receive your Confirmation of Enrollment(COE) from the university. Then you need to arrange for Overseas Student Health Insurance(OSHC). You can refer to the website to compare the different insurance providers to choose the best fit for your needs &lt;a href="https://oshcaustralia.com.au/en"&gt;https://oshcaustralia.com.au/en&lt;/a&gt;.&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 6: Applying for the&amp;nbsp;visa
&lt;/h2&gt;

&lt;p&gt;The Australian embassy needs to know whether you can support your education fee and living expenses for the entire course of your study. The application process is entirely online. You need to submit proof of income, Charted accountant statement of your family's net worth, a notarized affidavit of the sponsorship statement, and other documents.&lt;br&gt;
The visa processing time may vary. Don't be tempted; meanwhile, you can access the student email provided by the university. Talk with the seniors, professors, and your classmates. Join the university discord groups to make friends, join the clubs, and have an idea about your study and culture of Australia.&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 7: Booking flight and Arranging Accommodation
&lt;/h2&gt;

&lt;p&gt;After receiving the visa, you can book your flights to Australia. It is recommended to arrive two weeks before the program commences. You can enter Australia even three months before. Use student privilege in airlines to get extra baggage allowance and ticket discounts. The next thing is to look for accommodation, check out the recommendations by your university, and make a lease. Make sure the place falls into your budget and is nearer to your university.&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Happy Journey to Australia!&lt;/p&gt;
&lt;/blockquote&gt;

</description>
    </item>
    <item>
      <title>Stack Data Structure</title>
      <dc:creator>Aaradhanah Appalo Eleven</dc:creator>
      <pubDate>Sat, 20 Feb 2021 09:19:43 +0000</pubDate>
      <link>https://dev.to/geekaara/stack-data-structure-3i70</link>
      <guid>https://dev.to/geekaara/stack-data-structure-3i70</guid>
      <description>&lt;p&gt;Stack data structure resembles the real world stacking of things like papers. The item which is last inserted into the stack will come out first, the principle is called Last In First Out(LIFO).&lt;/p&gt;

&lt;h2&gt;
  
  
  Implementation
&lt;/h2&gt;

&lt;p&gt;Firstly we create a class for implementation in javascript and then creating three data members top, capacity and an empty array of five undefined items.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;class Stack{
      constructor(){
          this.top = 0;
          this.items = new Array(5);
          this.capacity = 5;
      }
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Functions
&lt;/h2&gt;

&lt;p&gt;The Stack should contain functions for adding an item at the top(push), removing an element from top(pop), check if the stack is empty, check if the stack is full and get the top element of the stack(peek)&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;  isEmpty() {
    if (this.top === 0) return true;
    else return false;
  }
  isFull() {
    if (this.top === this.capacity) return true;
    else return false;
  }
  push(item) {
    if (this.isFull() === true) {
      console.log("Stack Overflow");
    } else {
      this.items[this.top] = item;
      this.top += 1;
    }
  }
  pop() {
    if (this.isEmpty() === true) {
      return "Stack Underflow";
    } else {
      let item = this.items[this.top - 1];
      delete this.items[this.top - 1];
      this.top -= 1;
      return item;
    }
  }
  peek() {
    return this.items[this.top - 1];
  }
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Why we need Stack?
&lt;/h2&gt;

&lt;p&gt;Pushing the element and popping out the element in the stack takes place in a constant time O(1). One of the real time example of stack is browser history, when you click back the site you visited last appears.&lt;/p&gt;

&lt;p&gt;Follow me for awesome content on coding.&lt;/p&gt;

</description>
      <category>stack</category>
      <category>javascript</category>
    </item>
  </channel>
</rss>
