ChatGPT prompt trükkök: AI fejlesztői tippek és trükkök a konzolhoz.

1. rész: Bevezetés és gyakorlati példák 1-2.

Elképzeled, hogy egy szerdai délután nézed az üres kódablakot, és épp egy olyan funkciót kellene megírnod, ami lényegében „csak” logikailag helyesen kell, hogy működjön. Nem egy új keretrendszer, nem egy forradalmi architektúra – hanem egy olyan rutin feladat, amit már százszor megcsináltál, és most is pontosan tudod, hogy kell, de az agyad szimplán üres. Vagy fordítva: egy új könyvtárral próbálkozol, a dokumentációja pedig úgy tűnik, mintha egy párhuzamos univerzumban írták volna, ahol más jelentéssel bírnak az alapfogalmak. Az idő percre pontosan ketyeg, az ügyfél vagy a csapatvezető már kérdezi az állapotot, te pedig egy egyszerű, de szükséges szövegformázás vagy API hívás szintaxisát guglizod… ismét.

Ez az a pont, ahol egyre többen rájönnek: a ChatGPT, Claude vagy más beszélgetőalapú AI nem csupán egy robot, amitől ijesztő blogcikkeket kérdezhetsz. A konzol vagy a kódszerkesztő mellett nyitva tartott ablak egy kiterjesztett, hipergyors, soha nem fáradó mentora és asszisztense lehet minden olyan fejlesztőnek, aki szeretné, ha az értelmetlen keresések, a copy-paste hibák és a dokumentációs fejtörések ideje visszaáramlana a valódi problémák – a kreatív logika, az architektúra vagy a teljesítményoptimalizálás – megoldásába.

A cikkben megosztott promt trükkök és fejlesztői tippek nem arról szólnak, hogy „kérj egy kódot”. Arról szólnak, hogyan kérdezz úgy, hogy az AI megértse a *kontextusodat*, a *korlátaidat* és a *valódi célodat*, majd ne egy általános példát, hanem egy konkrét, azonnal használható, biztonságos megoldást adjon. Olyat, amit egy tapasztaltabb kolléga mondana át a vállad fölött, ha lenne ideje.

—

1. Példa: Ne kérj „kódot” – írd le a kontextust és a problémát

Rossz prompt (túl általános): > „Írj egy JavaScript függvényt egy dátum formázásához.”

Jó prompt (kontextus, korlátok, konkrét cél): > „Van egy PHP Laravel backend API-m, amely MySQL DATETIME mezőkből ISO 8601 stringeket ('2024-04-10T14:30:00') küld ki JSON-ben. A frontend egy örökölt projekt, jQuery és Bootstrap 4 alatt fut, nincs lehetőség új könyvtárak (pl. moment.js) behúzására. Készíts egy JavaScript függvényt, ami ezt az ISO stringet átalakítja magyar formátumra: ‘2024. április 10. 14:30’. A megoldás működjön az IE11 támogatás nélkül, de ne használjon Intl.DateTimeFormat-ot, mert a célközönség régebbi böngészőket használ. A függvény ne módosítsa a bemeneti stringet.”

Miért jobb? Az AI nem csak a kívánt kimenetet, hanem a *környezetet* (Laravel, jQuery, Bootstrap), a *technikai korlátokat* (nincs új könyvtár, nincs IE11, nincs Intl) és a *kívánt viselkedést* (tiszta függvény) is látja. Így a válasz sokkal közelebb áll a valós, használható kóddal.

Lehetséges válasza az AI-nak:

