PostgreSQL के लिए Cloud SQL की मदद से, Cloud Run में फ़ुल स्टैक JavaScript ऐप्लिकेशन को डिप्लॉय करना

1. खास जानकारी

Cloud Run एक ऐसा प्लैटफ़ॉर्म है जिसे पूरी तरह से मैनेज किया जाता है. इसकी मदद से, अपने कोड को सीधे Google के स्केलेबल इन्फ़्रास्ट्रक्चर पर चलाया जा सकता है. इस कोडलैब में, Cloud Run पर मौजूद Next.js ऐप्लिकेशन को PostgreSQL डेटाबेस के लिए Cloud SQL से कनेक्ट करने का तरीका बताया गया है.

इस लैब में, आपको ये काम करने का तरीका पता चलेगा:

  • Private Service Connect का इस्तेमाल करने के लिए कॉन्फ़िगर किया गया, PostgreSQL के लिए Cloud SQL इंस्टेंस बनाएं
  • Cloud Run पर ऐसा ऐप्लिकेशन डिप्लॉय करना जो आपके Cloud SQL डेटाबेस से कनेक्ट हो
  • अपने ऐप्लिकेशन में फ़ंक्शन जोड़ने के लिए, Gemini Code Assist का इस्तेमाल करना

2. ज़रूरी शर्तें

  1. अगर आपके पास पहले से कोई Google खाता नहीं है, तो आपको Google खाता बनाना होगा.
    • ऑफ़िस या स्कूल वाले खाते के बजाय, निजी खाते का इस्तेमाल करें. ऑफ़िस और स्कूल वाले खातों पर ऐसी पाबंदियां हो सकती हैं जिनकी वजह से, इस लैब के लिए ज़रूरी एपीआई चालू नहीं किए जा सकते.

3. प्रोजेक्ट सेटअप करना

  1. Google Cloud Console में साइन इन करें.
  2. Cloud Console में बिलिंग चालू करें.
    • इस लैब को पूरा करने के लिए, Cloud के संसाधनों पर 1 डॉलर से कम खर्च करना पड़ेगा.
    • आगे कोई शुल्क न देना हो, तो इस लैब के आखिर में दिए गए तरीके का इस्तेमाल करके संसाधन मिटाएं.
    • नए उपयोगकर्ताओं को 300 डॉलर का मुफ़्त में आज़माने की सुविधा मिलती है.
  3. नया प्रोजेक्ट बनाएं या किसी मौजूदा प्रोजेक्ट का फिर से इस्तेमाल करें.

4. Cloud Shell एडिटर खोलना

  1. Cloud Shell एडिटर पर जाएं
  2. अगर टर्मिनल, स्क्रीन पर सबसे नीचे नहीं दिखता है, तो उसे खोलें:
    • हैमबर्गर मेन्यू हैमबर्गर मेन्यू का आइकॉन पर क्लिक करें
    • Terminal पर क्लिक करें
    • नया टर्मिनल पर क्लिक करेंCloud Shell एडिटर में नया टर्मिनल खोलना
  3. टर्मिनल में, इस कमांड की मदद से अपना प्रोजेक्ट सेट करें:
    • फ़ॉर्मैट:
      gcloud config set project [PROJECT_ID]
    • उदाहरण:
      gcloud config set project lab-project-id-example
    • अगर आपको अपना प्रोजेक्ट आईडी याद नहीं है, तो:
      • अपने सभी प्रोजेक्ट आईडी की सूची देखने के लिए:
        gcloud projects list | awk '/PROJECT_ID/{print $2}'
      Cloud Shell Editor टर्मिनल में प्रोजेक्ट आईडी सेट करना
  4. अगर आपसे अनुमति देने के लिए कहा जाए, तो जारी रखने के लिए अनुमति दें पर क्लिक करें. Cloud Shell को अनुमति देने के लिए क्लिक करें
  5. आपको यह मैसेज दिखेगा:
    Updated property [core/project].
    अगर आपको WARNING दिखता है और आपसे Do you want to continue (Y/N)? पूछा जाता है, तो हो सकता है कि आपने प्रोजेक्ट आईडी गलत डाला हो. N दबाएं, Enter दबाएं, और gcloud config set project कमांड को फिर से चलाने की कोशिश करें.

