Excel vs React JS — A Clear Comparison for Beginners

Excel — Formulas Every Beginner Should Know:

=SUM(B2:B100)                → total
=AVERAGE(B2:B100)            → average
=COUNTIF(C:C, "Delhi")       → conditional count
=SUMIFS(D:D, A:A, "Jan")     → sum with filters
=VLOOKUP(A2, Sheet2!A:D, 3, FALSE)  → look up a value
=XLOOKUP(A2, Sheet2!A:A, Sheet2!C:C) → modern lookup
=IF(B2 > 1000, "High", "Low") → simple logic
=TEXT(A2, "dd-mmm-yyyy")      → format a date
=IFERROR(VLOOKUP(...), "-")   → handle errors

These formulas cover 80% of real-world Excel work
in finance, operations, marketing, and HR teams.

Excel — Pivot Table (Business Reporting):

Source data columns:
| Date       | Region | Product | Sales |
|------------|--------|---------|-------|
| 2026-01-05 | North  | A       | 1200  |
| 2026-01-06 | South  | B       | 800   |
| 2026-01-07 | North  | A       | 1500  |
| 2026-01-08 | East   | B       | 600   |

Pivot table setup:
  Rows:       Region
  Columns:    Product
  Values:     Sum of Sales
  Filter:     Date (month)

Result:
| Region | A     | B     | Total  |
|--------|-------|-------|--------|
| East   | 0     | 600   | 600    |
| North  | 2700  | 0     | 2700   |
| South  | 0     | 800   | 800    |

Pivot tables are the fastest way to turn raw data
into a business summary — no coding required.

// React — a simple component with state

import { useState } from "react";

function Counter() {
  const [count, setCount] = useState(0);

  return (
    <div>
      <p>Count: {count}</p>
      <button onClick={() => setCount(count + 1)}>
        Add
      </button>
      <button onClick={() => setCount(0)}>
        Reset
      </button>
    </div>
  );
}

export default Counter;

// React — fetch data from an API (useEffect)

import { useEffect, useState } from "react";

function Users() {
  const [users, setUsers] = useState([]);
  const [loading, setLoading] = useState(true);

  useEffect(() => {
    fetch("https://jsonplaceholder.typicode.com/users")
      .then((res) => res.json())
      .then((data) => {
        setUsers(data);
        setLoading(false);
      });
  }, []);

  if (loading) return <p>Loading...</p>;

  return (
    <ul>
      {users.map((u) => (
        <li key={u.id}>{u.name}</li>
      ))}
    </ul>
  );
}

export default Users;

Excel Path — 6 weeks (Business / Analytics):

Week 1: Basics
  ☐ Rows, columns, formatting, shortcuts
  ☐ SUM, AVERAGE, COUNT, MIN, MAX
  ☐ Sorting, filtering

Week 2: Lookups & Logic
  ☐ VLOOKUP, XLOOKUP, INDEX-MATCH
  ☐ IF, IFS, AND, OR
  ☐ IFERROR

Week 3: Data Summaries
  ☐ Pivot tables and charts
  ☐ Grouping and slicers
  ☐ Conditional formatting

Week 4: Data Cleaning
  ☐ Text functions (TRIM, LEFT, RIGHT, TEXTSPLIT)
  ☐ Removing duplicates
  ☐ Data validation

Week 5: Dashboards
  ☐ Build a KPI dashboard
  ☐ Charts, slicers, dynamic ranges
  ☐ Share and lock sheets

Week 6: Business Project
  ☐ Analyse a dataset (sales, HR, or finance)
  ☐ Build a summary dashboard
  ☐ Write insights in plain English

React Path — 6 weeks (Web Development):

Week 1-2: JavaScript Foundations
  ☐ Variables, functions, arrays, objects
  ☐ ES6 (let/const, arrow functions, destructuring)
  ☐ DOM basics and events
  ☐ Async (promises, async/await)

Week 3: React Basics
  ☐ Components and JSX
  ☐ Props and state
  ☐ Event handling
  ☐ Lists and conditional rendering

Week 4: Hooks & Effects
  ☐ useState, useEffect
  ☐ Forms and controlled inputs
  ☐ Fetching API data

Week 5: Routing & Structure
  ☐ React Router
  ☐ Folder structure
  ☐ Reusable components and props

Week 6: Mini Project + Deploy
  ☐ Build a CRUD app (tasks, notes, or movies)
  ☐ Connect to a public API
  ☐ Style with Tailwind or CSS modules
  ☐ Deploy on Vercel or Netlify

Portfolio tip:
Have at least 2-3 deployed React apps on your GitHub
before applying for frontend roles.