function formatHungarianDateTime(isoString) {
    // Ellenőrizzük a bemenet alapvető formátumát
    if (typeof isoString !== 'string' || !isoString.includes('T')) {
        console.error('Érvénytelen ISO 8601 dátum string:', isoString);
        return 'Érvénytelen dátum';
    }

    const date = new Date(isoString);
    // Egyszerű dátum érvényesség ellenőrzés
    if (isNaN(date.getTime())) {
        console.error('Nem konvertálható dátumra:', isoString);
        return 'Érvénytelen dátum';
    }

    const year = date.getFullYear();
    const month = date.getMonth(); // 0-tól 11-ig
    const day = date.getDate();
    const hours = date.getHours().toString().padStart(2, '0');
    const minutes = date.getMinutes().toString().padStart(2, '0');

    const hungarianMonths = [
        'január', 'február', 'március', 'április', 'május', 'június',
        'július', 'augusztus', 'szeptember', 'október', 'november', 'december'
    ];

    return `${year}. ${hungarianMonths[month]} ${day}. ${hours}:${minutes}`;
}

// Példa használat:
// const formatted = formatHungarianDateTime('2024-04-10T14:30:00');
// console.log(formatted); // "2024. április 10. 14:30"

—

2. Példa: Kérj magyarázatot, debug segítséget – ne csak új kódot

Tegyük fel, hogy örökölt egy PHP szkriptet, ami valamiért nem adja vissza a várt adatot. A klasszikus fejlesztői reflex a ChatGPT előtt az volt, hogy beilleszted a hibát, és megkérdezed: „Mi a baj ezzel a kóddal?”. Ez működik, de nagyon passzív. Sokkal hatékonyabb, ha *irányítod* a debug folyamatot.

Hatékony prompt hibakereséshez: > „Van egy régi, örökölt PHP függvényem, ami egy CSV fájlból kell, hogy visszaadja a 2. oszlop összegét. A kód lefut, de az eredmény mindig 0. *A te feladatod:* > 1. Elemezd a következő kódot, és mondd el, milyen logikai vagy szintaktikai hibákat látsz. > 2. Kérdezz vissza maximum 3 kérdéssel, amikre a válasz segítene pontosabban diagnosztizálni a problémát (pl. ‘A CSV fájl első sora tartalmazza a fejléceket?’). > 3. Adj egy javított, biztonságosabb változatot, ami kezeli a hibás sorokat, üres fájlt, és biztonságosan dolgozik a bemeneti fájllal.”

function sumSecondColumn($filename) {
    $sum = 0;
    $file = fopen($filename, 'r');
    while (($row = fgetcsv($file)) !== FALSE) {
        $sum += $row[1];
    }
    fclose($file);
    return $sum;
}

Az ilyen prompt hatására az AI nem csak kijavítja, hogy $row[1] helyett $row[1] ?? 0 kell, és fopen sikertől függ a működés. Hanem rákérdez a CSV szerkezetére, javasol is_numeric() ellenőrzést, és felhívja a figyelmet a lehetséges biztonsági kockázatokra (pl. a $filename forrása). Ez a módszer olyan, mintha egy kollégával átnéznétek a kódot – nem csak kapod a választ, hanem megérted a *miértet* is. Ez a tudás maradandó.

3. Példa: Kérj kódot a te stílusodban – konzisztencia a projekten belül

Amikor egy új komponenst vagy funkciót írsz egy már futó projektbe, a legkisebb gond is lehet, ha a stílusa ütközik a meglévő kódbázissal. A „legjobb gyakorlatok” szerint írt, de stílusában idegen kód beillesztése után te vagy az, aki órákat tölthet a formázással, a konvenciók átírásával. Itt jön képbe a referencia kód megadása.

Hatékony prompt stílus követéséhez: > „Készíts egy új, reaktív Bootstrap 5 kártya komponenst Vue 3 Composition API-val. A kártyának legyen címe, leírása, egy opcionális kép és egy gomb. Itt van egy meglévő komponensünk a projektből, ezt a stílust és szerkezetet kövesd:” > >

> 
>   <div class="widget-card card border-light shadow-sm h-100">
>     <div class="card-body d-flex flex-column p-4">
>       <div class="d-flex justify-content-between align-items-start mb-3">
>         <h5 class="card-title fw-bold text-primary mb-0">{{ title }}</h5>
>         <span class="badge bg-warning text-dark">{{ badge }}</span>
>       </div>
>       <p class="card-text text-muted flex-grow-1">{{ description }}</p>
>       <button class="btn btn-outline-primary mt-auto align-self-start">
>         Részletek
>       </button>
>     </div>
>   </div>
> 
>
> 
> defineProps({
>   title: String,
>   description: String,
>   badge: String,
>   hasAction: Boolean
> });
> defineEmits(['action']);
> 
> 