5. एपीआई चालू करें

टर्मिनल में, एपीआई चालू करें:

gcloud services enable \
  compute.googleapis.com \
  sqladmin.googleapis.com \
  run.googleapis.com \
  artifactregistry.googleapis.com \
  cloudbuild.googleapis.com \
  networkconnectivity.googleapis.com \
  servicenetworking.googleapis.com \
  cloudaicompanion.googleapis.com

अगर आपसे अनुमति देने के लिए कहा जाए, तो जारी रखने के लिए अनुमति दें पर क्लिक करें. Cloud Shell को अनुमति देने के लिए क्लिक करें

इस निर्देश को पूरा होने में कुछ मिनट लग सकते हैं. हालांकि, आखिर में आपको इस तरह का मैसेज दिखेगा:

Operation "operations/acf.p2-73d90d00-47ee-447a-b600" finished successfully.

6. सेवा खाता सेट अप करना

Cloud Run का इस्तेमाल करने के लिए, Google Cloud सेवा खाता बनाएं और कॉन्फ़िगर करें, ताकि उसके पास Cloud SQL से कनेक्ट करने की सही अनुमतियां हों.

  1. नया सेवा खाता बनाने के लिए, gcloud iam service-accounts create कमांड को इस तरह चलाएं:
    gcloud iam service-accounts create quickstart-service-account \
  --display-name="Quickstart Service Account"
  2. आपने जो Google Cloud सेवा खाता अभी बनाया है उसमें लॉग लेखक की भूमिका जोड़ने के लिए, gcloud projects add-iam-policy-binding कमांड को इस तरह चलाएं.
    gcloud projects add-iam-policy-binding ${GOOGLE_CLOUD_PROJECT} \
  --member="serviceAccount:quickstart-service-account@${GOOGLE_CLOUD_PROJECT}.iam.gserviceaccount.com" \
  --role="roles/logging.logWriter"

7. Cloud SQL इंस्टेंस बनाना

  1. Private Service Connect की मदद से, Cloud Run से Cloud SQL को नेटवर्क से कनेक्ट करने की अनुमति देने के लिए, सेवा कनेक्शन की नीति बनाएं
    gcloud network-connectivity service-connection-policies create quickstart-policy \
    --network=default \
    --project=${GOOGLE_CLOUD_PROJECT} \
    --region=us-central1 \
    --service-class=google-cloud-sql \
    --subnets=https://www.googleapis.com/compute/v1/projects/${GOOGLE_CLOUD_PROJECT}/regions/us-central1/subnetworks/default
  2. अपने डेटाबेस के लिए यूनीक पासवर्ड जनरेट करना
    export DB_PASSWORD=$(openssl rand -base64 20)
  3. Cloud SQL इंस्टेंस बनाने के लिए, gcloud sql instances create कमांड चलाएं
    gcloud sql instances create quickstart-instance \
    --project=${GOOGLE_CLOUD_PROJECT} \
    --root-password=${DB_PASSWORD} \
    --database-version=POSTGRES_17 \
    --tier=db-perf-optimized-N-2 \
    --region=us-central1 \
    --ssl-mode=ENCRYPTED_ONLY \
    --no-assign-ip \
    --enable-private-service-connect \
    --psc-auto-connections=network=projects/${GOOGLE_CLOUD_PROJECT}/global/networks/default

इस निर्देश को पूरा होने में कुछ मिनट लग सकते हैं.

  1. quickstart-instance में Cloud SQL डेटाबेस बनाने के लिए, gcloud sql databases create कमांड चलाएं. 
    gcloud sql databases create quickstart_db \
  --instance=quickstart-instance

