Lovable vagy Claude Code 2026-ban: melyiket válaszd az első projektedhez?

Az Ailoot használatáról a dokumentációban találsz információt.

Mi a Lovable és a Claude Code?#

A Lovable egy böngészőalapú fejlesztőeszköz. Technikailag a Lovable az Anthropic Claude Opus modelljére épülő réteg: a vállalat nyilvánosan megerősíti, hogy a kereskedelmi és nyílt forráskódú modellek értékelése után a Claude-ot választotta elsődleges modelljéül (Anthropic ügyféltörténet: Lovable). Ezért a „Lovable vagy Claude” szembeállítás leegyszerűsíti a képet. A gyakorlatban rétegekről van szó: a Lovable kényelmes burkolat ugyanazon Claude körül, amelyet közvetlenül, a Claude Code-on keresztül is elérhetsz.

Mi történik, amikor megnyitod a lovable.dev oldalt:

1. Regisztrálsz a Google- vagy GitHub-fiókoddal.
2. Írsz egy promptot: „Készíts nekem egy CRM-et egy ingatlanközvetítő irodának, hitelesítéssel és ügyfél-adatbázissal.”
3. 30–60 másodperc alatt megjelenik egy működő webhely egy ingyenes *.lovable.app domainen, adatbázissal, bejelentkezési űrlappal és működő oldalakkal.
4. Ezután promptokkal finomítod: „Adj hozzá szűrőt az üzlet állapota szerint”, „Adj hozzá sötét témát”, „Integráld a Stripe-ot az előfizetéses fizetésekhez.”

A Claude Code az Anthropic programja, amelyet Macre, Windowsra vagy Linuxra telepíthetsz. A claude paranccsal futtasd a terminálban, a projektmappádon belül. Ezután szövegesen beszélgetsz vele: fájlokat olvas, kódot ír, parancsokat futtat és hibákat javít. 2026. április 16. óta az elsődleges modell az Opus 4.7; 2026. május 28. óta az Opus 4.8 is elérhető a Dynamic Workflows funkcióval (akár 1 000 párhuzamos alügynök) (Anthropic – Claude Opus 4.7).

A fő különbség egy mondatban: A Lovable egy webhely, amely webhelyeket épít neked. A Claude Code egy fejlesztő kolléga a terminálodban, aki követi az utasításaidat.

Ez a két álláspont valójában ugyanannak az útnak két szakaszát írja le. A Lovable eszköz arra, hogy „nulláról eljuss az egyig”, amikor még nem sajátítottad el a szakmát. A Claude Code a fejlődés eszköze, amikor már érted, hogyan épülnek az alkalmazások, és irányítani akarod a folyamatot.

Ki használja a Lovable-t, és ki a Claude Code-ot?#

Én úgy látom, ez olyan választás, mint a kész étel egy étteremben vagy az otthoni konyha. A Lovable az étterem: leülsz, rendelsz, és 20 perc múlva ott az étel előtted. A Claude Code a konyha: eszközök és alapanyagok, valamint egy asszisztens, aki az összes receptet ismeri, de te főzöl, és te döntöd el, mit és hogyan készítesz el.

A Lovable jó választás, ha:

• Még soha nem nyitottál meg terminált, és nem is szeretnél.
• Egy ötlet prototípusára van szükséged egy este alatt, hogy megmutasd egy partnernek vagy ügyfélnek.
• Szokványos terméket építesz: landing oldalt, CRM-et, piacteret, irányítópultot vagy érdeklődési űrlapot – olyasmit, amit a Lovable már több százszor elkészített.
• Készen állsz a React + Supabase stack használatára, és nincs szükséged Pythonra, Góra vagy mobilalkalmazásra.
• Nem zavar a havi 25–100 dolláros fizetős csomag, és nem aggódsz amiatt, hogy a kód a szolgáltatónál van.

A Claude Code jó választás, ha:

• Dolgoztál már projektmappákkal, és tudod, mi az a git és .env.
• Minden fájl felett irányítást akarsz, és magad szeretnéd kiválasztani a stacket.
• A projekted összetettebb az átlagosnál: Telegram-bot, adatfeldolgozó szkript, mobilalkalmazás vagy integráció nem szabványos API-val.
• Azt szeretnéd, hogy a kód a saját repódban legyen, ne a szolgáltatónál.
• Készen állsz megtanulni a CLAUDE.md és a kontextusmérnökség használatát a következetes eredményekért.

Szeretnéd találgatás nélkül kiválasztani a feladatodhoz illő kombinációt? Egy működő kombinációnak három eleme van: AI-klón + Second Brain + Context Engineering. Ez a kombináció bármely eszközt – a Lovable-t, a Claude Code-ot vagy mindkettőt – megbízható munkafolyamattá alakítja.

Mennyibe kerül az első projekt az egyes eszközökkel?#

Lovable: csomagok és kreditek

A Lovable hivatalos árazása 2026. májusi állapot szerint:

Egy kredit nagyjából egy promptnak felel meg. Egy apró stílusmódosítás 0,5 kreditet, egy hitelesítéssel ellátott új funkció 1,5+ kreditet emészt fel. A fő csapda: egy hibajavítási ciklus (amikor az AI kijavít valamit, de közben mást elront) az eredeti fejlesztésen felül 60–150 további kreditet is felhasználhat. A Pro csomagban 50 további kredit 15 dollárba kerül.

⚠️ Külön költséget jelent a Lovable Cloud (a platform felügyelt tárhelyszolgáltatása). Ez nincs benne az előfizetésben: egy munkaterület havonta 25 dollár értékű ingyenes tárhelyet és 1 dollár értékű ingyenes AI-használatot kap. Ezután használat alapján fizetsz (adatbázis-olvasás és -írás, edge functionök, tárhely). Egy ismert esetben egy kevesebb mint 100 aktív felhasználóval rendelkező projekt egy hét alatt elhasználta az ingyenes keretet.

Claude Code: csomagok és tokenek

A Claude hivatalos árazása 2026-ra:

API-tokenek is rendelkezésre állnak azoknak, akik saját integrációkat építenek: az Opus 4.8 egymillió bemeneti tokenenként 5 dollárba, egymillió kimeneti tokenenként 25 dollárba kerül. Részletekért lásd a Claude Code-hoz készült Opus 4.8 útmutatót.

Egy első projekt és egy komoly projekt valódi költsége

Vegyünk egy tipikus feladatot: „Építs egy ügyfélfoglaló webhelyet adatbázissal, foglalási űrlappal és adminisztrációs felülettel.”

Lovable: A Pro csomaggal (25 dollár) körülbelül 30–40 kredit kell az elkészítéshez és a finomításhoz. Beleférsz egyhavi előfizetésbe. Minden új termék vagy nagyobb áttervezés újabb havi előfizetést jelent, esetleges Lovable Cloud-költségekkel együtt.

Claude Code: A Pro csomaggal (20 dollár) ugyanez a feladat 3–4 óra munkát és körülbelül tíz AI-munkamenetet igényel. A havi korlát 2–3 ilyen, párhuzamosan futó projektre, valamint a rutinfeladatokra is elegendő: webhelyszövegek szerkesztésére, kisebb javításokra és automatizálási szkriptekre.

Hosszú távon még látványosabb a különbség. Egy fejlesztő 8 hónap alatt 10 milliárd tokent használt el a Claude Code-dal: ez az API-n keresztül több mint 15 000 dollárba kerülne, a Max csomaggal viszont körülbelül 800 dollárba. Ha egyszer készítesz el egy terméket, a Lovable és a Claude Code körülbelül ugyanannyiba kerül. Ha 5–10 projekted van, és rendszeresen dolgozol rajtuk, a Claude Code 5–6-szor olcsóbb.

Milyen kódot kapsz? A motorháztető alatt#

A Lovable-nél már előre adott a válasz arra a kérdésre, hogy „miben íródott ez?”. Minden alkalmazás a következőket használja:

• Frontend: React, Vite, Tailwind CSS, valamint a kész komponenseket tartalmazó shadcn/ui könyvtár.
• Backend: Supabase – PostgreSQL az adatbázishoz, Supabase Auth a bejelentkezéshez, Supabase Storage a fájlokhoz, Edge Functions Deno alatt a szerveroldali logikához.
• Valós idejű funkciók: Supabase Realtime WebSocketen keresztül a csevegéshez és a frissítésekhez.
• Fizetés: beépített Stripe-integráció.
• Tárhely: az ingyenes csomagban *.lovable.app, fizetős csomagban saját domain.

Ez az erőssége: egy bevált stack, amely a nem programozók feladatainak 80%-át lefedi. Ugyanakkor ez a korlátja is: ha a projekted Telegram-bot, PDF-dokumentum-feldolgozás, adatgyűjtő szkript vagy mobilalkalmazás, a Lovable nem megfelelő választás.

A Claude Code-dal te választod ki a stacket. Példaprojektek ezeket használták:

• Next.js + TypeScript + PostgreSQL egy alkotói platformhoz.
• Python + FastAPI egy ügyféltermék egyik háttérrendszeréhez.
• Telegram-botok TypeScriptben, a grammY könyvtárral.
• Adatfeldolgozó szkriptek Node.js-ben.

Ugyanaz a Claude Code bármilyen mappával és stackkel működik: elolvassa a projekt tartalmát, megérti a szerkezetét, és a megfelelő nyelvet használja. Ez szabadságot ad, de neked kell eldöntened, milyen stacket használsz.

Mi történik, ha beindul a termék: a projekt továbbfejlesztése#

Ezt a forgatókönyvet kevesen ellenőrzik a kezdetekkor, pedig ez jelenti a döntő különbséget a két eszköz között.

Tegyük fel, hogy létrehoztál egy feladatkövetőt a Lovable-ben. Népszerű lett. Az ügyfelek ezt írják: „Adj hozzá integrációt a CRM-ünkkel”, „Szükségünk van egy meghatározott szerkezetű Excel-exportálásra”, „Készíts mobilalkalmazást.” Mi történik?

• Egyszerű módosításokat promptokkal végzel, és krediteket használsz el.
• Az összetett módosítások gyakran beleütköznek az architekturális korlátokba: a Lovable nem ismeri a CRM-edet, az export formátuma nem szabványos, a mobilalkalmazás pedig más stacket igényel.
• A Lovable kódexportálást és szerkesztőben való munkát kínál – ez azonban már nem „vibe coding”. Ez hagyományos fejlesztés, amelyhez értened kell a Reacthez, a TypeScripthöz és a Supabase-hez.

A Claude Code-dal nincs ilyen váltás. Hozzáadsz egy CRM-integrációt – a Claude Code elolvassa a CRM dokumentációját, megír egy klienst, teszteli, majd commitolja. Mobilalkalmazásra van szükséged – nyitsz egy új mappát, kiadod a feladatot: „Készíts egy iOS-alkalmazást Swiftben, ugyanazt az API-t használva”, és megkapod az eredményt. A kontextus nem vész el, mert a repó a tiéd.

Ez nem jelenti azt, hogy a Lovable rossz – kiválóan elvégzi az első feladatot. Azt jelenti, hogy a Lovable a termék kiindulópontja, nem pedig az a hely, ahol hosszú távon él.

Amikor a Claude Code és a Lovable hibázik: melyiknél könnyebb javítani?#

Az AI mindig hibázik. A fő kérdés az, mennyi erőfeszítésbe kerül a hibák javítása.

Ha valami elromlik a Lovable-ben, 3 lehetőséged van:

1. Tovább promptolsz: „Javítsd ki, nem működik a gomb.” Gyakran működik, de néha nem.
2. Visszaállítasz a Lovable előzményeivel. A visszaállítás egyszerre N lépést ugrik vissza – nem pontos.
3. Átváltasz Dev Mode-ra (csak fizetős csomagokban), és kézzel szerkeszted a kódot.

Ha hiba van a Claude Code-ban:

1. Meglátod a hibát a terminálban vagy a böngészőben, és ezt mondod Claude-nak: „Itt a hiba, derítsd ki az okát.”
2. Ha zsákutcába jutsz, a /rewind parancs visszaállít az utolsó működő állapotra (útmutató a módosítások visszavonásához).
3. Saját magad is megnyithatod a fájlt, és kijavíthatsz egy sort – ez a te kódod.

A Claude Code előnye ebben az, hogy láthatod, mi változott, és hol van a hiba. A Lovable „fekete dobozként” működik – megkapod az eredményt, de az okot nem látod. Ez megnyugtató egy kezdőnek („nem kell utánajárnom”), de problémává válik, ha a termék összetettebb egy szabványos landing oldalnál.

4 forgatókönyv, amelyben a Lovable jobb a Claude Code-nál#

1. forgatókönyv: landing oldal űrlappal és adatbázissal. „Szeretnék egy oldalt, ahol az emberek megadják az e-mail-címüket, én pedig az adminisztrációs felületen láthatom, ki töltötte ki.” A Lovable-ben ez 10 percet vesz igénybe, dizájnnal, domainnel és SSL-lel együtt. A Claude Code-dal 1–2 óra kell a váz felépítéséhez, plusz még egy óra a közzétételhez. Egyszeri feladatra a Lovable messze jobb.

2. forgatókönyv: demóprototípus befektetőnek vagy partnernek. Egy 3 nap múlva esedékes találkozón meg kell mutatnod, hogyan „fog működni” a termék. A Lovable egy este alatt látványos, működő prototípust épít. Bemutathatod, és azt mondhatod: „Ez a logika ide kerül, az a logika pedig oda.” A partnered rákattint a gombokra, és valami valódit lát, nem egy PowerPoint-bemutatót.

3. forgatókönyv: ismert sablonra épülő szabványos termék. Egyszerű CRM egy ügynökségnek, hitelesítéssel ellátott ügyfélportál, grafikonos irányítópult. A Lovable már több százszor épített ilyen alkalmazásokat – a modell ismeri a mintákat. Nagyobb az esély, hogy már első próbálkozásra működő eredményt kapsz.

4. forgatókönyv: amikor a telepítés akadályt jelent. Ha valaki tényleg soha nem nyitott meg terminált, és nem áll készen a Node.js, a git és a VS Code megismerésére, a Lovable olyan eredményt adhat neki, amire a Claude Code nem képes. Egy működő prototípus jobb, mint egy el sem kezdett projekt.

4 forgatókönyv, amelyben a Claude Code jobb a Lovable-nél#

1. forgatókönyv: bármilyen nem webes projekt. Telegram-bot, amely válaszol az ügyfeleknek, és nyomon követi a megkereséseket. Szkript, amely óránként adatokat gyűjt a versenytársak webhelyeiről, majd összefoglalót küld a Slackre. PDF-feldolgozó, amely adatokat nyer ki könyveléshez. Ezeket a Lovable-ben nem építheted meg – az eszköz csak webre való. A Claude Code-ban ezek tipikus esti projektek.

2. forgatókönyv: komoly, hosszú távú termék. Ha termék köré építesz vállalkozást, a kódnak a saját GitHub-repódban és infrastruktúrádon kell lennie, mindent pedig irányítanod kell. A Lovable mindig a platformhoz köt: exportálhatod a kódot, de nehezebb nélküle továbbfejleszteni (a stack merev, az architekturális döntéseket pedig mások hozzák meg helyetted). A Claude Code-dal kezdettől fogva a tiéd a kód.

3. forgatókönyv: nem szabványos architektúra vagy stack. Node.js helyett Bunt szeretnél. Postgres + Redis + ClickHouse kell. Pythont szeretnél az AI-komponenshez, Gót pedig egy mikroszolgáltatáshoz. Workerfolyamatokat, sorokat és WebSocketeket akarsz a Supabase-en kívül. A Lovable-ben ezek vagy lehetetlenek, vagy a kód kézi szerkesztésével lehet csak „áttörni” a korlátokat – ezzel elvész a fejlesztőeszköz előnye.