> > A specifikáció: Az új komponens neve ImageCard. Kötelező prop-ok: title, description, imageUrl. Opcionális prop: buttonLabel (alapértelmezett: „Megtekintés”). A kép a kártya tetején jelenjen meg. A gomb a kártya alján legyen, és 'card-click' eseményt indítson. Használd a border-light és shadow-sm osztályokat, ahogy a példában is látható.

Ezzel a prompffal az AI nem egy általános, tutorial-szerű Bootstrap kártyát fog generálni. Hanem konkrétan a *te projektjeid stílusát* fogja utánozni: ugyanaz az osztály-struktúra (d-flex flex-column), hasonló margók (mb-3, p-4), követi a defineProps/defineEmits szintaxist, és megtartja a design konzisztenciát (border-light, shadow-sm). Ez azt jelenti, hogy a generált kódot szinte azonnal beillesztheted, anélkül, hogy refaktorálnod kellene. A konzol melletti időd nem a formázásra, hanem a logikára megy el.

—

4. Példa: Generálj tesztadatokat és mock API válaszokat – ne kézzel gépelj

A frontend fejlesztés egyik legidőigényesebb, legunalmasabb része a valósághű, de kontrollált tesztadatok előkészítése. Legyen szó egy 10 elemű dropdown listáról, egy komplex, több szintű JSON strukturáról, vagy egy olyan API válaszról, amit a backend csapat még nem valósított meg. Ilyenkor az AI nem csak kódot ír, hanem *adatot* generál a kódod számára.

Prompt komplex mock adatok generálásához: > „Fejlesztek egy admin felületet, ahol egy táblázatban kell megjeleníteni a felhasználói rendeléseket. A backend API még nincs kész. Generálj nekem egy 5 elemű JavaScript tömböt (orders), amelyben minden objektum a következő szerkezetű: > – id: szám, autoincrement > – customerName: magyar név (vezetéknév és keresztnév) > – orderDate: véletlenszerű dátum az elmúlt 30 napból, ISO string formátumban > – status: egy a következő értékekből: ‘feldolgozás alatt’, ‘kiszállítva’, ‘visszaküldve’ > – items: egy beágyazott tömb, ahol minden elem tartalmazza a productName (egy valósághű terméknév) és quantity (1-5 közötti szám) mezőt. > – totalAmount: szám, 5000 és 50000 Ft között, a items alapján logikusan kalkulálva. > > A végére írd oda a tömböt egy export const mockOrders = ... formában, hogy könnyen importálhassam. A nevek és termékek legyenek magyarok.”

Az AI erre egy teljes értékű, azonnal használható mock tömböt fog generálni, valósághű magyar nevekkel és termékekkel. Ez nem csak időt takarít meg, hanem lehetővé teszi, hogy a komponensedet és a táblázat logikáját azonnal tesztelhesd, anélkül, hogy megvárnád a backendet. A prompt erőssége a *konkrétumokban* rejlik: megmondod a *nyelvet*, a *mezőket*, az *értéktartományokat* és a *formátumot*.

—

5. Példa: Kérj alternatív megoldásokat és hatékonysági elemzést – a legjobb kiválasztásához

Gyakran több út is vezet a célhoz. Lehet, hogy egy adott problémára már van egy működő megoldásod jQuery-ben, de kíváncsi vagy, hogy modern natív JavaScripttel hogyan lenne hatékonyabb, vagy hogy egy PHP szkripted hogyan skálázódna jobban. Az AI itt nem csak egy kódot ad, hanem egy *elemzést* és *összehasonlítást*.

Prompt alternatív megoldások és elemzés kéréséhez: > „Van egy meglévő jQuery funkcióm, amely egy táblázat sorait szűri egy beviteli mező alapján. Jelenlegi kódom: > >