8. आवेदन तैयार करना

एचटीटीपी अनुरोधों का जवाब देने वाला Next.js ऐप्लिकेशन तैयार करें.

  1. task-app नाम का नया Next.js प्रोजेक्ट बनाने के लिए, इस निर्देश का इस्तेमाल करें:
    npx create-next-app@15.0.3 task-app \
  --ts \
  --eslint \
  --tailwind \
  --no-src-dir \
  --turbopack \
  --app \
  --no-import-alias
  2. अगर आपसे create-next-app इंस्टॉल करने के लिए कहा जाए, तो आगे बढ़ने के लिए Enter दबाएं:
    Need to install the following packages:
create-next-app@15.0.3
Ok to proceed? (y)
  3. डायरेक्ट्री को task-app में बदलने के लिए:
    cd task-app
  4. PostgreSQL डेटाबेस के साथ इंटरैक्ट करने के लिए, pg इंस्टॉल करें.
    npm install pg
  5. TypeScript Next.js ऐप्लिकेशन का इस्तेमाल करने के लिए, @types/pg को डेवलपर डिपेंडेंसी के तौर पर इंस्टॉल करें.
    npm install --save-dev @types/pg
  6. actions.ts फ़ाइल बनाएं.
    touch app/actions.ts
  7. Cloud Shell Editor में actions.ts फ़ाइल खोलें:
    cloudshell edit app/actions.ts
    अब स्क्रीन के सबसे ऊपर एक खाली फ़ाइल दिखेगी. यहां इस actions.ts फ़ाइल में बदलाव किया जा सकता है. स्क्रीन के सबसे ऊपर वाले सेक्शन में कोड दिखाएं
  8. नीचे दिया गया कोड कॉपी करके, खोली गई actions.ts फ़ाइल में चिपकाएं:
    'use server'
import pg from 'pg';

type Task = {
  id: string;
  title: string;
  status: 'IN_PROGRESS' | 'COMPLETE';
};

const { Pool } = pg;

const pool = new Pool({
  host: process.env.DB_HOST,
  user: process.env.DB_USER,
  password: process.env.DB_PASSWORD,
  database: process.env.DB_NAME,
  ssl: {
    // @ts-expect-error require true is not recognized by @types/pg, but does exist on pg
    require: true,
    rejectUnauthorized: false, // required for self-signed certs
    // https://node-postgres.com/features/ssl#self-signed-cert
  }
});

const tableCreationIfDoesNotExist = async () => {
  await pool.query(`CREATE TABLE IF NOT EXISTS visits (
    id SERIAL NOT NULL,
    created_at timestamp NOT NULL,
    PRIMARY KEY (id)
  );`);
  await pool.query(`CREATE TABLE IF NOT EXISTS tasks (
    id SERIAL NOT NULL,
    created_at timestamp NOT NULL,
    status VARCHAR(255) NOT NULL default 'IN_PROGRESS',
    title VARCHAR(1024) NOT NULL,
    PRIMARY KEY (id)
  );`);
}

// CREATE
export async function addNewTaskToDatabase(newTask: string) {
  await tableCreationIfDoesNotExist();
  await pool.query(`INSERT INTO tasks(created_at, status, title) VALUES(NOW(), 'IN_PROGRESS', $1)`, [newTask]);
  return;
}

// READ
export async function getTasksFromDatabase() {
  await tableCreationIfDoesNotExist();
  const { rows } = await pool.query(`SELECT id, created_at, status, title FROM tasks ORDER BY created_at DESC LIMIT 100`);
  console.table(rows); // logs the last 5 visits on the server
  return rows; // sends the last 5 visits to the client
}

// UPDATE
export async function updateTaskInDatabase(task: Task) {
  await tableCreationIfDoesNotExist();
  await pool.query(
    `UPDATE tasks SET status = $1, title = $2 WHERE id = $3`,
    [task.status, task.title, task.id]
  );
  return;
}