4. forgatókönyv: amikor szükséged van egy second brainre a projekthez. Egy komoly termékhez a kód önmagában nem elég; kontextus is kell: az üzleti modell, a célközönség, a jogi korlátok és a célok. Ez a kontextus a kód mellett található business/ mappában, a Claude Code pedig minden kérésnél beolvassa (útmutató a Claude Code-hoz készült second brainhez). A Lovable e réteg nélkül működik – technikailag működő terméket kapsz anélkül, hogy értenéd, „miért”.

Hibrid megoldás: Lovable → Claude Code ugyanazon a projekten#

Ez a minta egyszerű: mindkét eszköz a maga feladatában jó, ezért nem kell „egyiket vagy másikat” választanod.

Így működik:

1. Ötletfázis. Egy este a Lovable-lel. Írd le, mit szeretnél, és kapsz egy adatbázissal, hitelesítéssel és néhány oldallal ellátott, működő prototípust. Ez elegendő ahhoz, hogy megmutasd egy partnernek, vagy 5 interjút készíts lehetséges ügyfelekkel.

2. Validációs szakasz. Dolgozz tovább a Lovable-ben, amíg a termék egyszerű. Tölts el 1–2 hetet promptolással, kisebb módosításokkal és új adatbázismezők hozzáadásával.

3. Átadási szakasz. Amikor eléred a Lovable korlátait (Telegram-botra, összetett logikára vagy másik nyelvre van szükséged), exportáld a kódot Dev Mode-on keresztül (Pro csomag szükséges), és klónozd a repót helyben.

4. Fejlesztési szakasz. Nyisd meg VS Code-ban, és futtasd a Claude Code-ot ugyanabból a mappából. Claude így látja a Lovable által készített kódot, és folytathatja a fejlesztését. Az architektúra változatlan marad (React + Supabase), de az irányítás hozzád kerül.

A hátrány: az első hónapban (vagy még tovább) fizetsz a Lovable-ért, aztán úgyis átváltasz a Claude Code-ra. Ez további 25–50 dollár. Cserébe megspórolod a fejlesztés első hetét. A legtöbb be nem induló ötletnél ez a 25 dollár jól elköltött pénz: gyorsan megtudod, mi nem működött, anélkül, hogy két hetet fektetnél egy később kidobandó vázba.

Egy nap alatt építette újjá a fő webhelyét 12 integrációval (Stripe, Customer.io, Meta Pixel) a Lovable-ben, majd a Claude Code-dal 2 nap alatt élesítette a challenge prompts funkciót a várt 2 hét helyett.

5 Lovable-buktató, amelyről senki sem ír#

1. buktató: az ingyenes csomag 1–2 estére elég. A napi 5 kredit elegendő egy alkalmazásvázra és néhány módosításra. Utána vagy vársz egy napot, vagy fizetsz 25 dollárt.

2. buktató: a kódhoz csak Pro+ csomaggal férsz hozzá. Az ingyenes csomagban nem töltheted le a kódot, nem nyithatod meg szerkesztőben, és nem adhatod át fejlesztőnek. Ha úgy döntesz, hogy távozol, magasabb csomagra váltasz, vagy mindent elölről kezdesz.

3. buktató: szoros kötődés a Supabase-hez. Ha később saját szerveren szeretnéd futtatni a PostgreSQL-t, saját hitelesítésre cserélnéd a Supabase Authot, vagy bármilyen nem webes háttérrendszert kapcsolnál hozzá, az fájdalmas lesz. A stack az alapokba van beépítve.

4. buktató: a felület nyelve. A Lovable alapértelmezés szerint angol nyelvű alkalmazásfelületeket készít. A promptban kifejezetten add meg a kívánt nyelvet, például: „készítsd el a preferált nyelvemen”. Néhány szöveg így is angol maradhat, különösen a rendszerhibák és a beviteli mezők ellenőrző űrlapjai. Ezeket külön promptokkal javíthatod.