> $('#searchInput').on('keyup', function() {
>     var value = $(this).val().toLowerCase();
>     $('table tbody tr').filter(function() {
>         $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
>     });
> });
> 

> > Kérem, hogy: > 1. Javasolj egy modern, natív JavaScript (vanilla JS) alternatívát, amely ugyanezt a funkciót valósítja meg, de a querySelectorAll, addEventListener és classList használatával. Fő cél a jQuery függőség eltávolítása. > 2. Javasolj egy második, teljesítmény-optimalizált változatot nagy táblázatokhoz (1000+ sor). Ez a változat használhat document.createDocumentFragment()-et vagy más technikát a DOM manipuláció minimalizálására. > 3. Röviden elemzd mindhárom megoldást (jQuery, natív JS, optimalizált natív JS) a következő szempontokból: böngésző kompatibilitás, teljesítmény nagy adathalmazon, karbantarthatóság és kód mérete. > > A válaszod kezdődhet egy rövid összefoglaló táblázattal, majd jöjjön a kód mindkét javaslatra.”

Ilyen prompffel nem egy fekete dobozt kapsz, hanem *döntési alapot*. Az AI összehasonlítja a megoldásokat, kiemeli, hogy a jQuery változat univerzális, de lassabb lehet, míg az optimalizált natív JS kevesebb DOM újrarajzolást végez. Így te, a fejlesztő, *tudatosan* választhatsz a kompatibilitás, a teljesítmény és a projekt állapota között. Ez a prompt arra kényszeríti az AI-t, hogy ne csak egyetlen „helyes” választ adjon, hanem mutassa be a szakmai spektrumot – pont olyat, amit egy szenior fejlesztő tenné egy code review során.

3. rész: Csapdák, biztonsági tanácsok és záró gondolatok

A korábbi példák remekül mutatták, hogyan lehet az AI-t a mindennapi fejlesztői munkában egy hatékony „erősítővé” alakítani. De ahogy minden erőteljes eszközzel, itt is igaz: a hatékonyság fordítottan arányos az óvatossággal. A ChatGPT vagy a Claude konzolban való használata nem olyan, mint egy függvénykönyvtár behívása. Egy kreatív, de véletlenszerű elemekkel is operáló rendszerrel kommunikálsz, amely nem érti a kód szándékát, csak a mintaillesztésen keresztül próbálja kielégíteni a kérelmedet.

Vegyünk át néhány kritikus buktatót és egy elkerülhetetlen biztonsági alapelvet, mielőtt belevágnál a következő promptba.

Gyakori buktatók: Amikor az AI úgy tesz, mintha tudná

1. A „működik látványra” csapda: Az AI gyakran olyan kódot ad vissza, amely logikailag helytelen, de a felületén nem látszik. Egy tipikus példa a hiányzó hibaellenőrzés vagy a feltételezett adatstruktúra. Fogadni mernék, hogy a generált formatHungarianDateTime függvényünk az első példából simán visszaadná az 'Érvénytelen dátum' szöveget egy üres string esetén, de soha nem dobna egy konkrét Error-t, amit elkaphatnál. Az AI ritkán veszi a fáradtságot, hogy a kódod része legyen egy szilárd hibaüzenet-kezelési stratégiának. Ezt neked kell kikérned, vagy utánnad kell ellenőrizni.

2. A frissesség illúziója: A legtöbb nagy nyelvi modell tudása nem valós idejű. Ez azt jelenti, hogy bár tökéletesen írhat egy Vue 2 Options API példát, a Vue 3 legújabb Composition API funkcióiról, vagy a PHP 8.3 specifikus újításairól lehet, hogy nem tud – vagy rosszabb: öntudatlanul keverve ad régi és új szintaxist. Prompt elején mindig érdemes lefixálni: *”Használd a [Technológia] legfrissebb stabil verziójának szintaxisát.”* De a végső ellenőrzés dokumentációval mindig a te feladatod marad.