// DELETE
export async function deleteTaskFromDatabase(taskId: string) {
  await tableCreationIfDoesNotExist();
  await pool.query(`DELETE FROM tasks WHERE id = $1`, [taskId]);
  return;
}
  9. Cloud Shell Editor में page.tsx फ़ाइल खोलें:
    cloudshell edit app/page.tsx
    अब स्क्रीन के सबसे ऊपर मौजूदा फ़ाइल दिखेगी. यहां इस page.tsx फ़ाइल में बदलाव किया जा सकता है. स्क्रीन के सबसे ऊपर वाले सेक्शन में कोड दिखाएं
  10. page.tsx फ़ाइल का मौजूदा कॉन्टेंट मिटाएं.
  11. नीचे दिया गया कोड कॉपी करके, खोली गई page.tsx फ़ाइल में चिपकाएं:
    'use client'
import React, { useEffect, useState } from "react";
import { addNewTaskToDatabase, getTasksFromDatabase, deleteTaskFromDatabase, updateTaskInDatabase } from "./actions";

type Task = {
  id: string;
  title: string;
  status: 'IN_PROGRESS' | 'COMPLETE';
};

export default function Home() {
  const [newTaskTitle, setNewTaskTitle] = useState('');
  const [tasks, setTasks] = useState<Task[]>([]);

  async function getTasks() {
    const updatedListOfTasks = await getTasksFromDatabase();
    setTasks(updatedListOfTasks);
  }

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

  async function addTask() {
    await addNewTaskToDatabase(newTaskTitle);
    await getTasks();
    setNewTaskTitle('');
  }

  async function updateTask(task: Task, newTaskValues: Partial<Task>) {
    await updateTaskInDatabase({ ...task, ...newTaskValues });
    await getTasks();
  }

  async function deleteTask(taskId: string) {
    await deleteTaskFromDatabase(taskId);
    await getTasks();
  }

  return (
    <main className="p-4">
      <h2 className="text-2xl font-bold mb-4">To Do List</h2>
      <div className="flex mb-4">
        <form onSubmit={handleSubmit} className="flex mb-8">
          <input
            type="text"
            placeholder="New Task Title"
            value={newTaskTitle}
            onChange={(e) => setNewTaskTitle(e.target.value)}
            className="flex-grow border border-gray-400 rounded px-3 py-2 mr-2 bg-inherit"
          />
          <button
            type="submit"
            className="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded text-nowrap"
          >
            Add New Task
          </button>
        </form>
      </div>
      <table className="w-full">
        <tbody>
          {tasks.map(function (task) {
            const isComplete = task.status === 'COMPLETE';
            return (
              <tr key={task.id} className="border-b border-gray-200">
                <td className="py-2 px-4">
                  <input
                    type="checkbox"
                    checked={isComplete}
                    onClick={() => updateTask(task, { status: isComplete ? 'IN_PROGRESS' : 'COMPLETE' })}
                    className="transition-transform duration-300 ease-in-out transform scale-100 checked:scale-125 checked:bg-green-500"
                  />
                </td>
                <td className="py-2 px-4">
                  <span className={`transition-all duration-300 ease-in-out ${isComplete ? 'line-through text-gray-400 opacity-50' : 'opacity-100'}`}>
                    {task.title}
                  </span>
                </td>
                <td className="py-2 px-4">
                  <button
                    onClick={() => deleteTask(task.id)}
                    className="bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
                  >
                    Delete
                  </button>
                </td>
              </tr>
            );
          })}
        </tbody>
      </table>
    </main>
  );
}

ऐप्लिकेशन अब डिप्लॉय करने के लिए तैयार है.

9. ऐप्लिकेशन को Cloud Run पर डिप्लॉय करना

  1. आपको जो Cloud Run सेवा बनानी है उसके लिए, Cloud Run सेवा खाते में नेटवर्क उपयोगकर्ता की भूमिका जोड़ने के लिए, gcloud projects add-iam-policy-binding कमांड को इस तरह चलाएं.
    gcloud projects add-iam-policy-binding ${GOOGLE_CLOUD_PROJECT} \
