Com crear una aplicació web amb ChatGPT

Com crear una aplicació web amb ChatGPT
Lectors com tu ajuden a donar suport a MUO. Quan feu una compra mitjançant enllaços al nostre lloc, podem guanyar una comissió d'afiliats. Llegeix més.

Una de les afirmacions més importants de l'exageració que envolta ChatGPT és que pot ser una eina de programació eficaç. La idea és la següent: descrius el que vols en llenguatge natural; el chatbot genera codi que fa exactament això. Però, com de bo és realment ChatGPT per fer això?





què és el mode retrat a l'iPhone 7
MAKEUSEO VÍDEO DEL DIA DESPLACEU PER CONTINUAR AMB EL CONTINGUT

Quina millor manera d'esbrinar-ho que posar-ho a prova? Vam demanar a ChatGPT que creés una aplicació web senzilla des de zero. Aquí teniu el resultat de la nostra prova i els passos que podeu seguir per crear un lloc web des de zero amb ChatGPT.





Pas 1: generació del pla per a la vostra aplicació web

De la mateixa manera que faríeu quan creeu una aplicació web amb qualsevol eina, haureu d'establir el plànol de com voleu que sigui la vostra aplicació i els passos que necessitareu per crear-la abans de deixar que ChatGPT executi el programa.





Per a la nostra primera tasca, vam demanar a ChatGPT que desenvolupés un pla per a una aplicació de xat senzilla. Per fer-ho, vam descriure els requisits de la nostra aplicació web i després vam demanar al chatbot que detallés un pla per desenvolupar l'aplicació.

  Sol·licitud de ChatGPT per desenvolupar un pla per a l'aplicació web

Després d'utilitzar el missatge anterior, aquí teniu el resultat que hem obtingut:



  Diagrama de flux o plànol de l'aplicació web desenvolupada per chatgpt

Hauríeu de tenir el connector 'Mostra'm' habilitat al vostre compte de ChatGPT per generar un diagrama de flux com el nostre anterior. Tu pots instal·leu i utilitzeu connectors de ChatGPT en pocs passos, tot i que necessitareu una subscripció premium.

Sense el connector, obtindreu un plànol basat en text o un diagrama de flux d'art ASCII. Això encara està bé. Fins i tot sense el connector, ChatGPT encara hauria de proporcionar un projecte clar de l'aplicació com l'exemple següent.





  Desglossament basat en text de l'aplicació web per ChatGPT

Pas 2: Divisió del pla en mòduls més petits

Ara que tenim el panorama general, vam demanar ajuda a ChatGPT per dividir l'aplicació en components més petits que podem desenvolupar per separat i després integrar per formar l'aplicació web completa. ChatGPT va suggerir dividir-lo en tres components:

  1. Mòdul de registre
  2. Mòdul d'inici de sessió
  3. Mòdul de xat

Teníem altres idees, però l'objectiu aquí és deixar que ChatGPT s'encarregui.





1. Creació del Component de registre

Ens vam posar directament a crear el component de registre. Vam demanar a ChatGPT que elaborés un algorisme adequat. Aquí vam intervenir especificant que només necessitem el nom d'usuari, el correu electrònic i l'avatar de l'usuari per al registre. Aquí teniu la indicació:

  Sol·licitud per crear el component de registre

I aquí teniu el resultat:

  Algorisme per al registre d'usuaris

A continuació, vam demanar a ChatGPT que creï el component de registre.

  sol·licitud per generar el component de registre

Tot i que no vam incloure el camp de la contrasenya com a part del procés de registre, ChatGPT va fer la trucada correcta inclòs-lo al codi HTML generat. Vam copiar el codi sense cap modificació, i així és com es veu en un navegador.

  Pàgina de registre generada per ChatGPT

A continuació, vam demanar a ChatGPT que generi l'script de registre de PHP. Al principi, vam demanar 'Escriu un codi PHP per a la lògica del servidor per gestionar l'enviament del formulari'. Tot i que l'script generat funcionava bé, tenia moltes vulnerabilitats.

No hi havia hashing de contrasenyes, cap gestió d'errors i era propens a la injecció SQL: ChatGPT només feia el mínim. Arreglar això va ser relativament fàcil. Simplement li vam demanar a ChatGPT que 'identifiqués tot el que està malament amb el codi que acabeu de generar i després utilitzeu els punts identificats per optimitzar el codi'. Amb això, el nostre script de registre PHP estava a punt per funcionar.