दिग्गजों की लड़ाई: GitHub Copilot बनाम ChatGPT ⚔️⚔️

Dec 11 2022
चैटजीपीटी की रिलीज ने प्रोग्रामिंग समुदाय के माध्यम से लहरें भेजीं क्योंकि यह अविश्वसनीय कोड स्निपेट्स के साथ आ सकता है। यह पिछले साल जारी किए गए GitHub Copilot से कैसे तुलना करता है? क्या एआई आपकी नौकरी के बाद आ रहा है? चलो पता करते हैं।

चैटजीपीटी की रिलीज ने प्रोग्रामिंग समुदाय के माध्यम से लहरें भेजीं क्योंकि यह अविश्वसनीय कोड स्निपेट्स के साथ आ सकता है।

यह पिछले साल जारी किए गए GitHub Copilot से कैसे तुलना करता है ? क्या एआई आपकी नौकरी के बाद आ रहा है? चलो पता करते हैं।

यदि आपने GitHub Copilot पर मेरा पिछला लेख नहीं पढ़ा है , तो आप इसे यहाँ देख सकते हैं ।

चैटजीपीटी का परीक्षण

आइए संक्षेप में उन्हीं परीक्षणों से गुजरते हैं जिनके माध्यम से हमने GitHub Copilot को रखा है ।

टेस्ट 1: स्टॉक मूल्य प्राप्त करें

अफसोस की बात है कि पहली बार इसने गलत कोड जनरेट किया।

फ़ंक्शन को के रूप में परिभाषित नहीं किया गया था async, और promisesठीक से प्रबंधित नहीं किया गया था।

अगला प्रयास बेहतर था

आश्चर्यजनक रूप से यह एपीआई कुंजी के बिना काम करता है (जब तक क्वेरी पैराम में apikeyकिसी भी यादृच्छिक मान के साथ कुंजी होती है)।

परिणाम : GitHub Copilot ChatGPT को धूल में छोड़ देता है।

टेस्ट 2: बीएफएस ट्रैवर्सल

इस बार, चैटजीपीटी ने इसे एक ही बार में ठीक कर दिया, दुख की बात है कि यह इतना लंबा था कि स्क्रीन में एक स्क्रीनशॉट फिट नहीं हुआ, इसलिए यहां उत्पन्न कोड है:

class Node:
  def __init__(self, value):
    self.value = value
    self.left = None
    self.right = None

class BinarySearchTree:
  def __init__(self):
    self.root = None

  def insert(self, value):
    new_node = Node(value)

    if self.root is None:
      self.root = new_node
      return

    current_node = self.root
    while True:
      if value < current_node.value:
        if current_node.left is None:
          current_node.left = new_node
          return
        current_node = current_node.left
      else:
        if current_node.right is None:
          current_node.right = new_node
          return
        current_node = current_node.right

  def inorder_traversal(self, node, numbers):
    if node is None:
      return
    self.inorder_traversal(node.left, numbers)
    numbers.append(node.value)
    self.inorder_traversal(node.right, numbers)

  def get_numbers(self):
    numbers = []
    self.inorder_traversal(self.root, numbers)
    return numbers

bst = BinarySearchTree()
bst.insert(10)
bst.insert(5)
bst.insert(15)
bst.insert(3)
bst.insert(7)
bst.insert(13)
bst.insert(17)

numbers = bst.get_numbers()
print(numbers)  # [3, 5, 7, 10, 13, 15, 17]

परिणाम : ChatGPT ने इसे जीत लिया।

टेस्ट 3: 100 लोगों की सरणी

ChatGPT ने इसके लिए कई सुझाव दिए

जब GitHub Copilot को लॉन्च किया गया था, तो इसने थोड़ा अजीब सुझाव उत्पन्न किया, लेकिन अब यह ChatGPT के समान कोड उत्पन्न करता है ।

परिणाम : टाई (आपके द्वारा तुलना किए जाने वाले सॉफ़्टवेयर के किस संस्करण पर निर्भर करता है)

एक पूर्ण TODO परियोजना बनाना

परीक्षणों को आगे बढ़ाने के लिए, मैंने दोनों सॉफ़्टवेयर का उपयोग करके एक पूर्ण TODO प्रोजेक्ट बनाने का निर्णय लिया।

चैटजीपीटी

1. TODO प्रोजेक्ट कैसे बनाएं?

ChatGPT द्वारा बताए गए कदम काफी व्यापक हैं

2. Reactप्रोजेक्ट कैसे तैयार करें?

3. एक टोडो घटक बनाएँ