--member "serviceAccount:service-$(gcloud projects describe ${GOOGLE_CLOUD_PROJECT} --format="value(projectNumber)")@serverless-robot-prod.iam.gserviceaccount.com" \
--role "roles/compute.networkUser"
  1. अपने ऐप्लिकेशन को Cloud Run पर डिप्लॉय करने के लिए, यह कमांड चलाएं:
    gcloud run deploy helloworld \
  --region=us-central1 \
  --source=. \
  --set-env-vars DB_NAME="quickstart_db" \
  --set-env-vars DB_USER="postgres" \
  --set-env-vars DB_PASSWORD=${DB_PASSWORD} \
  --set-env-vars DB_HOST="$(gcloud sql instances describe quickstart-instance --project=${GOOGLE_CLOUD_PROJECT} --format='value(settings.ipConfiguration.pscConfig.pscAutoConnections.ipAddress)')" \
  --service-account="quickstart-service-account@${GOOGLE_CLOUD_PROJECT}.iam.gserviceaccount.com" \
  --network=default \
  --subnet=default \
  --allow-unauthenticated
  2. अगर कहा जाए, तो जारी रखने के लिए Y और Enter दबाएं:
    Do you want to continue (Y/n)? Y

कुछ मिनटों के बाद, आपको ऐप्लिकेशन से एक यूआरएल मिलेगा.

अपने ऐप्लिकेशन को काम करते हुए देखने के लिए, यूआरएल पर जाएं. जब भी यूआरएल पर जाया जाएगा या पेज को रीफ़्रेश किया जाएगा, तब आपको टास्क ऐप्लिकेशन दिखेगा.

10. Gemini Code Assist की मदद से कोई सुविधा जोड़ना

अब आपने डेटाबेस के साथ वेब ऐप्लिकेशन डिप्लॉय कर लिया है. इसके बाद, हम एआई की मदद से अपने next.js ऐप्लिकेशन में एक नई सुविधा जोड़ने जा रहे हैं.

  1. Cloud Shell एडिटर पर वापस जाना
  2. page.tsx को फिर से खोलें
    cd ~/task-app
cloudshell edit app/page.tsx
  3. Cloud Shell Editor में, कोड से जुड़ी सहायता देने वाली Gemini की सुविधा पर जाएं:
    • स्क्रीन की बाईं ओर मौजूद टूलबार में, Gemini आइकॉन Gemini Code Assist का आइकॉन पर क्लिक करें
    • अगर कहा जाए, तो अपने Google खाते के क्रेडेंशियल से साइन इन करें
    • अगर आपसे कोई प्रोजेक्ट चुनने के लिए कहा जाए, तो वह प्रोजेक्ट चुनें जिसे आपने इस कोडलैब के लिए बनाया है Gemini प्रोजेक्ट चुनना
  4. प्रॉम्प्ट डालें: Add the ability to update the title of the task. The code in your output should be complete and working code.. handleEditStart और handleEditCancel फ़ंक्शन जोड़ने के लिए, जवाब में इस तरह के स्निपेट शामिल होने चाहिए:
    const [editingTaskId, setEditingTaskId] = useState<string>('');
const [editedTaskTitle, setEditedTaskTitle] = useState('');

const handleEditStart = (task: Task) => {
  setEditingTaskId(task.id);
  setEditedTaskTitle(task.title);
};

const handleEditCancel = () => {
  setEditingTaskId('');
  setEditedTaskTitle('');
};

    <td className="py-2 px-4">
  {editingTaskId === task.id ? (
    <form onSubmit={(e) => {
      e.preventDefault();
      updateTask(task, { title: editedTaskTitle });
    }}>
      <input
        type="text"
        value={editedTaskTitle}
        onChange={(e) => setEditedTaskTitle(e.target.value)}
        onBlur={() => handleEditCancel} // Handle clicking outside input
        className="border border-gray-400 rounded px-3 py-1 mr-2"
      />
        <button type="submit" className="text-green-600 hover:text-green-900 mr-1">Save</button>
    </form>

  ) : (
    <span onClick={() => handleEditStart(task)} className="cursor-pointer">
      {task.title}
    </span>
  )}