5. buktató: a Supabase biztonsága alapértelmezés szerint lyukas. Ez a legfontosabb dolog, amelyet az elején senki sem említ. A kutatók a Lovable hivatalos bemutatójában szereplő 1 645 alkalmazást ellenőrizték – közülük 170-nél (10,3%) kritikus Row Level Security-probléma volt a Supabase-ben. Bármely bejelentkezett felhasználó elolvashatta, módosíthatta és törölhette mások adatait. Valós alkalmazásokban a kutatók ügyfelek címeihez, tartozásainak összegéhez és éles Stripe-kulcsokhoz fértek hozzá (CVE-2025-48757). Ennek oka, hogy a Lovable létrehozza a Supabase-táblákat, de alapértelmezés szerint nem engedélyezi az RLS-házirendeket. A megoldás: az első indítás után manuálisan engedélyezd az RLS-t minden táblán, és ellenőrizd a Supabase dokumentációja alapján. Ha valódi felhasználói adatokat tartalmazó terméket építesz, ezt nem lehet „későbbre” hagyni – végezd el „közvetlenül az első build után”.

5 Claude Code-buktató, amely eltántoríthatja a kezdőket#

1. buktató: a telepítés az első akadály. A kezdéshez telepítened kell a Node.js-t, az npm-et, a gitet, a VS Code-ot és magát a Claude Code-ot. Windowson ehhez a WSL megismerése is szükséges. Macen egyszerűbb, de akkor is meg kell nyitnod a terminált. Ha ezt még sosem csináltad, az első 30 perc azzal telik, hogy kiderítsd, „hogyan kell elindítani”.

2. buktató: kontextus nélkül egy nap alatt elhasználhatod a keretet. A 20 dolláros Pro csomagban az üzenetek és tokenek alapján számítják a korlátokat. Ha minden alkalommal 50 projektfájlt küldesz el Claude-nak, 2–3 óra alatt eléred a korlátot. A megoldás a kontextusmérnökség: csak a szükséges dolgokat add meg, használd a /clear és /compact parancsot, és tartsd karban a CLAUDE.md fájlt (útmutató a korlátokhoz).

3. buktató: hallucinációk kontextus nélkül. A Claude Code intelligens, de ha nem érti a projektedet, kitalálhat API-metódusokat, adatbázismezőket vagy könyvtárakat. A szabályokat tartalmazó CLAUDE.md és a second brainként szolgáló business/ mappa nélkül az eredmény lutri. Ezekkel megbízható munkafolyamatot kapsz (útmutató a CLAUDE.md-hez).

4. buktató: hozzáférési és vállalati tulajdonosi korlátozások. 2025 szeptemberében az Anthropic letiltotta azokat a vállalatokat, amelyek több mint 50%-os tulajdonosai Kínából, Iránból és Észak-Koreából származó entitások voltak. A hozzáférési feltételek a szolgáltatótól és a tulajdonosi szerkezettől függenek; eszközválasztás előtt ellenőrizd őket.

5. buktató: nincs vizuális szerkesztő. Minden interakció szövegen keresztül zajlik. Ha egy gombot 10 pixellel jobbra szeretnél mozgatni, nem húzhatod arrébb – szavakkal kell leírnod. Tervezési feladatokra ez kevésbé kényelmes, mint a vizuális fejlesztőeszközök, például a Lovable.

Választás 5 perc alatt: döntési táblázat#

Válaszolj 5 kérdésre, és kapsz egy ajánlást:

Ha az első két sorban a Lovable oszlopába teszel ✅-t, a többiben pedig ⚪-t vagy ❌-t, válaszd a Lovable-t. Ha a 3–5. sorban a Claude Code oszlopába teszel ✅-t, válaszd a Claude Code-ot. Ha mindkét oszlopban van ✅, használd a Lovable-t az első 1–2 hétben, majd válts Claude Code-ra (lásd fent a hibrid szakaszt).

Még egy dolog: bármelyik eszközt választod, nem maga az AI jelenti a szűk keresztmetszetet. Az számít, hogyan dolgozol vele. A három pillér kombinációja (AI-klón + Second Brain + Context Engineering) bármelyik eszközzel következetes eredményt ad. Nélkülük az AI hallucinál; velük megbízható gépként működik.

Teljes útmutató az egy este alatt végzett vibe codinghoz: AI-klón + Second Brain + Context Engineering.

Ismerd meg az Ailootot.