यह वह हिस्सा है जो मुझे पसंद नहीं आया। उत्पन्न कोड लीगेसी क्लास कंपोनेंट सिंटैक्स का उपयोग कर रहा था। यह todos को जोड़ने का काम भी नहीं कर रहा था

4. टोडो को जोड़ने और हटाने के साथ-साथ उन्हें पूर्ण के रूप में चिह्नित करने के लिए टोडो घटक को अनुकूलित करें।

यहां वह कोड है जो उत्पन्न हुआ है (स्क्रीनशॉट के लिए बहुत लंबा)

import React from "react";

// TodoItem component
const TodoItem = ({
 item,
 onDelete,
 onComplete,
}) => (
 <li>
   {item.text}
   <button onClick={onDelete}>Delete</button>
   <button onClick={onComplete}>
     {item.isComplete ? "Undo" : "Complete"}
   </button>
 </li>
);

// TodoApp component
class TodoApp extends React.Component {
 // Define the initial state of the component
 state = {
   todoItems: [],
 };

 // Method to handle adding new items to the todo list
 addTodo = (text) => {
   // Add the new item to the todo list
   this.setState({
     todoItems: [
       ...this.state.todoItems,
       { text, isComplete: false },
     ],
   });
 };

 // Method to handle deleting items from the todo list
 deleteTodo = (index) => {
   // Delete the item at the given index
   this.setState({
     todoItems: this.state.todoItems.filter(
       (_, i) => i !== index
     ),
   });
 };

 // Method to handle completing/undoing a todo item
 completeTodo = (index) => {
   // Update the "isComplete" property of the item at the given index
   this.setState((state) => {
     const todoItems = [...state.todoItems];
     todoItems[index].isComplete =
       !todoItems[index].isComplete;
     return { todoItems };
   });
 };

 // Method to render the component
 render() {
   return (
     <div>
       {/* Form to add new items to the todo list */}
       <form>
         <input
           type="text"
           placeholder="Add a todo item"
         />
         <button type="submit">Add</button>
       </form>

       {/* List of todo items */}
       <ul>
         {this.state.todoItems.map(
           (item, index) => (
             <TodoItem
               key={index}
               item={item}
               onDelete={() =>
                 this.deleteTodo(index)
               }
               onComplete={() =>
                 this.completeTodo(index)
               }
             />
           )
         )}
       </ul>
     </div>
   );
 }
}

5. कार्यात्मक घटकों को बनाने और जोड़ने, हटाने और टूडोस को पूरा करने के लिए उल्लेख करके अंतिम प्रयास करें।

import React from "react";

// TodoItem component
const TodoItem = ({ item, onDelete, onComplete }) => (
  <li>
    {item.text}
    <button onClick={onDelete}>Delete</button>
    <button onClick={onComplete}>
      {item.isComplete ? "Undo" : "Complete"}
    </button>
  </li>
);

// TodoApp component
const TodoApp = () => {
  // Define the initial state of the component
  const [todoItems, setTodoItems] = React.useState([]);
  // Method to handle adding new items to the todo list
  const addTodo = (text) => {
    // Add the new item to the todo list
    setTodoItems([
      ...todoItems,
      { text, isComplete: false },
    ]);
  };
  // Method to handle deleting items from the todo list
  const deleteTodo = (index) => {
    // Delete the item at the given index
    setTodoItems(
      todoItems.filter((_, i) => i !== index)
    );
  };
  // Method to handle completing/undoing a todo item
  const completeTodo = (index) => {
    // Update the "isComplete" property of the item at the given index
    setTodoItems((state) => {
      const todoItems = [...state];
      todoItems[index].isComplete =
        !todoItems[index].isComplete;
      return todoItems;
    });
  };
  // Return the component
  return (
    <div>
      {/* Form to add new items to the todo list */}
      <form>
        <input
          type="text"
          placeholder="Add a todo item"
        />
        <button type="submit">Add</button>
      </form>
      {/* List of todo items */}
      <ul>
        {todoItems.map((item, index) => (
          <TodoItem
            key={index}
            item={item}
            onDelete={() => deleteTodo(index)}
            onComplete={() => completeTodo(index)}
          />
        ))}
      </ul>
    </div>
  );
};

गिटहब कोपिलॉट

अफसोस की बात है कि कोपिलॉट रिएक्ट प्रोजेक्ट नहीं बना सकता। यह किसी दिए गए संदर्भ में केवल कोड स्निपेट्स का सुझाव दे सकता है, तो चलिए खुद एक रिएक्ट ऐप बनाकर शुरू करते हैं

1. एक रिएक्ट प्रोजेक्ट बनाएं

npx create-react-app react-copilot

3. अंत में कोपिलॉट के लिए अपना जादू चलाने का समय आ गया है जब हम आराम से बैठकर मोजिटो की चुस्की लेते हैं।