</td>
  5. page.tsx को Gemini Code Assist के आउटपुट से बदलें. यहां एक काम करने वाला उदाहरण दिया गया है:
    'use client'
import React, { useEffect, useState } from "react";
import { addNewTaskToDatabase, getTasksFromDatabase, deleteTaskFromDatabase, updateTaskInDatabase } from "./actions";

type Task = {
  id: string;
  title: string;
  status: 'IN_PROGRESS' | 'COMPLETE';
};

export default function Home() {
  const [newTaskTitle, setNewTaskTitle] = useState('');
  const [tasks, setTasks] = useState<Task[]>([]);
  const [editingTaskId, setEditingTaskId] = useState<string>('');
  const [editedTaskTitle, setEditedTaskTitle] = useState('');

  async function getTasks() {
    const updatedListOfTasks = await getTasksFromDatabase();
    setTasks(updatedListOfTasks);
  }

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

  async function addTask() {
    await addNewTaskToDatabase(newTaskTitle);
    await getTasks();
    setNewTaskTitle('');
  }

  async function updateTask(task: Task, newTaskValues: Partial<Task>) {
    await updateTaskInDatabase({ ...task, ...newTaskValues });
    await getTasks();
    setEditingTaskId(''); // Clear editing state after update
    setEditedTaskTitle('');
  }

  async function deleteTask(taskId: string) {
    await deleteTaskFromDatabase(taskId);
    await getTasks();
  }

  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
    e.preventDefault();
    addTask();
  };


  const handleEditStart = (task: Task) => {
    setEditingTaskId(task.id);
    setEditedTaskTitle(task.title);
  };

  const handleEditCancel = () => {
    setEditingTaskId('');
    setEditedTaskTitle('');
  };

  return (
    <main className="p-4">
      <h2 className="text-2xl font-bold mb-4">To Do List</h2>
      <form onSubmit={handleSubmit} className="flex mb-8">
        <input
          type="text"
          placeholder="New Task Title"
          value={newTaskTitle}
          onChange={(e) => setNewTaskTitle(e.target.value)}
          className="flex-grow border border-gray-400 rounded px-3 py-2 mr-2 bg-inherit"
        />
        <button
          type="submit"
          className="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded text-nowrap"
        >
          Add New Task
        </button>
      </form>
      <table className="w-full">
        <tbody>
          {tasks.map(task => {
            const isComplete = task.status === 'COMPLETE';
            return (
              <tr key={task.id} className="border-b border-gray-200">
                <td className="py-2 px-4">
                  <input
                    type="checkbox"
                    checked={isComplete}
                    onClick={() => updateTask(task, { status: isComplete ? 'IN_PROGRESS' : 'COMPLETE' })}
                    className="transition-transform duration-300 ease-in-out transform scale-100 checked:scale-125 checked:bg-green-500"
                  />
                </td>
                <td className="py-2 px-4">
                  {editingTaskId === task.id ? (
                    <form 
                      onSubmit={(e) => {
                        e.preventDefault();
                        updateTask(task, { title: editedTaskTitle });
                      }}
                      className="flex"
                    >
                      <input
                        type="text"
                        value={editedTaskTitle}
                        onChange={(e) => setEditedTaskTitle(e.target.value)}
                        onBlur={() => handleEditCancel()} // Handle clicking outside input
                        className="flex-grow border border-gray-400 rounded px-3 py-1 mr-2 bg-inherit"
                      />
                      <button
                        type="submit"
                        className="bg-green-600 hover:bg-green-900 m-1 text-white font-bold py-2 px-4 rounded"
                      >
                        Save
                      </button>
                    </form>
                  ) : (
                    <span
                      onClick={() => handleEditStart(task)}
                      className={`transition-all duration-300 ease-in-out cursor-pointer ${isComplete ? 'line-through text-gray-400 opacity-50' : 'opacity-100'}`}
                    >
                      {task.title}
                    </span>
                  )}
                </td>
                <td className="py-2 px-4">
                  <button
                    onClick={() => deleteTask(task.id)}
                    className="bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded float-right"
                  >
                    Delete
                  </button>
                </td>
              </tr>
            );
          })}
        </tbody>
      </table>
    </main>
  );
}