3. A biztonság kontra kényelem: Ez talán a legsúlyosabb pont. Az AI célja, hogy kielégítse a kérést. Ha azt kéred, *”Írj egy PHP funkciót, ami feltölti a feltöltött képet a ../uploads/ mappába”*, valószínűleg kapni fogsz egy kódot, ami ezt megcsinálja. De nem fog automatikusan: * Ellenőrizni a fájltípust (MIME type vs. kiterjesztés). * Átnevezni a fájlt, hogy elkerüld az overwrite és path traversal támadásokat. * Beállítani megfelelő fájlengedélyeket. * Megszorozni a maximális fájlméretet. A generált kód gyakran a legegyszerűbb, legkevésbé biztonságos utat mutatja, mert az a leggyakoribb a tanító adatokban. A biztonságot expliciten kell kérni.

Az Egyetlen Nem Áthágható Biztonsági Szabály

SOHA, de SOHA ne futtass ismeretlen eredetű, AI által generált kódot éles szerveren, éles adatbázison vagy éles környezetben anélkül, hogy alaposan meg nem értetted, tesztelted és auditáltad volna.

Nézzünk egy konkrét, veszélyes példát, ami könnyen előfordulhat:

Tegyük fel, hogy kérsz egy PHP funkciót adatbázisból való törléshez.

// Egy AI által generált, naiv és veszélyes példa
function deleteUser($userId) {
    $conn = new mysqli('localhost', 'user', 'password', 'database');
    $sql = "DELETE FROM users WHERE id = " . $userId;
    return $conn->query($sql);
}

Ez a kód több halálos hibát is tartalmaz: 1. SQL Injection: Közvetlen változó beillesztés az SQL stringbe. Katasztrófa. 2. Éles hitelesítő adatok a kódban: Soha ne legyenek így kódolva. 3. Nincs tranzakciókezelés vagy hibaellenőrzés.

A helyes, biztonságos prompt így hangozhatna: > „Készíts egy biztonságos PHP PDO funkciót, amely töröl egy felhasználót id alapján a users táblából. A függvény: > 1. Fogadjon egy PDO kapcsolat objektumot paraméterként. > 2. Használjon prepared statementet (WHERE id = :id). > 3. Legyen egy try-catch blokkban, amely hibát logol és false-t ad vissza hiba esetén. > 4. Térjen vissza true-val a sikeres törlés után. > 5. NE tartalmazza a kapcsolati adatokat magában a kódban.”

Összegzés: Az AI mint a Legjobb Gyakorlatok Könyvtára

A prompt trükkök lényege végül is nem a lustaság, hanem az okos munkavégzés. A ChatGPT vagy a Claude nem fog helyetted gondolkodni, de hihetetlenül felgyorsíthatja azt a folyamatot, amikor *már tudod, mit akarsz, de szükséged van a pontos szintaxisra, egy alternatív megközelítésre, vagy egy második véleményre a logikádról.*

Gondolj rá úgy, mint egy óriási, mindig elérhető, végtelenül türelmes szenior fejlesztőre, aki ismeri a legtöbb nyelvet és keretrendszert, de nem ismeri a te konkrét projektjeidet, üzleti logikádat és biztonsági követelményeidet. A te feladatod a szakértelem, a kontextus és a végleges felelősség. Az övé a gyorsaság, a mintafelismerés és az alternatívák előállítása.

Használd a promtokat ahogy a példákban mutattuk: konkrétan, kontextussal, korlátozásokkal és egyértelmű szerepkör-meghatározással („elemzd”, „hasonlítsd össze”, „javasolj alternatívát”). Kerüld az általános kérdéseket, és mindig kérj magyarázatot a *miértre*. Így a konzol mellett az AI nem egy rejtélyes fekete doboz, hanem a legerősebb kiegészítőd lesz a valódi fejlesztői kihívások – az architektúra, a teljesítmény és a felhasználói élmény – megoldásában.

A weboldalon megjelenő szöveges és vizuális tartalmak előállításához mesterséges intelligenciát (AI) használunk.