We create

{
  "manifest_version": 3,
  "name": "Your Extension",
  "version": "1.0.0",
  "description": "Next-gen Chrome extension",
  "permissions": [
    "tabs",
    "storage"
  ],
  "action": {
    "default_popup": "popup.html"
  },
  "background": {
    "service_worker": "background.js"
  }
}
                        

import React from 'react';
import { useExtension } from './hooks';

export const Popup = () => {
  const { data, isLoading } = useExtension();
  
  return (
    

      
Your Extension
      {isLoading ? (
        
      ) : (
        
      )}
    
  );
};
                        

chrome.runtime.onInstalled.addListener(() => {
  // Initialize extension
  chrome.storage.local.set({
    settings: defaultSettings,
    lastUpdated: Date.now()
  });
});

chrome.tabs.onUpdated.addListener(
  async (tabId, changeInfo) => {
    if (changeInfo.status === 'complete') {
      // Handle tab update
    }
  }
);