11. ऐप्लिकेशन को Cloud Run पर फिर से डिप्लॉय करना

  1. अपने ऐप्लिकेशन को Cloud Run पर डिप्लॉय करने के लिए, यह कमांड चलाएं:
    gcloud run deploy helloworld \
  --region=us-central1 \
  --source=. \
  --set-env-vars DB_NAME="quickstart_db" \
  --set-env-vars DB_USER="postgres" \
  --set-env-vars DB_PASSWORD=${DB_PASSWORD} \
  --set-env-vars DB_HOST="$(gcloud sql instances describe quickstart-instance --project=${GOOGLE_CLOUD_PROJECT} --format='value(settings.ipConfiguration.pscConfig.pscAutoConnections.ipAddress)')" \
  --service-account="quickstart-service-account@${GOOGLE_CLOUD_PROJECT}.iam.gserviceaccount.com" \
  --network=default \
  --subnet=default \
  --allow-unauthenticated
  2. अगर कहा जाए, तो जारी रखने के लिए Y और Enter दबाएं:
    Do you want to continue (Y/n)? Y

12. बधाई हो

इस लैब में, आपने ये काम करने का तरीका जाना है:

  • Private Service Connect का इस्तेमाल करने के लिए कॉन्फ़िगर किया गया, PostgreSQL के लिए Cloud SQL इंस्टेंस बनाएं
  • Cloud Run पर ऐसा ऐप्लिकेशन डिप्लॉय करना जो आपके Cloud SQL डेटाबेस से कनेक्ट हो
  • अपने ऐप्लिकेशन में फ़ंक्शन जोड़ने के लिए, Gemini Code Assist का इस्तेमाल करना

व्यवस्थित करें

Cloud SQL में कोई मुफ़्त टीयर नहीं है. इसका इस्तेमाल जारी रखने पर, आपसे शुल्क लिया जाएगा. अतिरिक्त शुल्कों से बचने के लिए, अपना Cloud प्रोजेक्ट मिटाया जा सकता है.

Cloud Run का इस्तेमाल न होने पर, आपसे कोई शुल्क नहीं लिया जाता. हालांकि, आर्टफ़ैक्ट रजिस्ट्री में कंटेनर इमेज को सेव करने के लिए, आपसे शुल्क लिया जा सकता है. Cloud प्रोजेक्ट मिटाने पर, उस प्रोजेक्ट में इस्तेमाल किए गए सभी संसाधनों के लिए बिलिंग बंद हो जाती है.

अगर आपको प्रोजेक्ट मिटाना है, तो:

gcloud projects delete $GOOGLE_CLOUD_PROJECT

आपके पास अपनी CloudShell डिस्क से ग़ैर-ज़रूरी संसाधनों को मिटाने का विकल्प भी है. आप:

  1. कोडलैब प्रोजेक्ट डायरेक्ट्री मिटाएं: 
    rm -rf ~/task-app
  2. चेतावनी! इस कार्रवाई को पहले जैसा नहीं किया जा सकता! अगर आपको जगह खाली करने के लिए, अपने Cloud Shell पर मौजूद सभी चीज़ें मिटानी हैं, तो अपनी पूरी होम डायरेक्ट्री मिटाएं. ध्यान रखें कि आपको जो भी चीज़ें सेव रखनी हैं उन्हें किसी दूसरी जगह सेव कर लें. 
    sudo rm -rf $HOME