किए जाने वाले कार्य पर फ़ाइल के शीर्ष पर एक टिप्पणी जोड़ी गई थी

टूडू आइटम

// Functional TodoItem component which takes onDelete,
// onComplete, and item ({ todo: string; completed: boolean })
// as props

// Functional TodoApp component which handles addition,
// deletion & completion of todos. The TodoItem component
// is used to render each todo item

export default function TodoItem({
 onDelete,
 onComplete,
 item,
}) {
 return (
   <div>
     <input
       type="checkbox"
       checked={item.completed}
       onChange={() => onComplete(item)}
     />
     <span
       style={{
         textDecoration: item.completed
           ? "line-through"
           : "none",
       }}
     >
       {item.todo}
     </span>
     <button onClick={() => onDelete(item)}>
       Delete
     </button>
   </div>
 );
}

5. उत्पन्नTodoApp

import React, { useState } from "react";
import TodoItem from "./TodoItem";

export default function TodoApp() {
 const [todos, setTodos] = useState([]);
 const [todo, setTodo] = useState("");

 const addTodo = () => {
   setTodos([...todos, { todo, completed: false }]);
   setTodo("");
 };

 const deleteTodo = (item) => {
   setTodos(todos.filter((todo) => todo !== item));
 };

 const completeTodo = (item) => {
   setTodos(
     todos.map((todo) =>
       todo === item
         ? { ...todo, completed: !todo.completed }
         : todo
     )
   );
 };

 return (
   <div>
     <h1>Todo App</h1>
     <input
       type="text"
       value={todo}
       onChange={(e) => setTodo(e.target.value)}
     />
     <button onClick={addTodo}>Add</button>
     {todos.map((item, index) => (
       <TodoItem
         key={index}
         onDelete={deleteTodo}
         onComplete={completeTodo}
         item={item}
       />
     ))}
   </div>
 );
}

भले ही हमें परियोजना स्थापित करने के लिए अतिरिक्त काम करने की आवश्यकता थी, Copilot चैटजीपीटी की तुलना में टोडो ऐप के लिए बेहतर कोड उत्पन्न करने में सक्षम था ।

दिन के अंत में, Copilot डेवलपर्स को तेजी से कोड लिखने में मदद करने के लिए एक उपकरण माना जाता है, जबकि ChatGPT एक सामान्य उद्देश्य है chatbot, फिर भी यह अभी भी विकास प्रक्रिया को सुव्यवस्थित कर सकता है, लेकिन जब कार्य कोडिंग केंद्रित होता है तो GitHub Copilot जीत जाता है! यह हमें सवाल पर लाता है ...

आपकी नौकरी कौन लेगा?

(आपके दिमाग में) एआई के डेवलपर्स : * ईविल लाफ *

इससे पहले कि आप गिटहब मुख्यालय को जलाने के लिए अपने पिचफोर्क निकालें , आइए एक कदम पीछे हटें और बड़ी तस्वीर देखें। ये विकास प्रक्रिया को सुव्यवस्थित करने के लिए उपकरण हैं , और वे डेवलपर्स को बदलने के लिए नहीं हैं।

कोड लिखने के लिए हमें अभी भी डेवलपर्स की आवश्यकता है। निश्चित रूप से, ये उपकरण तेजी से कोड करने में हमारी मदद कर सकते हैं, लेकिन मानव इनपुट के बिना वे अभी भी अपने दम पर सब कुछ नहीं खोज सकते हैं

मंदी के कारण छंटनी की खबर जंगल की आग की तरह फैल रही है, यह सुनने में बहुत डरावनी लग सकती है, लेकिन जब तक आप अपने कौशल को अपडेट और पॉलिश करते रहेंगे, आप ठीक रहेंगे!

एक चिल पिल लें , और खुशहाल अपस्किलिंग !

तकनीक के क्षेत्र में द्वि-साप्ताहिक नई जानकारियों के लिए मुझे फॉलो करें !

अपने विकास संकटों को दूर करने के लिए एक टॉप रेटेड फ्रंट-एंड डेवलपमेंट फ्रीलांसर की आवश्यकता है? अपवर्क पर मुझसे संपर्क करें

देखना चाहते हैं कि मैं किस पर काम कर रहा हूं? मेरी निजी वेबसाइट और गिटहब देखें

कनेक्ट करना चाहते हैं? लिंक्डइन पर मुझसे संपर्क करें

मैं एक डिजिटल खानाबदोश हूं और कभी-कभी यात्रा करता हूं। मैं क्या कर रहा हूं यह देखने के लिए मुझे इंस्टाग्राम पर फॉलो करें ।