Mistral Le Chat führt Code im Browser

Mis­tral AI hat Le Chat Can­vas ein­ge­führt, einen Arbeits­be­reich, in dem man klei­ne Web­an­wen­dun­gen direkt im Chat erstel­len kann. Man muss nur nach einer HTML-Sei­te oder einer React-Kom­po­nen­te fra­gen, und der Code erscheint in einem Edi­tor, den man sofort anpas­sen kann. Eine Vor­schau-Schalt­flä­che zeigt Lay­out und Far­ben in Echt­zeit an. Doch Can­vas ver­öf­fent­licht die Arbeit nicht live , die­ser Schritt erfolgt wei­ter­hin an ande­rer Stel­le. Neu­gie­rig, wie der gesam­te Pro­zess tat­säch­lich abläuft ?

Was ist Le Chat Canvas ?

Stel­len Sie sich Le Chat Can­vas als einen inte­grier­ten Arbeits­be­reich vor, nicht nur als ein wei­te­res Chat­fens­ter. Es ist ein Pop-up-Bereich, der sich direkt in le Chat öff­net, wann immer Sie Platz brau­chen, um etwas Ech­tes zu erschaf­fen. Möch­ten Sie ein Doku­ment ent­wer­fen, etwas Code anpas­sen oder eine schnel­le Tabel­len­kal­ku­la­ti­on erstel­len ? Can­vas bie­tet Ihnen die­sen gemein­sa­men Raum, um zusam­men mit der KI zu arbei­ten, anstatt nur Ant­wor­ten zu lesen.

Die­ser Auf­bau lässt kol­la­bo­ra­ti­ves Bear­bei­ten natür­lich wir­ken. Sie kön­nen bei null anfan­gen und Ihr Pro­jekt Schritt für Schritt gestal­ten. Genau hier kommt das ite­ra­ti­ve Ent­wer­fen ins Spiel, Sie über­ar­bei­ten, sehen eine Vor­schau und pas­sen an, ohne frü­he­re Ver­sio­nen zu ver­lie­ren. Sie kön­nen sogar meh­re­re Can­va­ses gleich­zei­tig geöff­net hal­ten und frei zwi­schen Auf­ga­ben wech­seln. Can­vas unter­stützt außer­dem Live-Vor­schau­en und lässt Sie Doku­men­te, Prä­sen­ta­tio­nen, Code und Mock­ups direkt inner­halb der­sel­ben Ober­flä­che erstellen.

Ein­fach gesagt, es ist Ihr Sand­kas­ten, um Ideen in fer­ti­ge Arbeit zu verwandeln.

Wie erstellt und zeigt man Web-Apps in Canvas an ?

Der Auf­bau einer Web-App in Can­vas beginnt mit einem ein­fa­chen Wech­sel. Fra­gen Sie ein­fach nach einer HTML-Sei­te oder einer React-Kom­po­nen­te, und Can­vas öff­net einen Arbeits­be­reich , der zum Erstel­len gedacht ist. Geben Sie Ihre Anfra­ge ein und beob­ach­ten Sie, wie der Code direkt im Edi­tor erscheint. Wäh­rend Can­vas ein­fa­che Web­an­wen­dun­gen und Mock-up-Web­sites erstel­len kann, ist es nicht so fort­schritt­lich wie spe­zia­li­sier­te No-Code-KI-App-Buil­der für kom­ple­xe Projekte.

Möch­ten Sie Ände­run­gen vor­neh­men ? Kli­cken Sie in den Code und begin­nen Sie sofort mit der Live-Bear­bei­tung. Es ist nicht nötig, das gesam­te Pro­jekt jedes Mal neu zu star­ten, wenn Sie eine klei­ne Anpas­sung vornehmen.

Sobald Sie bereit sind, Ihre Arbeit zu betrach­ten, tip­pen Sie auf die Vor­schau-Augen-Schalt­flä­che. Dies bie­tet Ihnen eine sofor­ti­ge Vor­schau Ihrer App direkt im Brow­ser. Sie sehen Lay­out, Far­ben und Schalt­flä­chen leben­dig wer­den, bevor Sie sich auf etwas festlegen.

Pas­sen Sie wei­ter an und schau­en Sie sich dann erneut die Vor­schau an. Es ist ein ein­fa­cher Rhyth­mus, der Ihr Pro­jekt Schritt für Schritt voranbringt.

Kann Le Chat Canvas Ihre Webanwendung bereitstellen ?

Also, sobald dei­ne App im Vor­schau­mo­dus genau rich­tig aus­sieht, was pas­siert dann ? Hier ist die ehr­li­che Wahr­heit : Can­vas ver­öf­fent­licht dein Pro­jekt nicht von sich aus live. Das ist der Deploy­ment-Mythos, den man früh­zei­tig auf­klä­ren soll­te. Can­vas bie­tet dir einen fan­tas­ti­schen Raum, um dei­nen Code zu erstel­len, anzu­pas­sen und zu ver­fei­nern, aber ihn für die Welt zu ver­öf­fent­li­chen erfor­dert einen wei­te­ren Schritt.

So sieht die­ser Schritt aus :

1. Expor­tie­re dei­nen fer­ti­gen Code aus Canvas.
2. Wäh­le eine Hos­ting-Platt­form, die zu dei­nem Pro­jekt passt.
3. Lade dei­ne Datei­en hoch und kon­fi­gu­rie­re die grund­le­gen­den Einstellungen.
4. Star­te dei­ne App für den öffent­li­chen Zugriff.

Betrach­te Can­vas als dei­ne Werk­statt, nicht als dein Laden­ge­schäft. Für Free­lan­cer, die nach Frei­heit stre­ben, bedeu­tet die Erkun­dung von Hos­ting-Alter­na­ti­ven, dass du die Kon­trol­le dar­über behältst, wo, und wie, dei­ne Arbeit live geht. Mis­tral hat außer­dem bevor­ste­hen­de Daten­kon­nek­to­ren bestä­tigt, die es Can­vas-Pro­jek­ten künf­tig ermög­li­chen wer­den, sich direk­ter mit Doku­men­ten, E‑Mails und ande­ren Diens­ten zu verknüpfen.