In questo progetto, imparerai come costruire una banca fittizia. Queste lezioni includono istruzioni su come strutturare un'app web e fornire percorsi, creare moduli, gestire lo stato e recuperare dati da un'API da cui puoi ottenere i dati della banca.
@ -185,7 +185,7 @@ Proprio come il telefono di Alexander Graham Bell collegava luoghi distanti, col
Una volta caricato tutto, vedrai uno spazio di lavoro pulito e progettato per mantenerti concentrato su ciò che conta – il tuo codice!


**Ecco il tuo tour del quartiere:**
- **Barra delle attività** (quella striscia a sinistra): La tua navigazione principale con Esplora 📁, Cerca 🔍, Controllo sorgente 🌿, Estensioni 🧩 e Impostazioni ⚙️
@ -233,7 +233,7 @@ Questo è perfetto quando inizi da zero in VSCode.dev e vuoi aprire un repositor
1. Vai su [vscode.dev](https://vscode.dev) se non ci sei già
2. Cerca il pulsante "Apri repository remoto" nella schermata di benvenuto e cliccaci sopra
@ -78,7 +78,7 @@ Poiché VSCode.dev richiede almeno un file per aprire un repository, creeremo il
4. **Scrivi** un messaggio di commit: "Aggiungi struttura HTML iniziale"
5. **Clicca** su "Commit new file" per salvare le modifiche


**Ecco cosa realizza questa configurazione iniziale:**
- **Stabilisce** una corretta struttura del documento HTML5 con elementi semantici
@ -104,7 +104,7 @@ Ora che le basi del tuo repository sono state stabilite, passiamo a VSCode.dev p
✅ **Indicatore di successo**: Dovresti vedere i file del tuo progetto nella barra laterale Explorer e `index.html` disponibile per la modifica nell'area principale dell'editor.


**Cosa vedrai nell'interfaccia:**
- **Barra laterale Explorer**: **Mostra** i file e la struttura delle cartelle del tuo repository
@ -448,7 +448,7 @@ Le estensioni migliorano la tua esperienza di sviluppo fornendo funzionalità di
**Risultati immediati dopo l'installazione:**
Una volta installato CodeSwing, vedrai un'anteprima live del tuo sito web per il curriculum apparire nell'editor. Questo ti permette di vedere esattamente come appare il tuo sito mentre apporti modifiche.


**Comprensione dell'interfaccia migliorata:**
- **Vista divisa**: **Mostra** il tuo codice da un lato e l'anteprima live dall'altro


## 🗺️ Il Tuo Percorso di Apprendimento nello Sviluppo di Applicazioni AI
@ -194,7 +194,7 @@ mindmap
**Principio Fondamentale**: Lo sviluppo di applicazioni AI combina competenze tradizionali di sviluppo web con l'integrazione di servizi AI, creando applicazioni intelligenti che sembrano naturali e reattive per gli utenti.


**Ecco cosa rende il playground così utile:**
- **Prova** diversi modelli AI come GPT-4o-mini, Claude e altri (tutti gratuiti!)
@ -204,7 +204,7 @@ mindmap
Una volta che hai sperimentato un po', basta cliccare sulla scheda "Code" e scegliere il tuo linguaggio di programmazione per ottenere il codice di implementazione di cui hai bisogno.


## Configurare l'Integrazione Backend Python
@ -2364,14 +2364,14 @@ Vuoi provare questo progetto in un ambiente di sviluppo cloud? GitHub Codespaces
- **Vai** al [repository Web Dev For Beginners](https://github.com/microsoft/Web-Dev-For-Beginners)
- **Clicca** su "Use this template" nell'angolo in alto a destra (assicurati di essere loggato su GitHub)


**Passo 2: Avvia Codespaces**
- **Apri** il tuo repository appena creato
- **Clicca** sul pulsante verde "Code" e seleziona "Codespaces"
- **Scegli** "Create codespace on main" per avviare il tuo ambiente di sviluppo


**Passo 3: Configurazione dell'Ambiente**
Una volta caricato il tuo Codespace, avrai accesso a:
Ogni lezione include un compito da completare, un controllo della conoscenza e una sfida per guidarti nell’apprendimento di argomenti come:
- Prompt e ingegneria del prompt
@ -96,7 +96,7 @@ Segui questi passaggi:
Nella tua copia del repository creata, clicca il pulsante **Code** e seleziona **Open with Codespaces**. Questo creerà un nuovo Codespace per lavorare.
@ -936,12 +936,12 @@ pie title "Common ARIA Usage Patterns"
**情報を伝える画像** - 重要な情報を伝える:
```html
<imgsrc="../../../../translated_images/chart.31c7eb0eb5c4450deba10b6f236732dfee8e8a11f6c0d8f31d2c2efb9d4c00ef.ja.png" alt="Sales increased 25% from Q1 to Q2 2024">
<imgsrc="../../../../translated_images/ja/chart.31c7eb0eb5c4450deba10b6f236732dfee8e8a11f6c0d8f31d2c2efb9d4c00ef.png" alt="Sales increased 25% from Q1 to Q2 2024">
<imgclass="plant"alt="Decorative plant for terrarium"id="plant1"src="../../../../translated_images/plant1.d18b18ffe73da18f8b1ac7aba73b4050af52f4a0c9174aeac464b85123fc2850.ja.png" />
<imgclass="plant"alt="Decorative plant for terrarium"id="plant1"src="../../../../translated_images/ja/plant1.d18b18ffe73da18f8b1ac7aba73b4050af52f4a0c9174aeac464b85123fc2850.png" />
ウェブ開発の最も魅力的な側面の一つへようこそ!インタラクティブな要素を作ることです。Document Object Model (DOM) は、HTMLとJavaScriptをつなぐ橋のようなもので、今日はこれを使ってテラリウムを動かします。ティム・バーナーズ=リーが最初のウェブブラウザを作ったとき、彼は動的でインタラクティブなドキュメントを想像していました。そのビジョンを可能にするのがDOMです。
ಇಂದಿನ ದಿನದಲ್ಲಿ, ಆಧುನಿಕ ವೆಬ್ ಅಭಿವೃದ್ಧಿಯನ್ನು ಸಾಧ್ಯಗೊಳಿಸುವ ಅದ್ಭುತ ಸಾಧನಗಳ ಮೇಲೆ ನಾವು ಪ್ರಯಾಣ ಮಾಡುವೆವು. ನಾನು ನಿಮ್ಮ Netflix, Spotify ಮತ್ತು ನಿಮ್ಮ ಇಷ್ಟದ ಸ್ವತಂತ್ರ ಆಪ್ ಸ್ಟುಡಿಯೋದ ಡೆವಲಪರ್ ಗಳು ಪ್ರತಿದಿನ ಬಳಸುವ ಎಡಿಟರ್ ಗಳು, ಬ್ರೌಸರ ಗಳು ಮತ್ತು ವರ್ಕ್ಫ್ಲೋಗಳನ್ನು ತಿಳಿಸುತ್ತಿದ್ದೇನೆ. ಮತ್ತು ಇದು ನಿಮಗೆ ಸಂತೋಷಕ್ಕಾಗುವ ಸಂಗತಿ: ಈ ಪರಿಣಿತಿ-ತರಗತಿಯ, ಉದ್ಯಮ-ಮಟ್ಟದ ಬಹುಮತ ಸಾಧನಗಳು ಬಹುಶಃ ಸಂಪೂರ್ಣ ಉಚಿತವಾಗಿವೆ!
ನಾವು ಈ ಪ್ರಯಾಣವನ್ನು ಒಂದೊಂದು ಹಂತವಾಗಿ ಹೋಗೋಣ. ಬೇಗನೆ ಮಾಡಲು ಬೇಡ, ಒತ್ತಡ ಮಾಡಬೇಡ – ನಿಮ್ಮ ಹಾಗೂ ನನ್ನ ನಡುವೆ ಮತ್ತು ನಿಮ್ಮ ಹೊಸ ಅತ್ಯುತ್ತಮ ಸ್ನೇಹಿತರಾದ ಕೆಲವು ಅಬ್ಬರದ ಉಪಕರಣಗಳ ಜೊತೆ!


✅ 'ಬಗ್ಗೆ ಪರಿಚಯದ' ರೆಪೊಗಳನ್ನು ಕಂಡುಹಿಡಿಯಲು ಉತ್ತಮ ಮಾರ್ಗವಾಗಿದೆ [‘good-first-issue’ ಟ್ಯಾಗ್ ಮೂಲಕ ಹುಡುಕಿ](https://github.blog/2020-01-22-browse-good-first-issues-to-start-contributing-to-open-source/).


ಕೋಡ್ ನಕಲಿಸುವ ಹಲವಾರು ವಿಧಾನಗಳಿವೆ. ಒಂದು ವಿಧಾನವೆಂದರೆ “ಕ್ಲೋನ್” ಮಾಡುವುದು, ಅದು https, SSH ಅಥವಾ GitHub CLI (ಕಮಾಂಡ್ ಲೈನ್ ಇಂಟರ್ಫೇಸ್) ಬಳಸಿ ರೆಪೊ ಸಹಿತದ ವಿಷಯವನ್ನು ನಕಲಿಸುವುದು.


> [ಟೊಮೊми ಇಮುರಾ](https://twitter.com/girlie_mac) ರವರ ಸ್ಕೆಚ್ ನೋಟ
ನಿಮ್ಮ HTML ಟೆರೇರಿಯಂ ಹೌದು ಎಂದಾದರೂ ತುಂಬಾ ಸರಳವಾಗಿ ಕಂಡಿತಾ? CSS ಆ ಸರಳ ರಚನೆಯನ್ನು ದೃಶ್ಯಾತ್ಮಕವಾಗಿ ಆಕರ್ಷಕವಾಗಿಸುವುದೇ ಆಗಿದೆ.
@ -202,7 +202,7 @@ body {
ನಿಮ್ಮ ಬ್ರೌಸರ್ ಡೆವಲಪರ್ ಟೂಲ್ಗಳು (F12) ತೆರೆಯಿರಿ, Elements ಟ್ಯಾಬ್ಗೆ ಹೋಗಿ, ಮತ್ತು ನಿಮ್ಮ `<h1>` ಎಲಿಮೆಂಟ್ ಅನ್ನು ಪರಿಶೀಲಿಸಿ. ಅದು ನೆಲೆಯ `<body>` ಮೂಲಕ ಫಾಂಟ್ ಫ್ಯಾಮಿಲಿ ಪರಂಪರೆಯನ್ನು ಪಡೆಯುತ್ತಿದೆ:
✅ **ಪ್ರಯೋಗ ಸಮಯ**: `<body>` ಮೇಲೆ `color`, `line-height`, ಅಥವಾ `text-align` ಮುಂತಾದ ಇತರೆ ಪರಂಪರೆಯಾಗುವ ಗುಣಲಕ್ಷಣಗಳನ್ನು ನಿಶ್ಚಯಿಸಿ ನೋಡಿ. ನಿಮ್ಮ ಶೀರ್ಷಿಕೆ ಮತ್ತು ಇತರ ಎಲಿಮೆಂಟ್ಗಳಿಗೆ ಏನು ಆಗುತ್ತದೆ?
@ -332,7 +332,7 @@ ID ಆಯ್ಕೆದಾರರು `#` ಚಿಹ್ನೆಯನ್ನು ಬಳ
**ಪ್ರತಿ ಸಸ್ಯದ HTML ರಚನೆ:**
```html
<divclass="plant-holder">
<imgclass="plant"alt="Decorative plant for terrarium"id="plant1"src="../../../../translated_images/plant1.d18b18ffe73da18f.kn.png" />
<imgclass="plant"alt="Decorative plant for terrarium"id="plant1"src="../../../../translated_images/kn/plant1.d18b18ffe73da18f.png" />


> ಸ್ಪಷ್ಟಚಿತ್ರಣ [ಟೊಮೊಮಿ ಇಮುರು](https://twitter.com/girlie_mac) ಅವರಿಂದ
ವೆಬ್ ಅಭಿವೃದ್ಧಿಯ ಅತ್ಯಂತ ಆಕರ್ಷಕ ಅಂಶಗಳಲ್ಲಿ ಒಂದಕ್ಕೆ ಸ್ವಾಗತ - ವಿಷಯಗಳನ್ನು ಸಂವಾದಾತ್ಮಕವಾಗಿ ಮಾಡುವುದಕ್ಕೆ! ಡಾಕ್ಯುಮೆಂಟ್ ಆಬ್ಜೆಕ್ಟ್ ಮಾದರಿ (DOM) ನಿಮ್ಮ HTML ಮತ್ತು JavaScript ನಡುವಿನ ಸೇತುವೆಯಾಗಿದ್ದು, ಇಂದು ನಾವು ಅದನ್ನು ಬಳಸಿಕೊಂಡು ನಿಮ್ಮ ಟೆರಾರಿಯನ್ಗೆ ಜೀವ ತುಂಬಿಸುತ್ತೇವೆ. ಟಿಮ್ ಬರ್ಮರ್ಸ್-ಲೀ ಮೊದಲ ವೆಬ್ ಬ್ರೌಸರ್ ಅನ್ನು ರಚಿಸುವಾಗ, ಅವರು ಡೈನಾಮಿಕ್ ಮತ್ತು ಸಂವಾದಾತ್ಮಕ ಡಾಕ್ಯುಮೆಂಟ್ಗಳುಳ್ಳ ಒಂದು ವೆಬ್ನ ಕನಸನ್ನು ಕಂಡಿದ್ದರು - DOM ಆ ಕನಸನ್ನು ಸಾಧ್ಯವಾಗಿಸುತ್ತದೆ.
> DOM ಹಾಗೂ ಅದಕ್ಕೆ ಉಲ್ಲೇಖಿಸುವ HTML ಮಾರ್ಕ್ಅಪ್ನ ಪ್ರತಿನಿಧಾನ. [ಒಲ್ಫಾ ನಾಸ್ರಾವೋಯಿ](https://www.researchgate.net/publication/221417012_Profile-Based_Focused_Crawler_for_Social_Media-Sharing_Websites) ಅವರಿಂದ
@ -148,7 +148,7 @@ flowchart LR
```
> 💡 **ಕ್ಲೋಶರ್ಗಳ ಸಾಮಗ್ರಿಯನ್ನು ಅರಿಯುವುದು**: ಕ್ಲೋಶರ್ಗಳು JavaScript ನ ಪ್ರಮುಖ ವಿಷಯವಾಗಿದ್ದು, ಹಲವಾರು ಡೆವಲಪರ್ಗಳು ಸಾಕಷ್ಟು ಕಾಲಗಳ ಕಾಲ ಅವುಗಳ ತಾತ್ವಿಕ ಅಂಶಗಳನ್ನು ಸಂಪೂರ್ಣವಾಗಿ ಓಗಿಕೊಳ್ಳುವ ಮೊದಲು ಬಳಕೆ ಮಾಡುತ್ತಾರೆ. ಇಂದು ನಾವು ಪ್ರಾಯೋಗಿಕ ಅನ್ವಯಕ್ಕೆ ಗಮನವಿಡುತ್ತೇವೆ - ನೀವು ನಮ್ಮ ಸಂವಾದಾತ್ಮಕ ವೈಶಿಷ್ಟ್ಯಗಳನ್ನು ನಿರ್ಮಿಸುವಾಗ, ಕ್ಲೋಶರ್ಗಳು ಸಹಜವಾಗಿ ಕಾಣಿಸಿಕೊಳ್ಳುವುದನ್ನು ತಿಳಿದುಕೊಳ್ಳುತ್ತೀರಿ.
> DOM ಹಾಗೂ ಅದಕ್ಕೆ ಉಲ್ಲೇಖಿಸುವ HTML ಮಾರ್ಕ್ಅಪ್ನ ಪ್ರತಿನಿಧಾನ. [ಒಲ್ಫಾ ನಾಸ್ರಾವೋಯಿ](https://www.researchgate.net/publication/221417012_Profile-Based_Focused_Crawler_for_Social_Media-Sharing_Websites) ಅವರಿಂದ
@ -593,7 +593,7 @@ function stopElementDrag() {
- **ಕ್ರಾಸ್-ಡಿವೈಸ್ ಬೆಂಬಲ**: ಡೆಸ್ಕ್ಟಾಪ್ ಮತ್ತು ಮೊಬೈಲ್ ಎರಡರಲ್ಲೂ ಕಾರ್ಯನಿರ್ವಹಿಸುತ್ತದೆ
- **ಕಾರ್ಯಕ್ಷಮತೆಯ ವಿವರವಾದ ಶ್ರದ್ಧೆ**: ನೆನಪು ಲೀಕ್ ಅಥವಾ ಅನವಶ್ಯಕ ಲೆಕ್ಕಾಚಾರ ಇಲ್ಲ
ಒಂದು ಸಣ್ಣ ಡ್ರಾಗ್ ಮತ್ತು ಡ್ರೋಪ್ ಕೋಡ್-ಪ್ರಾರ್ಥನೆ. ಸ್ವಲ್ಪ HTML, JS ಮತ್ತು CSS ಜೊತೆಗೆ, ನೀವು ಒಂದು ವೆಬ್ ಇಂಟರ್ಫೇಸ್ ನಿರ್ಮಿಸಿ, ಅಂದ Saj ದಿ ಕೊಟ್ಟು, ಮತ್ತು ಒಂದು ಇಂಟರೆಕ್ಷನ್ ಸೇರಿಸಬಹುದು.
> ಸ್ಕೆಟ್ನೋಟ್ [Wassim Chegham](https://dev.to/wassimchegham/ever-wondered-what-happens-when-you-type-in-a-url-in-an-address-bar-in-a-browser-3dob) ಅವರಿಂದ
## ಓಪನಾಗಿ ಪಾಠದ ಪೂರ್ವ ಪ್ರಶ್ನೆಗಳ ಸರಣಿ
@ -77,7 +77,7 @@ mindmap
✅ **ಚಿಕ್ಕ ಇತಿಹಾಸ**: ಮೊದಲ ಬ್ರೌಸರ ಹೆಸರೇ 'WorldWideWeb' ಆಗಿತ್ತು ಮತ್ತು ಅದನ್ನು ಸರ್ ಟಿಮೋಥಿ ಬರ್ನರ್ಸ್-ಲೀ 1990 ರಲ್ಲಿ ರಚಿಸಿದ್ದರು.
> ಕೆಲವೊಂದು ಪ್ರಾಚೀನ ಬ್ರೌಸರಗಳು, [Karen McGrane](https://www.slideshare.net/KMcGrane/week-4-ixd-history-personal-computing) ಅವರ ಮೂಲಕ
### ಬ್ರೌಸರ್ಗಳು ವೆಬ್ ವಿಷಯವನ್ನು 어떻게 ಪ್ರಕ್ರಿಯೆ ಪಡಿಸುತ್ತವೆ
@ -194,7 +194,7 @@ quadrantChart
ವಿಸ್ತಾರಗಳನ್ನು ಇನ್ಸ್ಟಾಲ್ ಮಾಡುವ ಪ್ರಕ್ರಿಯೆಯನ್ನು ತಿಳಿದುಕೊಳ್ಳುವ ಮೂಲಕ, ನೀವು ಜನರು ನಿಮ್ಮ ವಿಸ್ತಾರವನ್ನು ಇನ್ಸ್ಟಾಲ್ ಮಾಡುವಾಗ ಬಳಕೆದಾರ ಅನುಭವದ ನಿರೀಕ್ಷೆಯನ್ನು ಮಾಡಬಹುದು. ಇನ್ಸ್ಟಾಲೇಶನ್ ಪ್ರಕ್ರಿಯೆ ಆಧುನಿಕ ಬ್ರೌಸರಗಳಲ್ಲಿ ಸಾಮಾನ್ಯವಾಗಿದೆ, ಕೆಲವು ಸಣ್ಣ ವ್ಯತ್ಯಾಸಗಳು ಮಾತ್ರ ಇಂಟರ್ಫೇಸ್ ವಿನ್ಯಾಸದಲ್ಲಿ ಇರುತ್ತವೆ.


> **ಮುಖ್ಯವಾದುದು**: ನಿಮ್ಮ ಸ್ವಂತ ವಿಸ್ತಾರಗಳನ್ನು ಪರೀಕ್ಷಿಸುವಾಗ ಡೆವಲಪರ್ ಮೋಡ್ ಅನ್ನು ಟೋಗಲ್ ಆನ್ ಮಾಡಿ ಮತ್ತು ಬೇರೆ ಸ್ಟೋರ್ಗಳಿಂದ ವಿಸ್ತಾರಗಳನ್ನು ಅನುಮತಿಸಿ.
@ -308,10 +308,10 @@ project-root/
### ವಿಸ್ತಾರ ವೀಕ್ಷಣೆಗಳ ಸಮೀಕ್ಷೆ
**ಸೆಟಪ್ ವೀಕ್ಷಣೆ** - ಮೊದಲು ಬಳಕೆದಾರ ಸಂರಚನೆ:


**ಫಲಿತಾಂಶ ವೀಕ್ಷಣೆ** - ಕಾರ್ಬನ್ ಫೂಟ್ಪ್ರಿಂಟ್ ಡೇಟಾ ಪ್ರದರ್ಶನ:


> ⚠️ **ಭದ್ರತಾ ಪರಿಗಣನೆ**: ಉತ್ಪಾದನಾ ಅಪ್ಲಿಕೇಶನ್ಗಳಲ್ಲಿ, API ಕೀಗಳನ್ನು LocalStorage ನಲ್ಲಿ ಸಂಗ್ರಹಿಸುವುದು ಭದ್ರತಾ ಅಪಾಯವನ್ನು ಉಂಟುಮಾಡಬಹುದು ಏಕೆಂದರೆ ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಗೆ ಈ ಡೇಟಾ ಪ್ರಾಪ್ತಿಯಿದೆ. ಕಲಿಕೆಯ ಉದ್ದೇಶಗಳಿಗೆ, ಈ ವಿಧಾನ ಸರಿಯಾಗಿದೆ, ಆದರೆ ನಿಜವಾದ ಅಪ್ಲಿಕೇಶನ್ಗಳು ಸಂವೇದನಾಶೀಲ ಪ್ರಮಾಣಪತ್ರಗಳಿಗಾಗಿ ಭದ್ರ ಸರ್ವರ್-ಬದಿಗೆ ಸಂಗ್ರಹಣೆಯನ್ನು ಬಳಸಬೇಕು.
ಈದು ಪ್ರಯತ್ನಿಸೋಣ. ಒಂದು ವೆಬ್ಸೈಟ್ ತೆರೆಯಿರಿ (Microsoft.com ಚೆನ್ನಾಗಿದೆ) ಮತ್ತು 'Record' ಬಟನ್ ಒತ್ತಿ. ಈಗ ಪುಟವನ್ನು ರಿಫ್ರೆಶ್ ಮಾಡಿ ಮತ್ತು ಪ್ರೊಫೈಲರ್ ಕ್ರಿಯೆಯನ್ನು ಸೆರೆಹಿಡಿಯುವುದನ್ನು ನೋಡಿ. ನೀವು ರೆಕಾರ್ಡ್ ನಿಲ್ಲಿಸಿದಾಗ, ಬ್ರೌಸರ್ 'ಸ್ಕ್ರಿಪ್ಟ್', 'ರೆಂಡರ್', ಮತ್ತು 'ಪೇಂಟ್' ಆಗುವ ವೈಯಕ್ತಿಕ ವಿವರವನ್ನು ನೋಡುತ್ತೀರಿ. ಇದು ರಾಕೆಟ್ ಲಾಂಚ್ ಸಮಯದ ಮಿಷನ್ ಕಂಟ್ರೋಲ್ ನಲ್ಲಿ ಪ್ರತಿ ವ್ಯವಸ್ಥೆಯನ್ನು ಮೇಲ್ವಿಚಾರಣೆ ಮಾಡುವ ರೀತಿಯಾಗಿದೆ - ನೀವು ನಿಜ ಸಮಯದಲ್ಲಿ ಏನು ಮತ್ತು ಯಾವಾಗ ನಡೆಯುತ್ತಿದೆ ಎಂಬ ಡೇಟಾವನ್ನು ಪಡೆಯುತ್ತೀರಿ.
✅ [Microsoft ಡಾಕ್ಯುಮೆಂಟೇಷನ್](https://docs.microsoft.com/microsoft-edge/devtools-guide/performance/?WT.mc_id=academic-77807-sagibbon) ನಲ್ಲಿ ಹೆಚ್ಚು ವಿವರಗಳನ್ನು ತಿಳಿದುಕೊಳ್ಳಬಹುದು
@ -133,11 +133,11 @@ flowchart LR
ಪ್ರೊಫೈಲ್ ಟೈಮ್ಲೈನ್ನ ಭಾಗ ಆಯ್ಕೆ ಮಾಡಿ ಸಾರಾಂಶ ಪೇನ್ ನಲ್ಲಿ ನಿಮ್ಮ ಪುಟದ ಕಾರ್ಯಕ್ಷಮತೆಯ ಸ್ನಾಪ್ಶಾಟ್ ಪಡೆಯಿರಿ:
✅ ನಿಮ್ಮ ಪ್ರೊಫೈಲರ್ ಪರಿಚಯಿಸಿದರು! ಈ ಸೈಟ್ನಲ್ಲಿ ಡೆವಲಪರ್ ಟೂಲ್ಗಳನ್ನು ತೆರೆಯಿರಿ, ಯಾವುದಾದರೂ ಸಮಸ್ಯೆಗಳಿವೆ ಎಂಬುದನ್ನು ನೋಡಿ. ಏನು ಅತ್ಯಂತ ನಿಧಾನವಾಗಿ ಲೋಡ್ ಆಗುತ್ತದೆ? ಏನು ಅತ್ಯಂತ ವೇಗವಾಗಿ?
tmrow ರ C02 ಸಿಗ್ನಲ್ API ಯನ್ನು ಬಳಸಿಕೊಂಡು ವಿದ್ಯುತ್ ಬಳಕೆಯನ್ನು ಹಿಂಬಾಲಿಸಲು, ನೀವು ನಿಮ್ಮ ಬ್ರೌಸರ್ ನಲ್ಲಿ ನಿಮ್ಮ ಪ್ರದೇಶದ ವಿದ್ಯುತ್ ಬಳಕೆ ಎಷ್ಟು ಭಾರೀವಾಗಿದೆ ಎಂಬ ಕುರಿತು ನೆನೆಪೊಡಿಸುವ ವಿಸ್ತರಣೆ ರಚಿಸಿ. ಈ ವಿಸ್ತರಣೆಯನ್ನು ಅಕ್ರಮವಾಗಿ ಬಳಸುವುದು ನಿಮ್ಮ ಚಟುವಟಿಕೆಗಳ ಬಗ್ಗೆ ಈ ಮಾಹಿತಿಯನ್ನು ಆಧರಿಸಿ ತೀರ್ಮಾನ ಕೈಗೊಳ್ಳಲು ಸಹಾಯ ಮಾಡುತ್ತದೆ.
Edge ನಲ್ಲಿ ಇನ್ಸ್ಟಾಲ್ ಮಾಡಲು, ಬ್ರೌಸರ್ನ ಉದ್ದನೆಯ ಬಲ ಕೋನದಲ್ಲಿರುವ 'ಮೂರು ಬಿಂದುಗಳು' ಮೆನು ಬಳಸಿ ವಿಸ್ತರಣೆ ಪ್ಯಾನೆಲಿಗೆ ಹೋಗಿ. ಅಲ್ಲಿ 'Load Unpacked' ಅನ್ನು ಆಯ್ಕೆಮಾಡಿ ಹೊಸ ವಿಸ್ತರಣೆಯನ್ನು ಲೋಡ್ ಮಾಡಿ. ಪ್ರಾಂಪ್ಟ್ನಲ್ಲಿ 'dist' ಫೋಲ್ಡರ್ ತೆರೆಯಿರಿ, ವಿಸ್ತರಣೆ ಲೋಡ್ ಆಗುತ್ತದೆ. ಇದನ್ನು ಬಳಸಲು, CO2 Signal ರ API ಗೆ API ಕೀ ಬೇಕಾಗುತ್ತದೆ ([ಇದನ್ನು ಇಮೇಲ್ ಮೂಲಕ ಪಡೆಯಿರಿ](https://www.co2signal.com/) - ಈ ಪುಟದ ಬಾಕ್ಸ್ ನಲ್ಲಿ ನಿಮ್ಮ ಇಮೇಲ್ ನಮೂದಿಸಿ) ಮತ್ತು ನಿಮ್ಮ [ವಿದ್ಯುತ್ ನಕ್ಷೆ](https://www.electricitymap.org/map) ಗೆ ತಕ್ಕಂತೆ ನಿಮ್ಮ ಭಾಗದ [ಕೋಡ್](http://api.electricitymap.org/v3/zones) ಬೇಕಾಗುತ್ತದೆ (ಉದಾಹರಣೆಗೆ ಬೋಸ್ಟನ್ನಲ್ಲಿ ನಾನು 'US-NEISO' ಉಪಯೋಗಿಸುತ್ತೇನೆ).
ಒಮ್ಮೆ API ಕೀ ಮತ್ತು ನಿಮ್ಮ ಭಾಗವನ್ನು ವಿಸ್ತರಣೆ ಇಂಟರ್ಫೇಸಿಗೆ ನಮೂದಿಸಿದ ಮೇಲೆ, ಬ್ರೌಸರ್ ವಿಸ್ತರಣೆ ಬಾರ್ನಲ್ಲಿ ಬಣ್ಣದ ಚುಕ್ಕೆ ನಿಮ್ಮ ಪ್ರದೇಶದ ವಿದ್ಯುತ್ ಬಳಕೆಯನ್ನು ಪ್ರತಿಬಿಂಬಿಸುತ್ತದೆ ಮತ್ತು ಯಾವ ವಿಧಾನಗಳಲ್ಲಿಯೇ ಹೆಚ್ಚು ವಿದ್ಯುತ್ ಬಳಕೆಯಾಗುತ್ತದೆ ಎಂಬದನ್ನು ಸೂಚಿಸುತ್ತದೆ. ಈ 'ಚುಕ್ಕೆ' ವ್ಯವಸ್ಥೆಯ ಹಿಂದಿನ ಕಲ್ಪನೆಯನ್ನು ನನ್ನಗೆ [Energy Lollipop ವಿಸ್ತರಣೆ](https://energylollipop.com/) ಕ್ಯಾಲಿಫೋರ್ನಿಯಾ ಉಸಿರಾಟಗಳಿಗಾಗಿ ನೀಡಿದೆ.
tmrow ನ CO2 ಸಿಗ್ನಲ್ API ಬಳಸಿ ವಿದ್ಯುತ್ ಬಳಕೆ ಟ್ರ್ಯಾಕ್ ಮಾಡಲು, ನಿಮ್ಮ ವಲಯದ ವಿದ್ಯುತ್ ಬಳಕೆಯ ಬಗ್ಗೆ ನಿಮ್ಮ ಬ್ರೌಸರ್ನಲ್ಲಿ ನೇರವಾಗಿ ರಿಮೈಂಡರ್ ಇರಲು ಬ್ರೌಸರ್ ವಿಸ್ತರಣೆಯನ್ನು ರಚಿಸಿ. ಈ ಅಡ್ಹಾಕ್ ವಿಸ್ತರಣೆ ಬಳಕೆ ಈ ಮಾಹಿತಿಯ ಆಧಾರದ ಮೇಲೆ ನಿಮ್ಮ ಚಟುವಟಿಕೆಗಳ ಕುರಿತು ನಿರ್ಧಾರಗಳನ್ನು ತೆಗೆದುಕೊಳ್ಳಲು ಸಹಾಯ ಮಾಡುತ್ತದೆ.
Edge ನಲ್ಲಿ ಇನ್ಸ್ಟಾಲ್ ಮಾಡಲು, ಬ್ರೌಸರ್ನ ಮೇಲ್ಭಾಗದ ಎಡಭಾಗದ 'ಮೂರು ಮಿಂಚು' ಮెన್ಯೂ ಬಳಸಿ ವಿಸ್ತರಣೆ ಪ್ಯಾನಲ್ ಹುಡುಕಿ. ಅದರಲ್ಲಿ 'ಅನ್ಪ್ಯಾಕ್ಡ್ ಲೋಡ್' ಆಯ್ಕೆಮಾಡಿ ಹೊಸ ವಿಸ್ತರಣೆಯನ್ನು ಲೋಡ್ ಮಾಡಿ. ಕೇಳಿದಾಗ 'dist' ಫೋಲ್ಡರ್ ತೆರೆಯಿರಿ, ವಿಸ್ತರಣೆ ಲೋಡ್ ಆಗುತ್ತದೆ. ಇದನ್ನು ಬಳಸಿಸಲು, CO2 ಸಿಗ್ನಲ್ API ಕೀ ಅಗತ್ಯವಿದೆ ([ಇಮೇಲ್ ಮೂಲಕ ಇಲ್ಲಿ ಪಡೆಯಿರಿ](https://www.co2signal.com/) - ಈ ಪುಟದ ಪೆಟ್ಟಿಗೆಯಲ್ಲಿ ನಿಮ್ಮ ಇಮೇಲ್ ನಮೂದಿಸಿ) ಮತ್ತು [ವಿದ್ಯುತ್ ನಕ್ಷೆಗೆ](https://www.electricitymap.org/map) ಹೊಂದಿಕೊಳ್ಳುವ ನಿಮ್ಮ ವಲಯದ [ಕೋಡ್](http://api.electricitymap.org/v3/zones) (ಉದಾಹರಣೆಗೆ ಬಾಸ್ಟನಿಯಲ್ಲಿ 'US-NEISO' ನ್ನು ಬಳಸುತ್ತೇನೆ).
API ಕೀ ಮತ್ತು ವಲಯವು ವಿಸ್ತರಣೆ ಇಂಟರ್ಫೇಸ್ನಲ್ಲಿ ನಮೂದಿಸಿದ ನಂತರ, ಬ್ರೌಸರ್ ವಿಸ್ತರಣೆ ಬಾರ್ನ ಬಣ್ಣದ ಬಿಂದುವು ನಿಮ್ಮ ವಲಯದ انر╔ಳ ನಿದರ್ಶನ ನೀಡಲು ಬದಲಾಗುತ್ತದೆ ಮತ್ತು ಹೆಚ್ಚಿನ ವಿದ್ಯುತ್ ಬಳಕೆ ಚಟುವಟಿಕೆಗಳ ಬಗ್ಗೆ ಸೂಚನೆ ನೀಡುತ್ತದೆ. ಈ "ಬಿಂದುಗಳು" ವ್ಯವಸ್ಥೆಯ ಆಲೋಚನೆಯನ್ನು ನನಗೆ [Energy Lollipop ವಿಸ್ತರಣೆ](https://energylollipop.com/) ಕೊಟ್ಟಿತು, ಇದು ಕ್ಯಾಲಿಫೋರ್ಮಿಯಾದ ಕಾರ್ಬನ್ ಉಗ್ರಣೆಗಳಿಗಾಗಿ ಇದೆ.
tmrow ನ C02 ಸಿಗ್ನಲ್ API ಬಳಸಿ ವಿದ್ಯುತ್ ಬಳಕೆಯನ್ನು ವೀಕ್ಷಿಸಲು, ನಿಮ್ಮ ಪ್ರದೇಶದ ವಿದ್ಯುತ್ ಬಳಕೆಯ ಬಗ್ಗೆ ನೇರವಾಗಿ ನಿಮ್ಮ ಬ್ರೌಸರ್ ನಲ್ಲಿ ಸೂಚನೆ ನೀಡುವ ಬ್ರೌಸರ್ ವಿಸ್ತರಣೆಯನ್ನು ರಚಿಸಿ. ಈ ಅನೌಪಚಾರಿಕ ವಿಸ್ತರಣೆ ಬಳಕೆ ನಿಮ್ಮ ಚಟುವಟಿಕೆಗಳ ಮೇಲೆ ಈ ಮಾಹಿತಿಯ ಆಧಾರದ ಮೇಲೆ ತೀರ್ಮಾನ ತಗೊಳ್ಳಲು ಸಹಾಯ ಮಾಡುತ್ತದೆ.
Edge ನಲ್ಲಿ ಸ್ಥಾಪಿಸಲು, ಬ್ರೌಸರ್ ನ ಮೇಲ್ಭಾಗದ ಬಲದ ಕಡೆ "ಮೂರು ಚಿಹ್ನೆಗಳು" ಮೆನು ಬಳಸಿ ಎಕ್ಸ್ಟೆನ್ಶನ್ ಪ್ಯಾನೆಲ್ ಹುಡುಕಿ. ಅಲ್ಲಿ, "ಅನ್ಜಿಪ್ ಮಾಡಲಾದ ವಿಸ್ತರಣೆಯನ್ನು ಲೋಡ್ ಮಾಡಿ" ಆಯ್ಕೆಯನ್ನು ಆರಿಸಿ ಹೊಸ ವಿಸ್ತರಣೆಯನ್ನು ಲೋಡ್ ಮಾಡಿ. ಆದೇಶದಲ್ಲಿ 'dist' ಫೋಲ್ಡರ್ ತೆರೆದು ವಿಸ್ತರಣೆ ಲೋಡ್ ಆಗುತ್ತದೆ. ಬಳಕೆ ಮಾಡಲು, ನೀವು CO2 ಸಿಗ್ನಲ್ API ಗಾಗಿ API ಕೀ ಬೇಕಾಗುತ್ತದೆ ([ಇಲ್ಲಿ ಇಮೇಲ್ ಮೂಲಕ ಪಡೆಯಿರಿ](https://www.co2signal.com/) - ಈ ಪುಟದಲ್ಲಿ ನಿಮ್ಮ ಇಮೇಲ್ ನಮೂದಿಸಿ) ಮತ್ತು [ವಿದ್ಯುತ್ ನಕ್ಷೆ](https://www.electricitymap.org/map) ಗೆ ಹೊಂದಿಕೊಳ್ಳುವ ನಿಮ್ಮ ಪ್ರಾಂತ್ಯದ [ಕೋಡ್](http://api.electricitymap.org/v3/zones) (ಉದಾಹರಣೆಗೆ ಬೋಸ್ಟನ್ ನಲ್ಲಿ, 'US- NEISO' ಅನ್ನು ಬಳಸುತ್ತೇನೆ).
API ಕೀ ಮತ್ತು ಪ್ರಾಂತ್ಯವನ್ನು ವಿಸ್ತರಣೆ ಮುಖಪುಟದಲ್ಲಿ ನಮೂದಿಸಿದ ನಂತರ, ಬ್ರೌಸರ್ ವಿಸ್ತರಣೆ ಬಾರದ ಬಣ್ಣದ ಬಿಂಗು ನಿಮ್ಮ ಪ್ರಾಂತ್ಯದ ವಿದ್ಯುತ್ ಬಳಕೆಯನ್ನು ತೋರ್ಪಡಿಸಿ, ನಿಮ್ಮ ಅಭ್ಯಾಸಗಳಿಗೆ ಸರಿ ಹೊಂದುವ ಶಕ್ತಿವಂತರ ಚಟುವಟಿಕೆಗಳ ಸೂಚಕವನ್ನು ನೀಡುತ್ತದೆ. ಈ "ಬಿಂಗು" ಸಮೀಕ್ಷೆಯ ಪರಿಕಲ್ಪನೆಯನ್ನು ಕ್ಯಾಲಿಫೋರ್ನಿಯಾದ ಉಳಿತಾಯಗಳಿಗಾಗಿ [Energy Lollipop ವಿಸ್ತರಣೆ](https://energylollipop.com/)ರಿಂದ ಪಡೆದಿದ್ದೇನೆ.
ವಿದ್ಯುತ್ ಬಳಕೆಯನ್ನು ಟ್ರ್ಯಾಕ್ ಮಾಡಲು tmrow ನ CO2 ಸಿಗ್ನಲ್ API ಅನ್ನು ಬಳಸುವುದು, ನಿಮ್ಮ ಬ್ರೌಸರ್ ನಲ್ಲಿ ನಿಮ್ಮ ಪ್ರದೇಶದ ವಿದ್ಯುತ್ ಬಳಕೆ ಎಷ್ಟು ಗಂಭೀರವಾಗಿದೆ ಎಂಬುದರ ಬಗ್ಗೆ ನಿಮಗೆ ಸ್ಮರಣಿಕೆ ನೀಡುವಂತೆ ಒಂದು ಬ್ರೌಸರ್ ಎಕ್ಸ್ಟೆಂಶನ್ ಅನ್ನು ರಚಿಸುವುದು. ಈ ತಾತ್ಕಾಲಿಕ ಎಕ್ಸ್ಟೆಂಶನ್ನ ಬಳಕೆಯಿಂದ ನೀವು ಈ ಮಾಹಿತಿಯ ಆಧಾರದಲ್ಲಿ ನಿಮ್ಮ ಚಟುವಟಿಕೆಗಳ ಬಗ್ಗೆ ತೀರ್ಮಾನ ತೆಗೆದುಕೊಳ್ಳಲು ಸಹಾಯವಾಗುತ್ತದೆ.
ಎಡ್ಜ್ನಲ್ಲಿ ಸ್ಥಾಪಿಸಲು, ನಿಮ್ಮ ಬ್ರೌಸರ್ ನ ಮೇಲೆ ಬಲ ದಿಕ್ಕಿನಲ್ಲಿ ಇರುವ 'ಮೂರು ಡಾಟ್' ಮೆನು ಬಳಸಿ ಎಕ್ಸ್ಟೆಂಶನ್ ಪ್ಯಾನಲ್ ಅನ್ನು ಹುಡುಕಿರಿ. ಅಲ್ಲಿ, ಹೊಸ ಎಕ್ಸ್ಟೆಂಶನ್ ಲೋಡ್ ಮಾಡಲು 'ಲೋಡ್ ಅನ್ಪ್ಯಾಕ್ಡ್' ಆಯ್ಕೆಮಾಡಿ. ಪ್ರಾಂಪ್ಟ್ನಲ್ಲಿ 'dist' ಫೋಲ್ಡರ್ ಅನ್ನು ತೆರೆಯಿರಿ ಮತ್ತು ಎಕ್ಸ್ಟೆಂಶನ್ ಲೋಡ್ ಆಗುತ್ತದೆ. ಇದನ್ನು ಬಳಸಲು, ನಿಮಗೆ CO2 ಸಿಗ್ನಲ್ API ([ಇಮೇಲ್ ಮೂಲಕ ಇಲ್ಲಿ ಪಡೆಯಿರಿ](https://www.co2snal.com/) ಅಥವಾ ಈ ಪುಟದಲ್ಲಿ ಬಾಕ್ಸ್ನಲ್ಲಿ ನಿಮ್ಮ ಇಮೇಲ್ ನಮೂದಿಸಿ) ಮತ್ತು [ನಿಮ್ಮ ಪ್ರದೇಶಕ್ಕೆ ಕೋಡ್](http://api.electricitymap.org/v3/zones) [ಎಲೆಕ್ಟ್ರಿಸಿಟಿ ಮ್ಯಾಪ್](https://www.electricitymap.org/map) (ಉದಾಹರಣೆಗೆ, ಬೋಸ್ಟನ್ನಲ್ಲಿ ನಾನು 'US-NEISO' ಉಪಯೋಗಿಸುತ್ತೇನೆ) ಅಗತ್ಯವಿದೆ.
ಒಮ್ಮೆ API ಕೀ ಮತ್ತು ಪ್ರದೇಶದ ಎಕ್ಸ್ಟೆಂಶನ್ ಇಂಟರ್ಫೇಸ್ಗೆ ಇನ್ಪುಟ್ ಆದ ಮೇಲೆ, ಬ್ರೌಸರ್ ಎಕ್ಸ್ಟೆಂಶನ್ ಬಾರ್ನಲ್ಲಿ ಬಣ್ಣದ ಹಣ್ಣು ನಿಮ್ಮ ಪ್ರದೇಶದ انرಜಿಯ ಬಳಕೆಯನ್ನು ಪ್ರತಿಬಿಂಬಿಸುವಂತೆ ಬದಲಾಯಿಸಬೇಕು ಮತ್ತು ನಿಮಗೆ ಸೂಚಕವನ್ನು ನೀಡಬೇಕು ಇಂದ್ರಿಯ ಭಾರವಾದ ಚಟುವಟಿಕೆಗಳು ನಿಮ್ಮ ಪ್ರದರ್ಶನಕ್ಕೆ ಏನು ಸೂಕ್ತವಾಗಿವೆ ಎಂಬುದರ. ಈ 'ಹಣ್ಣು' ವ್ಯವಸ್ಥೆಯ ಹಿಂದಿನ ಆಲೋಚನೆಯನ್ನು ನನಗೆ ಕ್ಯಾಲಿಫೋರ್ನಿಯಾ ಉತ್ಸರ್ಜನೆಗಾಗಿ [ಎನರ್ಜಿ ಲಾಲಿಪೋಪ್ ಎಕ್ಸ್ಟೆಂಶನ್](https://energylollipop.com/) ನೀಡಿತ್ತು.
ತಮ್ಮ ಪ್ರದೇಶದಲ್ಲಿ ವಿದ್ಯುತ್ ಬಳಕೆಯ ತೂಕ ಎಷ್ಟು ಇದೆ ಎಂಬುದರ ನೇರವಾಗಿ ನಿಮ್ಮ ಬ್ರೌಸರ್ನಲ್ಲಿ ಸ್ಮರಣಿಕೆ ಹೊಂದಿಕೊಳ್ಳಲು ಬ್ರೌಸರಿಗಾಗಿ ವಿಸ್ತರಣೆಯನ್ನು ರಚಿಸಲು tmrow ನ Signal C02 API ಅನ್ನು ವಿದ್ಯುತ್ ಬಳಕೆಯನ್ನು ಗಮನಿಸಲು ಬಳಸಲಾಗುತ್ತದೆ. ಈ ವಿಶೇಷ ವಿಸ್ತರಣೆಯ ಬಳಕೆಯಿಂದ ಈ ಮಾಹಿತಿಗಳ ಆಧಾರದ ಮೇಲೆ ನಿಮ್ಮ ಚಟುವಟಿಕೆಗಳನ್ನು ಮೌಲ್ಯಮಾಪನ ಮಾಡಲು ಸಹಾಯ ಮಾಡುತ್ತದೆ.
Edge ನಲ್ಲಿ ಸ್ಥಾಪಿಸಲು, ಬ್ರೌಸರ್ನ ಮೇಲ್ಭಾಗದ ಬಲಭಾಗದಲ್ಲಿರುವ "ಮೂರು ಅಂಕಿಗಳು" ಮೇಳುದಾಣವನ್ನು ಬಳಸಿ ವಿಸ್ತರಣೆಗಳನ್ನು ಹುಡುಕಿ. ಈಗಾಗಲೇ ಸಕ್ರಿಯವಾಗದಿದ್ದರೆ, ಕೆಳಭಾಗದ ಎಡಕ್ಕೆಿರುವ ಡೆವಲಪರ್ ಮೋಡ್ ಅನ್ನು ಸಕ್ರಿಯಗೊಳಿಸಿ. ಹೊಸ ವಿಸ್ತರಣೆಯನ್ನು ಲೋಡ್ ಮಾಡಲು "ಅನ್ಜಿಪ್ ಮಾಡಿದ ಲೋಡ್" ಆಯ್ಕೆಮಾಡಿ. "dist" ಫೋಲ್ಡರ್ ಅನ್ನು ಪ್ರಾಂಪ್ಟ್ನಲ್ಲಿ ತೆರೆಯಿರಿ ಮತ್ತು ವಿಸ್ತರಣೆ ಲೋಡ್ ಆಗುತ್ತದೆ. ಇದನ್ನು ಬಳಸಲು, ನಿಮಗೆ CO2 Signal API ಗೆ ಒಂದು API ಕೀ ಬೇಕಾಗುತ್ತದೆ (ನೀವು [ಇಲ್ಲಿ ಇಮೇಲ್ ಮೂಲಕ ಪಡೆಯಬಹುದು](https://www.co2signal.com/) - ಈ ಪುಟದಲ್ಲಿರುವ ಪಟ್ಟಿಯನ್ನು ನಿಮ್ಮ ಇಮೇಲ್ ನೊಂದಿಗೆ ತುಂಬಿ) ಮತ್ತು [ವಿದ್ಯುತ್ ನಕ್ಷೆ](https://www.electricitymap.org/map) ಗೆ ಹೊಂದುವ [ನಿಮ್ಮ ಪ್ರादेशಿಕ ಕೋಡ್](http://api.electricitymap.org/v3/zones) ಅಗತ್ಯವಿದೆ (ಉದಾಹರಣೆಗೆ ಬೊಸ್ಟ್ನಲ್ಲಿ, "US-NEISO").
ಒಮ್ಮೆ API ಕೀ ಮತ್ತು ಪ್ರದೇಶ ವಿಸ್ತರಣೆಯ ಅಂತರ್ ಮುಖದಲ್ಲಿ ಸೇರಿಸಿದ ನಂತರ, ಬ್ರೌಸರ್ ವಿಸ್ತರಣೆಯ ಬಾರ್ ನಲ್ಲಿ ಬಣ್ಣದ ಬಿಂದು ಪ್ರದೇಶದ ವಿದ್ಯುತ್ ಬಳಕೆಯನ್ನು ಪ್ರತಿಬಿಂಬಿಸಲು ಬದಲಾಗುತ್ತದೆ ಮತ್ತು ಹೆಚ್ಚಿನ ವಿದ್ಯುತ್ ಉಪಯೋಗದ ಚಟುವಟಿಕೆಗಳನ್ನು ನಡಿಸುವುದು ಯೋಗ್ಯವೋ ಎಂಬುದರ ಸೂಚನೆ ನೀಡುತ್ತದೆ. ಈ "ಬಿಂದು" ಆಧಾರಿತ ವ್ಯವಸ್ಥೆಯ ಹಿನ್ನೆಲೆ ಸಂಯೋಜನೆಯು ಕ್ಯಾಲಿಫೋರ್ನಿಯಾದ ಉತ್ಸರ್ಗಗಳಿಗೆ арналған [ಎನೆರ್ಜೀ ಲಾಲಿಪಾಪ್ ವಿಸ್ತರಣೆ](https://energylollipop.com/) ನಿಂದ ಪಡೆದಿದೆ.
tmrow ನ C02 ಸಿಗ್ನಲ್ API ಬಳಸಿಕೊ೦ಡಿ ವಿದ್ಯುತ್ ಬಳಕೆಯ ಪರಿಶೀಲನೆಗಾಗಿ, ನಿಮ್ಮ ಪ್ರದೇಶದ ವಿದ್ಯುತ್ ಬಳಕೆ ಎಷ್ಟು ಹೆಚ್ಚು ಆಗಿದೆ ಎಂಬುದನ್ನು ಬ್ರೌಸರ್ ನಲ್ಲಿ ರೀಮೈಂಡರ್ ಆಗಿ ತೋರಿಸುವ ಬ್ರೌಸರ್ ವಿಸ್ತರಣೆಯನ್ನು ನಿರ್ಮಿಸುವುದು. ಈ ವಿಸ್ತರಣೆ ಅನ್ನು ಅಡ್ಹಾಕ್ ಆಗಿ ಬಳಸಿಕೊ೦ಡಿ, ಈ ಮಾಹಿತಿಯ ಆಧಾರದ ಮೇಲೆ ನಿಮ್ಮ ಚಟುವಟಿಕೆಗಳನ್ನು ನಿರ್ಧರಿಸಬಹುದು.
Edge ಗೆ ಇನ್ಸ್ಟಾಲ್ ಮಾಡಲು, ಬ್ರೌಸರ್ನ ಮೇಲ್ಭಾಗದ ಬಲಭಾಗದಲ್ಲಿರುವ "ಮೂರು ಬಿಂದು" ಮೆನುದಲ್ಲಿ "ವಿಸ್ತರಣೆಗಳು" ಪ್ಯಾನೆಲ್ ಅನ್ನು ಹುಡುಕಿ. ಅಲ್ಲಿ "Load Unpacked" ಆಯ್ಕೆಮಾಡಿ, ಹೊಸ ವಿಸ್ತರಣೆಯನ್ನು ಲೋಡ್ ಮಾಡಿ. ಪ್ರಾಂಪ್ಟ್ನಲ್ಲಿ "dist" ಫೋಲ್ಡರ್ ತೆರೆಯಿರಿ, ಹಾಗಾಗಿ ವಿಸ್ತರಣೆ ಲೋಡ್ ಆಗುತ್ತದೆ. ಬಳಸಲು, CO2 ಸಿಗ್ನಲ್ API ಯ API ಕೀ ([ಇಲ್ಲಿಂದ ಇಮೇಲ್ ಮೂಲಕ ಪಡೆಯಿರಿ](https://www.co2signal.com/) - ಈ ಪುಟದ ಬಾಕ್ಸಿನಲ್ಲಿ ನಿಮ್ಮ ಇಮೇಲ್ ನಮೂದಿಸಿ) ಮತ್ತು [Electricity Map](https://www.electricitymap.org/map) ನಡಿ ಹೊಂದಿಕೊಂಡಿರುವ [ನಿಮ್ಮ ಪ್ರದೇಶದ ಕೋಡ್](http://api.electricitymap.org/v3/zones) ಅಗತ್ಯವಿದೆ (ಉದಾಹರಣೆಗೆ ಬೋಸ್ಟನ್ ನಲ್ಲಿ ‘US-NEISO’ ಬಳಕೆ ಮಾಡಲಾಗುತ್ತದೆ).
API ಕೀ ಮತ್ತು ಪ್ರದೇಶವನ್ನು ವಿಸ್ತರಣೆ ಇಂಟರ್ಫೇಸಿಗೆ ನಮೂದಿಸಿದಾಗ, ಬ್ರೌಸರ್ ವಿಸ್ತರಣೆ ಬಾರ್ನಲ್ಲಿ ಬಣ್ಣದ ಡಾಟ್ ಬದಲಾಗುತ್ತದೆ, ಇದು ನಿಮ್ಮ ಪ್ರದೇಶದ انر್ಜಿ ಬಳಕೆಯನ್ನು ಪ್ರತಿಬಿಂಬಿಸುತ್ತದೆ ಮತ್ತು ಯಾವ ರೀತಿಯ انر್ಜಿ ಅವಶ್ಯಕತೆ ಇರುವ ಚಟುವಟಿಕೆಗಳನ್ನು ಮಾಡುವುದು ಸೂಕ್ತ ಎಂದು ಸೂಚಿಸುತ್ತದೆ. ಈ "ಡಾಟ್" ವ್ಯವಸ್ಥೆ ಕಲಿಫೋರ್ಮಿಯಾ ರಾಜ್ಯದ ಉಳಿತಾಯದಿಗಾಗಿ ಇರುವ [Energy Lollipop extension](https://energylollipop.com/) ನಿಂದ ನನಗೆ ದೊರೆತ ಸಂಯೋಜನೆ.
CO2 ಸಿಗ್ನಲ್ tmrow API ಬಳಸಿ ವಿದ್ಯುತ್ ಬಳಕೆಯನ್ನು ಪತ್ತೆಹಚ್ಚಲು, ನಿಮ್ಮ ಪ್ರದೇಶದ ವಿದ್ಯುತ್ ಬಳಕೆಯ ಗಂಭೀರತೆಯ ಬಗ್ಗೆ ಬ್ರೌಸರ್ನಲ್ಲಿ ಮಾಡಿದ್ದಾರೆಚ್ಚುವಿಕೆಗಳನ್ನು ಪಡೆಯಲು ಬ್ರೌಸರ್ ಎಕ್ಸ್ಟೆನ್ಷನ್ ನಿರ್ಮಿಸಿ. ಈ ಎಕ್ಸ್ಟೆನ್ಷನ್ ವಿಶೇಷವಾಗಿ ಬಳಸುವುದರಿಂದ ಈ ಮಾಹಿತಿಯನ್ನು ಆಧರಿಸಿ ನಿಮ್ಮ ಚಟುವಟಿಕೆಗಳ ಬಗ್ಗೆ ನೀವು ಸಂವೇದನೆ ಮಾಡಿಕೊಳ್ಳಲು ಸಹಾಯವಾಗುತ್ತದೆ.
Edge ನಲ್ಲಿ ಇನ್ಸ್ಟಾಲ್ ಮಾಡಲು, ಬ್ರೌಸರ್ನ ಮೇಲ್ಮೈಯಲ್ಲಿನ 'ಮೂರು ತೆಳ್ಳುವ ಗುಂಡಿಗಳು' ಮೆನುವಿನಲ್ಲಿ Sambungan ಫಲಕವನ್ನು ಹುಡುಕಿ. ಅಲ್ಲಿ, ಹೊಸ ಎಕ್ಸ್ಟೆನ್ಷನ್ ಲೋಡ್ ಮಾಡಲು 'Load Unpacked' ಆಯ್ಕೆಮಾಡಿ. 'dist' ಫೋಲ್ಡರ್ ತೆರೆಯುವ ಮೂಲಕ ಎಕ್ಸ್ಟೆನ್ಷನ್ ಲೋಡ್ ಆಗುತ್ತದೆ. ಇದನ್ನು ಬಳಸಲು, CO2 Signal APIക് ([ಇಲ್ಲಿ ಇಮೇಲ್ ಮೂಲಕ ಪಡೆಯಿರಿ](https://www.co2signal.com/) - ಈ ಪುಟದಲ್ಲಿ ನಿಮ್ಮ ಇಮೇಲ್ ನಮೂದಿಸಿ) ಮತ್ತು [ನಿಮ್ಮ ಪ್ರದೇಶದ ಕೋಡ್](http://api.electricitymap.org/v3/zones) ಅನ್ನು ಪಡೆಯಬೇಕಾಗುತ್ತದೆ, ಇದು [ElectricityMap](https://www.electricitymap.org/map) ಗೆ ಹೊಂದಿಕೊಳ್ಳುತ್ತದೆ (ಉದಾಹರಣೆಗೆ ಬೋಸ್ಟನ್ನಲ್ಲಿ, ನಾನು 'US-NEISO' ಬಳಸುತ್ತೇನೆ).
API ಕೀ ಮತ್ತು ಪ್ರದೇಶವನ್ನು ಎಕ್ಸ್ಟೆನ್ಷನ್ ಇಂಟರ್ಫೇಸ್ಗೆ ನಮೂದಿಸಿದ ನಂತರ, ಬ್ರೌಸರ್ ಎಕ್ಸ್ಟೆನ್ಷನ್ ಬಾರ್ನ ಬಣ್ಣ verandert ಕೂಡ ಆತ್ಮೀಯ ತುಂಡು ನಿಮ್ಮ ಪ್ರದೇಶದ ವಿದ್ಯುತ್ ಬಳಕೆಯನ್ನು ಪ್ರತಿಬಿಂಬಿಸುತ್ತದೆ ಮತ್ತು ನೀವು ತಗೊಂಡು ಮಾಡಿದ ಮೇಲೆ ತೂಕದ ಚಟುವಟಿಕೆಗಳಿಗೆ ಸೂಚನೆ ನೀಡುತ್ತದೆ. ಈ 'ಡಾಟ್' ವಿಧಾನದ ಆಶಯವನ್ನು [Lollipop Energy ಬೌಸರ್ ಎಕ್ಸ್ಟೆನ್ಷನ್](https://energylollipop.com/) ಕ್ಯಾಲಿಫೋರ್ನಿಯಾ ಎಮಿಷನ್ಗಳಿಗೆ ನೀಡಿ.
tmrowನ CO2 ಸಿಗ್ನಲ್ API ಬಳಸಿ ವಿದ್ಯುತ್ ಬಳಕೆಯನ್ನು ಟ್ರಾಕ್ ಮಾಡಲು, ನಿಮ್ಮ ಪ್ರದೇಶದ ವಿದ್ಯುತ್ ಬಳಕೆ ಎಷ್ಟು ಭಾರವಾಗಿದೆ ಎಂಬ ಬಗ್ಗೆ ಮುನ್ಸೂಚನೆ ನಿಮ್ಮ ಬ್ರೌಸರ್ನಲ್ಲಿ ಇರುತ್ತಂತೆ ಗಣನೆ ಮಾಡಲು ಬ್ರೌಸರ್ ವಿಸ್ತರಣೆಯನ್ನು ನಿರ್ಮಿಸಿ. ಈ ವಿಸ್ತರಣೆಯನ್ನು ಅದ್ಹಾಕ್ ಬಳಸು ನಮ್ಮ ಚಟುವಟಿಕೆಗಳ ಮೇಲೆ ಈ ಮಾಹಿತಿಯನ್ನು ಆಧಾರಿಸಿ ತೀರ್ಮಾನ ತೆಗೆದುಕೊಳ್ಳಲು ಸಹಾಯ ಮಾಡುತ್ತದೆ.
Edgeನಲ್ಲಿ ಸ್ಥಾಪಿಸಲು, ಬ್ರೌಸರ್ನ ಎಡಮುಖ ಮುಂಭಾಗದ ಮೆನು (ಮೂರು ಹೊಂಡು ಬಿಂದುಗಳು) ಬಳಸಿ 'Extensions' ಪ್ಯಾನಲ್ ಕಂಡುಹಿಡಿಯಿರಿ. ಅಲ್ಲಿ 'Load Unpacked' ಆಯ್ಕೆ ಮಾಡಿ ಹೊಸ ವಿಸ್ತರಣೆಯನ್ನು ಲೋಡ್ ಮಾಡಿ. ಪ್ರಾಂಪ್ಟ್ನಲ್ಲಿ 'dist' ಫೋಲ್ಡರ್ ತೆರೆಯಿರಿ ಮತ್ತು ವಿಸ್ತರಣೆ ಲೋಡ್ ಆಗುತ್ತದೆ. ಇದನ್ನು ಬಳಸಲು, ನಿಮಗೆ CO2 ಸಿಗ್ನಲ್ ಅವರ API ಕೀ ಬೇಕು ([ಇಮೇಲ್ ಮೂಲಕ ಇಲ್ಲಿ ಪಡೆಯಿರಿ](https://www.co2signal.com/) - ಈ ಪುಟದಲ್ಲಿರುವ ಬಾಕ್ಸಿನಲ್ಲಿ ನಿಮ್ಮ ಇಮೇಲ್ ನಮೂದಿಸಿ) ಮತ್ತು [ಈ ಭಾಗಕ್ಕೆ ಸಂಬಂಧಿಸಿದ ಕೋಡ್](http://api.electricitymap.org/v3/zones) ಬೇಕಾಗುತ್ತದೆ, ಇದು [Electricity Map](https://www.electricitymap.org/map) ಗೆ ಸಮ್ಮೇಳನವಾಗಿರುತ್ತದೆ (ಉದಾಹರಣೆಗೆ, ಬೋಸ್ತನ್ನಲ್ಲಿ ನಾನು 'US-NEISO' ಅನ್ನು ಬಳಸುತ್ತೇನೆ).
ಒಮ್ಮೆ API ಕೀ ಮತ್ತು ಪ್ರದೇಶವನ್ನು ವಿಸ್ತರಣೆ ಪರಿಪಡಿಯಲ್ಲಿ ನಮೂದಿಸಿದಾಗ, ಬ್ರೌಸರ್ ವಿಸ್ತರಣೆ ಬಾರ್ನ ಬಣ್ಣದ ಚುಕ್ಕಿ ನಿಮ್ಮ ಪ್ರದೇಶದ ಇಂಧನ ಬಳಕೆಯನ್ನು ಪ್ರತಿಬಿಂಬಿಸುವಂತೆ ಬದಲಾಗಬೇಕು ಮತ್ತು ನೀವು ಎಷ್ಟೊಂದು ಉರಿಯುವ ಚಟುವಟಿಕೆಗಳನ್ನು ಮಾಡಲು ಸೂಕ್ತವಾಗಿರುವುದನ್ನು ಸೂಚಿಸಬೇಕು. ಈ 'ಚುಕ್ಕಿ' ವ್ಯವಸ್ಥೆಯ ಆಲೋಚನೆಯನ್ನು ನನಗೆ [Energy Lollipop ವಿಸ್ತರಣೆ](https://energylollipop.com/) ದಿಂದ ನೀಡಲಾಗಿತ್ತು, ಇದು ಕ್ಯಾಲಿಫೋರ್ನಿಯಾ ಉತ್ಸರ್ಜನೆಗಳಿಗಾಗಿ.
ಕ್ಯಾನ್ವಾಸ್ ಅಂಶದಲ್ಲಿ ಬಿಡಿಸಲು, ನೀವು ಎಲ್ಲಾ ಕ್ಯಾನ್ವಾಸ್ ಗ್ರಾಫಿಕ್ಸ್ ಭಿತ್ತಿಯನ್ನು ರೂಪಿಸುವ ಮೂರು-ಹಂತ ಪ್ರಕ್ರಿಯೆಯನ್ನನುಸರಿಸಬೇಕು. ನೀವು ಇದನ್ನು ಕೆಲವು ಬಾರಿ ಮಾಡಿದರೆ, ಅದು ಸಹಜವಾಗುತ್ತದೆ:
- **ಅಂಕೆ ವ್ಯವಸ್ಥೆ**: ಪ್ರತಿ ನಷ್ಟಪಡಿಸಿದ ಶತ್ರು ನೌಕೆಗೆ 100 ಅಂಕೆಗಳು (ಮೂರು ಶಾಸಕರ ಸಂಖ್ಯೆಗಳನ್ನು ذهنದಲ್ಲಿಟ್ಟುಕೊಳ್ಳುವುದು ಸುಲಭ). ಅಂಕೆಯನ್ನು ಕೆಳಗಡೆಯ ಎಡಬದಿಯಲ್ಲಿ ತೋರಿಸಲಾಗುತ್ತದೆ.
- **ಜೀವಗಳ ಗಣಕ**: ನಿಮ್ಮ ಹೀರೋ 3 ಜೀವಗಳಿಂದ ಆರಂಭವಾಗುತ್ತಾನೆ - ಪ್ರಾರಂಭಿಕ ಆರ್ಕೇಡ್ ಆಟಗಳಿಂದ ಸ್ಥಾಪಿತ ಮಾನದಂಡ, ಇದು ಸವಾಲು ಮತ್ತು ಆಡಲು ಅನುಕೂಲ ಎಂಬ ಸಮತೋಲನವನ್ನು ನೀಡುತ್ತದೆ. ಪ್ರತಿ ಶತ್ರು ಜೊತೆ ಸಂಭವಿಸುವ ಅಧಿಕಾರವು ಒಂದು ಜೀವವನ್ನು ಕಡಿಮೆ ಮಾಡುತ್ತದೆ. ಬಾಕಿ ಜೀವಗಳನ್ನು ನಾವು ಕೆಳಗಡೆಯ ಬಲಭಾಗದಲ್ಲಿ ನೌಕಾ ಐಕಾನ್ಗಳ ಮೂಲಕ ತೋರಿಸುತ್ತೇವೆ .
- **ಜೀವಗಳ ಗಣಕ**: ನಿಮ್ಮ ಹೀರೋ 3 ಜೀವಗಳಿಂದ ಆರಂಭವಾಗುತ್ತಾನೆ - ಪ್ರಾರಂಭಿಕ ಆರ್ಕೇಡ್ ಆಟಗಳಿಂದ ಸ್ಥಾಪಿತ ಮಾನದಂಡ, ಇದು ಸವಾಲು ಮತ್ತು ಆಡಲು ಅನುಕೂಲ ಎಂಬ ಸಮತೋಲನವನ್ನು ನೀಡುತ್ತದೆ. ಪ್ರತಿ ಶತ್ರು ಜೊತೆ ಸಂಭವಿಸುವ ಅಧಿಕಾರವು ಒಂದು ಜೀವವನ್ನು ಕಡಿಮೆ ಮಾಡುತ್ತದೆ. ಬಾಕಿ ಜೀವಗಳನ್ನು ನಾವು ಕೆಳಗಡೆಯ ಬಲಭಾಗದಲ್ಲಿ ನೌಕಾ ಐಕಾನ್ಗಳ ಮೂಲಕ ತೋರಿಸುತ್ತೇವೆ .
`history.pushState` ಬಳಕೆ ಬ್ರೌಸರ್ ನ ನ್ಯಾವಿಗೇಶನ್ ಇತಿಹಾಸದಲ್ಲಿ ಹೊಸ ದಾಖಲೆಗಳನ್ನು ಸೃಷ್ಟಿಸುತ್ತದೆ. ನೀವು ಇದನ್ನು ಪರೀಕ್ಷಿಸಲು ಬ್ರೌಸರ್ನ ಹಿಂಬದಿ ಬಟನ್ ಒತ್ತಿ ಹಿಡಿದುಕೊಳ್ಳಬಹುದು, ಇದರಲ್ಲಿ ಹೀಗೆ ಕಾಣಬಹುದು:


ಹಿಂಬದಿ ಬಟನ್ ಮೇಲೆ ಕೆಲವೊಮ್ಮೆ ಕ್ಲಿಕ್ ಮಾಡಿದರೆ, ಪ್ರಸ್ತುತ URL ಬದಲಾಗುತ್ತದೆ ಮತ್ತು ಇತಿಹಾಸ ನವೀಕರಿಸಲಾಗುತ್ತದೆ, ಆದರೆ ಅದೇ ಟೆಂಪ್ಲೇಟ್ ಪ್ರದರ್ಶನವಾಗುತ್ತಿರುತ್ತದೆ.
2. ನಿಮ್ಮ ಬ್ರೌಸರ್ ವಿಳಾಸ ಪಟ್ಟಿಯಲ್ಲಿ ಬದಲಾವಣೆಗಳನ್ನು ಗಮನಿಸಿ
3. ಪುಟ ಮರುಭರ್ತಿ ಆಗುವುದು ಮತ್ತು URL ನಲ್ಲಿ ಡೇಟಾ ಕಾಣಿಸುವುದು ಗಮನಿಸಿ


### HTTP ವಿಧಾನಗಳ ಹೋಲಿಕೆ
@ -346,7 +346,7 @@ graph TD
2. **"ಖಾತೆ ರಚಿಸಿ" ಬಟನ್ ಕ್ಲಿಕ್ ಮಾಡಿ**
3. **ಬ್ರೌಸರ್ನಲ್ಲಿ ಸರ್ವರ್ ಪ್ರತಿಕ್ರಿಯೆಯನ್ನು ಗಮನಿಸಿ**


**ನೀವು ಕಂಡುಕೊಳ್ಳಬೇಕಾದುದು:**
- **ಬ್ರೌಸರ್ API ಅಂತಿಮ ಬಿಂದುವಿಗೆ पुनರ್ನಿರ್ದೇಶನ ಮಾಡುತ್ತದೆ**
@ -609,7 +609,7 @@ async function register() {
3. **"ಖಾತೆ ರಚಿಸಿ" ಮೇಲೆ ಕ್ಲಿಕ್ ಮಾಡಿ**
4. **ಕನ್ಸೋಲ್ ಸಂದೇಶಗಳು ಮತ್ತು ಬಳಕೆದಾರ ಪ್ರತಿಕ್ರಿಯೆಯನ್ನು ಗಮನಿಸಿ**


**ನೀವು ಕಾಣಬೇಕಾದದ್ದು:**
- **ಸಲ್ಲಿಸುವ ಬಟನ್ ಮೇಲೆ ಲೋಡಿಂಗ್ ಸ್ಥಿತಿಯನ್ನು ಕಾಣಬಹುದು**
@ -783,7 +783,7 @@ input:focus:invalid {
3. **ಬಳಕೆದಾರನಾಮ ಕ್ಷೇತ್ರದಲ್ಲಿ ವಿಶೇಷ ಅಕ್ಷರಗಳನ್ನು ಬಳಸಿ ಬಾರಿ ಮಾಡಿ**
4. **ಋಣಾತ್ಮಕ ಬ್ಯಾಲೆನ್ಸ್ ಮೊತ್ತ ನಮೂದಿಸಿ**


**ನೀವು ಗಮನಿಸುವುದು:**
- **ಬ್ರೌಸರ್ ಮೂಲ ಮಾನ್ಯತಾ ಸಂದೇಶಗಳನ್ನು ತೋರಿಸುತ್ತದೆ**
@ -943,7 +943,7 @@ timeline
ಕೊನೆಗಿನ ಲಾಗಿನ್ ಪುಟವು ಕೆಲವು ಸ್ಟೈಲಿಂಗ್ ನಂತರ ಹೇಗಿರಬಹುದು ಎಂಬ ಉದಾಹರಣೆ ಇಲ್ಲಿದೆ:


ಈ ಅಸೈನ್ಮೆಂಟ್ ಪೂರ್ಣಗೊಳಿಸಿದ ನಂತರ, ನಿಮ್ಮ ಬ್ಯಾಂಕಿಂಗ್ ಅಪ್ಲಿಕೇಶನ್ ಪರಿಪೂರ್ಣವಾಗಿ ಕೆಲಸ ಮಾಡುವ "ಲೆನದ ಪತ್ರ ಸೇರಿಸಿ" ವೈಶಿಷ್ಟ್ಯವನ್ನು ಹೊಂದಿರುತ್ತದೆ, ವೃತ್ತಿಪರವಾಗಿ ಕಾಣುವುದು ಮತ್ತು ನಡೆದುಕೊಳ್ಳುವುದು:


ಈ ಯೋಜನೆಯಲ್ಲಿ, ನೀವು ಒಂದು ಕಲ್ಪಿತ ಬ್ಯಾಂಕನ್ನು ಹೇಗೆ ನಿರ್ಮಿಸಬೇಕು ಎಂಬುದನ್ನು ಕಲಿಯೋಿರಿ. ಇವುಗಳಲ್ಲಿ ವೆಬ್ ಅಪ್ಲಿಕೇಶನ್ ವಿನ್ಯಾಸಗೊಳಿಸುವುದು ಮತ್ತು ಮಾರ್ಗಗಳನ್ನು ಒದಗಿಸುವುದು, ಫಾರ್ಮ್ಗಳನ್ನು ನಿರ್ಮಿಸುವುದು, ಸ್ಥಿತಿಯನ್ನು ನಿರ್ವಹಿಸುವುದು, ಮತ್ತು ಬ್ಯಾಂಕಿನ ಡೇಟಾವನ್ನು ಪಡೆಯಲು API ಯಿಂದ ಡೇಟಾವನ್ನು ಎങ്ങനെ ಪಡೆಯಬೇಕು ಎಂಬುದು ಸೇರಿವೆ.
@ -182,7 +182,7 @@ VSCode.dev ಈ ಸಾಮರ್ಥ್ಯಗಳನ್ನು ನಿಮ್ಮ ಬ್
ಎಲ್ಲವೂ ಲೋಡ್ ಆದ ಮೇಲೆ, ನೀವು ಅತ್ಯಂತ ಸ್ವಚ್ಛ ಕೆಲಸದ ಜಾಗವನ್ನು ನೋಡುತ್ತೀರಿ, ಅದು ನೀವು ಮಹತ್ವಪೂರ್ಣವಾಗಿ ಕಾಣುವದಕ್ಕೆ — ನಿಮ್ಮ ಕೋಡಿಗೆ — ಗಮನ ಸೆಳೆಯುವಂತೆ ವಿನ್ಯಾಸಗೊಳಿಸಲಾಗಿದೆ!
- **ಕ್ರಿಯಾಶೀಲತೆ ಬಾರ್** (ಎಡಬದಿಯಲ್ಲಿ ಇರುವ ಪದ್ಧತಿ): Explorer 📁, Search 🔍, Source Control 🌿, Extensions 🧩, Settings ⚙️ ಇದನ್ನು ಹೊಂದಿರುವ ನಿಮ್ಮ ಮುಖ್ಯ ನವಿಗೇಶನ್
@ -229,7 +229,7 @@ flowchart TB
1. ನೀವು ಇಲ್ಲಿಗಾಗಿಲ್ಲವಾದರೆ, [vscode.dev](https://vscode.dev) ಗೆ ಹೋಗಿ
2. ಸ್ವಾಗತ ಪರದೆಯಲ್ಲಿ “Open Remote Repository” ಬಟನ್ ನೋಡಿ클ಿಕ್ ಮಾಡಿ
✅ **ಯಶಸ್ಸಿನ ಸೂಚನೆ**: ಎಕ್ಸ್ಪ್ಲೋರರ್ ಸೈಡ್ಬಾರ್ನಲ್ಲಿ ನಿಮ್ಮ ಪ್ರಾಜೆಕ್ಟ್ ಫೈಲುಗಳು ಮತ್ತು `index.html` ಮುಖ್ಯ ಸಂಪಾದಕ ಪ್ರದೇಶದಲ್ಲಿ ತೋರಬೇಕು.


**ಇಂಟರ್ಫೇಸ್ನಲ್ಲಿ ನೀವು ಕಾಣುವವು:**
- **ಎಕ್ಸ್ಪ್ಲೋರರ್ ಸೈಡ್ಬಾರ್**: ರೆಪೊ ಫೈಲುಗಳು ಮತ್ತು ಫೋಲ್ಡರ್ ರಚನೆಯನ್ನು ತೋರಿಸುತ್ತದೆ
@ -448,7 +448,7 @@ li:before {
**ಸ್ಥಾಪನೆಯಾದ ನಂತರ ತಕ್ಷಣದ ಫಲಿತಾಂಶಗಳು:**
CodeSwing ಸ್ಥಾಪಿತವಾದ ಮೇಲೆ, ನಿಮ್ಮ ಸಂಪಾದಕದಲ್ಲಿ ನಿಮಗೆ ನಿಮ್ಮ ರೆಜ್ಯೂಮ್ ವೆಬ್ಸೈಟಿನ ಲೈವ್ ಪ್ರಿವ್ಯೂ ತೋರಿಸಲಾಗುತ್ತದೆ. ಇದು ನೀವು ಮಾಡಿದ ಬದಲಾವಣೆಗಳನ್ನು ತಕ್ಷಣ ಹೇಗಿರುವುದೆಂದು ನೋಡಲು ಸಹಾಯ ಮಾಡುತ್ತದೆ.


**ಮೇಲ್ನೋಟ ಹೊಂದಿದ ಇಂಟರ್ಫೇಸ್ ಅರ್ಥಮಾಡಿಕೊಳ್ಳಿ:**
- ** ಸ್ಪ್ಲಿಟ್ ವೀಕ್ಷಣೆ**: ಒಂದೊಂದರ ಬದಿಯಲ್ಲಿ ನಿಮ್ಮ ಕೋಡ್ ಮತ್ತು ಮತ್ತೊಂದರ ಬದಿಯಲ್ಲಿ ಲೈವ್ ಪ್ರಿವ್ಯೂ


## 🗺️ AI ಅಪ್ಲಿಕೇಶನ್ ಅಭಿವೃದ್ಧಿಯ ಮೂಲಕ ನಿಮ್ಮ ಕಲಿಕೆಯ ಪ್ರಯಾಣ
@ -189,7 +189,7 @@ mindmap
```
**ಮೂಲತತ್ವ**: AI ಅಪ್ಲಿಕೇಶನ್ ಅಭಿವೃದ್ಧಿ ಸಾಂಪ್ರದಾಯಿಕ ವೆಬ್ ಅಭಿವೃದ್ಧಿ ಕೌಶಲ್ಯಗಳನ್ನು AI ಸೇವೆಗಳ ಇಂಟಿಗ್ರೇಶನ್ ಜೊತೆಗೆ ಸಂಯೋಜಿಸಿ ಬಳಕೆದಾರರಿಗೆ ಸಹಜ ಮತ್ತು ಸ್ಪಂದನಶೀಲ ಬಗೆಯ ಅಪ್ಲಿಕೇಶನ್ಗಳನ್ನು ರಚಿಸುತ್ತದೆ.


**ಪ್ಲೇಗ್ರೌಂಡ್ ಉಪಕಾರ ಮಾಡುವ ಕೆಲವು ಅಂಶಗಳು:**
- GPT-4o-mini, Claude ಮತ್ತು ಇತರ ವಿವಿಧ AI ಮಾದರಿಗಳನ್ನು ಪ್ರಯತ್ನಿಸಿ (ಎಲ್ಲವೂ ಉಚಿತ!)
@ -199,7 +199,7 @@ mindmap
ಸ್ವಲ್ಪ ಪ್ರಯೋಗಮಾಡಿದ ಮೇಲೆ "Code" ಟ್ಯಾಬ್ ಕ್ಲಿಕ್ ಮಾಡಿ ಪ್ರೋಗ್ರಾಮಿಂಗ್ ಭಾಷೆಯನ್ನು ಆಯ್ಕೆಮಾಡಿ ಅವಶ್ಯವಾದ ಜಾರಿಗೆ ಕೋಡ್ ಪಡೆಯಿರಿ.


오늘은 최신 웹 개발을 가능하게 할 뿐 아니라 정말 중독성 강한 놀라운 도구들을 탐험할 거예요. 넷플릭스, 스포티파이, 좋아하는 인디 앱 스튜디오의 개발자들이 매일 같이 쓰는 똑같은 편집기, 브라우저, 작업 흐름들을 말이죠. 그리고 여러분이 춤추게 만들 부분: 이 전문적인 수준의 산업 표준 도구들 대부분이 완전 무료라는 사실이에요!
함께 한 걸음씩 천천히 배워 나가 보겠습니다. 서두르지 않고, 압박감 없이 – 여러분과 저, 그리고 여러분의 새 친구가 될 몇 가지 멋진 도구들만 있을 거예요!


> Sketchnote by [Tomomi Imura](https://twitter.com/girlie_mac)
```mermaid
@ -605,7 +605,7 @@ flowchart TD
✅ '초보자 친화적인' 저장소를 찾는 좋은 방법은 [‘good-first-issue’ 태그로 검색하기](https://github.blog/2020-01-22-browse-good-first-issues-to-start-contributing-to-open-source/)입니다.


코드를 복사하는 방법은 여러 가지가 있습니다. 한 가지 방법은 저장소 내용을 HTTPS, SSH, 또는 GitHub CLI(명령줄 인터페이스)를 사용하여 "clone"하는 것입니다.
HTML 또는 하이퍼텍스트 마크업 언어는 여러분이 방문한 모든 웹사이트의 기반입니다. HTML을 웹 페이지에 구조를 부여하는 골격으로 생각해보세요. 어떤 콘텐츠가 어디에 배치되고, 어떻게 조직되며, 각 부분이 무엇을 의미하는지 정의합니다. CSS는 나중에 HTML에 색상과 레이아웃을 입히고, JavaScript는 상호작용을 통해 생명을 불어넣지만, HTML은 모든 것을 가능하게 하는 필수적인 구조를 제공합니다.
@ -86,7 +86,7 @@ HTML 코드를 작성하기 전에 테라리움 프로젝트를 위한 적절한
4. 탐색기 창에서 "새 파일" 아이콘을 클릭합니다.
5. 파일명을 `index.html`로 지정합니다.


**옵션 2: 터미널 명령어 사용하기**
```bash
@ -236,48 +236,48 @@ HTML에 이미지를 추가하기 전에 프로젝트 파일을 적절히 정리
웹 개발에서 가장 흥미로운 부분 중 하나에 오신 것을 환영합니다 - 바로 인터랙션 구현입니다! 문서 객체 모델(DOM)은 HTML과 JavaScript 사이의 다리와 같으며, 오늘은 이를 이용해 테라리움을 생동감 있게 만들어 보겠습니다. 팀 버너스리(Tim Berners-Lee)가 최초의 웹 브라우저를 만들었을 때, 문서가 동적이고 상호작용 가능할 수 있는 웹을 꿈꿨습니다 - DOM이 그 비전을 실현하게 합니다.
> DOM과 이를 참조하는 HTML 마크업의 표현. 출처: [Olfa Nasraoui](https://www.researchgate.net/publication/221417012_Profile-Based_Focused_Crawler_for_Social_Media-Sharing_Websites)
@ -146,7 +146,7 @@ flowchart LR
```
> 💡 **클로저 이해하기**: 클로저는 JavaScript에서 중요한 주제로, 많은 개발자들이 제대로 이해하기까지 오랜 시간이 걸립니다. 오늘은 실용적 적용에 집중할 것입니다 - 인터랙티브 기능을 구현하면서 클로저가 자연스럽게 등장하는 모습을 보게 될 것입니다. 문제를 해결하는 방식을 통해 이해가 깊어질 것입니다.
> DOM과 이를 참조하는 HTML 마크업의 표현. 출처: [Olfa Nasraoui](https://www.researchgate.net/publication/221417012_Profile-Based_Focused_Crawler_for_Social_Media-Sharing_Websites)
> ⚠️ **보안 고려사항**: 실제 애플리케이션에서는 로컬 스토리지에 API 키를 저장하는 것이 위험할 수 있습니다. JavaScript가 이 데이터를 접근할 수 있기 때문입니다. 학습 목적에는 적합하지만 실제 앱은 민감한 자격 증명을 서버 측 안전 저장소에 보관해야 합니다.
@ -123,7 +123,7 @@ Edge에서 개발자 도구를 열려면, 오른쪽 상단의 점 세 개를 클
해봅시다. 웹사이트(예: Microsoft.com)를 열고 'Record' 버튼을 클릭하세요. 이제 페이지를 새로 고침하고 프로파일러가 발생하는 모든 작업을 캡처하는 것을 지켜보세요. 녹화를 중단하면 브라우저가 사이트를 '스크립트', '렌더링', '페인팅' 하는 세부 분석 결과를 볼 수 있습니다. 이는 우주선 발사 시 미션 컨트롤이 모든 시스템을 모니터링하는 것과 비슷합니다 - 무엇이 언제 어떻게 일어나는지 실시간 데이터를 얻습니다.
- **점수 시스템**: 파괴된 적 우주선마다 100점을 부여합니다 (라운드 숫자가 플레이어가 생각하기에 더 쉽습니다). 점수는 왼쪽 아래 모서리에 표시합니다.
- **생명 카운터**: 주인공은 세 개의 생명으로 시작합니다 - 초기 아케이드 게임이 도전과 플레이 가능성을 균형 맞춘 표준입니다. 적과 충돌할 때마다 한 생명이 줄어듭니다. 남은 생명은 오른쪽 아래 모서리에 우주선 아이콘으로 표시합니다 .
- **생명 카운터**: 주인공은 세 개의 생명으로 시작합니다 - 초기 아케이드 게임이 도전과 플레이 가능성을 균형 맞춘 표준입니다. 적과 충돌할 때마다 한 생명이 줄어듭니다. 남은 생명은 오른쪽 아래 모서리에 우주선 아이콘으로 표시합니다 .


## 🗺️ AI 애플리케이션 개발을 통한 학습 여정
@ -189,7 +189,7 @@ mindmap
```
**핵심 원칙**: AI 애플리케이션 개발은 전통적인 웹 개발 기술과 AI 서비스 통합을 결합해 자연스럽고 반응성 높은 지능형 애플리케이션을 만듭니다.


**플레이그라운드의 유용함 요점:**
- GPT-4o-mini, Claude 등 무료로 다양한 AI 모델 사용해보기
@ -199,7 +199,7 @@ mindmap
조금 놀아본 뒤 “Code” 탭을 클릭하고 구현할 프로그래밍 언어를 선택해 필요한 코드를 얻으세요.


## Python 백엔드 통합 설정하기
@ -2351,14 +2351,14 @@ mindmap
- [Web Dev For Beginners repository](https://github.com/microsoft/Web-Dev-For-Beginners)로 이동
- 우측 상단에서 "Use this template" 클릭 (GitHub 로그인 필요)


**2단계: Codespaces 실행**
- 새로 만든 저장소 열기
- 초록색 "Code" 버튼 클릭 후 "Codespaces" 선택
- "Create codespace on main" 선택하여 개발 환경 시작


@ -17,7 +17,7 @@ Sveikas, būsimasis kūrėjau! 👋 Ar galiu tau pasakyti kažką, kas vis dar k
Šiandien pažvelgsime į neįtikėtinas priemones, kurios daro šiuolaikinį žiniatinklio kūrimą ne tik įmanomu, bet ir labai priklausomybę sukeliančiu užsiėmimu. Kalbu apie tuos pačius redaktorius, naršykles ir darbo eigas, kuriomis kasdien naudojasi kūrėjai Netflix, Spotify bei tavo mėgstamoje nepriklausomoje programėlių studijoje. Ir štai kas privers tave šokti iš džiaugsmo: dauguma šių profesionalių, pramonės standartų įrankių yra visiškai nemokami!
@ -17,7 +17,7 @@ Sveikas, būsimasis programuotojau! 👋 Pasiruošęs prisijungti prie milijonų
Mes šią kelionę eisime kartu, žingsnis po žingsnio. Jokio skubėjimo, jokio spaudimo – tik tu, aš ir keli labai šaunūs įrankiai, kurie netrukus taps tavo naujais geriausiais draugais!


> Sketchnote autorius [Tomomi Imura](https://twitter.com/girlie_mac)
```mermaid
@ -604,7 +604,7 @@ Pirmiausia raskime GitHub atviro kodo repozitoriją, kuri jus domina ir prie kur
✅ Geras būdas rasti „pradedantiesiems draugiškus“ repozitorijus yra [paieška pagal žymą 'good-first-issue'](https://github.blog/2020-01-22-browse-good-first-issues-to-start-contributing-to-open-source/).


> Sketchnote autorius [Tomomi Imura](https://twitter.com/girlie_mac)
HTML arba HyperText Markup Language yra kiekvieno jūsų lankyto interneto svetainės pagrindas. Galvokite apie HTML kaip apie skeletą, kuris suteikia struktūrą tinklalapiams – jis apibrėžia, kur dedamas turinys, kaip jis organizuotas ir ką kiekvienas elementas reiškia. Nors CSS vėliau „papuoš“ jūsų HTML spalvomis ir išdėstymu, o JavaScript suteiks jam gyvybės su interaktyvumu, HTML suteikia būtiną struktūrą, dėl kurios visa kita tampa įmanoma.
@ -86,7 +86,7 @@ Sukursite atskirą aplanką savo terariumo projektui ir pridėsite pirmąjį HTM
4. „Explorer“ lange spauskite „New File“ ikoną
5. Pavadinkite savo failą `index.html`


**Variantas 2: Naudojant terminalo komandas**
```bash
@ -236,48 +236,48 @@ Dabar pridėkite augalų paveikslėlius, organizuotus dviejuose stulpeliuose tar
✅ **Eksperimentas**: Išbandyk nustatyti kitas paveldimas savybes ant `<body>`, kaip `color`, `line-height` arba `text-align`. Kas nutinka tavo antraštei ir kitiems elementams?
@ -332,7 +332,7 @@ Mūsų terrariume kiekvienam augalui reikia panašaus stilizavimo, bet kartu kie
**Štai HTML struktūra kiekvienam augalui:**
```html
<divclass="plant-holder">
<imgclass="plant"alt="Decorative plant for terrarium"id="plant1"src="../../../../translated_images/plant1.d18b18ffe73da18f.lt.png" />
<imgclass="plant"alt="Decorative plant for terrarium"id="plant1"src="../../../../translated_images/lt/plant1.d18b18ffe73da18f.png" />
</div>
```
@ -594,7 +594,7 @@ Pasiruošę pagerinti savo terrariumą realistiškais stiklo atspindžiais? Ši
Kursite subtilius šviesos žiburius, imituojančius, kaip šviesa atsispindi nuo stiklo paviršių. Šis būdas panašus į tai, kaip Renesanso tapytojai, pvz., Jan van Eyck, naudojo šviesą ir atspindžius, kad nudažytas stiklas atrodytų trimatis. Štai ko siekiate: