Design și cod

Pentru ce e. Construirea unei aplicații după un design făcut de tine în Figma. Setherion randează cadrul, îi citește aranjarea, culorile, literele și spațierea și construiește pornind de la ele.

Conectare. Apasă Connect Figma pe pagina Connectors, autentifică-te la Figma și întoarce-te. Nu ai chei de copiat. Accesul este doar pentru citire: Setherion nu-ți poate schimba niciodată fișierele. Se folosește cât construiești și nu face niciodată parte din aplicația pe care o publici. Figma nu arată costuri de utilizare din partea Setherion.

Cum îl folosești. În editor apasă +, apoi Design, apoi Import from Figma. În panoul de control se găsește sub +, la Import a design, unde se oferă și Canva. În Figma, dă clic dreapta pe cadrul dorit și alege Copy link to selection, lipește linkul și apasă Import frame. Cadrul este atașat mesajului tău împreună cu o descriere a lui și cu culorile, fonturile și spațierea lui exacte, iar aplicația este reconstruită după el.

Cere. „Reconstruiește pagina de start după acest cadru.” „Folosește culorile și fonturile din designul meu Figma.”

Bine de știut. Linkul trebuie să arate spre un design, de forma figma.com/design/KEY?node-id=1-234. Bara de adrese a listei tale de fișiere nu este unul, iar importul îți spune asta. Dacă un link este refuzat, contul Figma conectat trebuie să poată deschide fișierul respectiv. Dacă Figma nu mai acceptă conexiunea, importul îți spune să te conectezi din nou.

Pentru ce e. Aducerea unui design Canva (un meniu, un fluturaș, un banner) într-o aplicație sub formă de imagini de plasat. Sunt grafică de pus pe o pagină, nu o schiță de reconstruit.

Conectare. Apasă Connect Canva, autentifică-te la Canva și întoarce-te. Nu ai chei de copiat. Setherion îți citește designurile și le exportă doar când imporți unul, iar nimic în Canva nu se schimbă.

Import din Canva. În editor apasă +, apoi Design, apoi Import from Canva. În panoul de control se găsește sub +, apoi Import a design. Deschide designul în Canva, copiază adresa din browser (are în ea /design/, iar o adresă scurtă canva.link nu merge), lipește-o și apasă Import design. Designul trebuie să fie al tău sau partajat cu tine.

Cere. „Pune meniul pe care tocmai l-am importat pe pagina Menu.” „Folosește bannerul ca imagine principală a paginii de start.”

Limite.

• Primele trei pagini ale designului ajung ca imagini în conversație.
• Sunt exportate o singură dată, cât construiești, apoi găzduite împreună cu celelalte imagini ale aplicației. Linkurile de export ale Canva nu mai merg după o zi, de aceea o aplicație nu întreabă niciodată Canva cât rulează.
• Canva Free nu poate mări un design mult peste dimensiunea lui. Când Canva refuză un export mare, Setherion cere din nou la dimensiunea proprie a designului.
• Canva limitează câte exporturi poate face o persoană în câteva minute. Dacă spune asta, așteaptă și încearcă din nou.

Pentru ce e. Să-ți iei codul cu tine și să aduci cod înăuntru. Exportul pune aplicația într-un depozit al tău, ca pe un proiect obișnuit Vite și React. Importul reconstruiește o aplicație pe care o ai deja într-un depozit.

Conectare. Apasă Connect GitHub, autentifică-te și aprobă, sau folosește Connect GitHub în fereastra de export. Accesul se folosește când ceri să se trimită codul și nu face niciodată parte din aplicația pe care o publici. Acoperă și depozitele private.

Export. Deschide meniul Publish din editor și alege Export to GitHub. Dă un nume depozitului, alege dacă este Private repository (implicit) și apasă butonul. Dacă depozitul nu există, este creat. Exportă din nou oricând ca să-l actualizezi cu cele mai noi schimbări.

Import. În panoul de control apasă +, apoi Import an app, apoi GitHub. Conectează acolo GitHub ca să-ți vezi depozitele, și pe cele private, sau lipește adresa unuia public. Merge orice aplicație web: React, Next.js, Vue sau HTML simplu. Citirea se uită la ce face aplicația, nu la cum a fost construită. Fișierele secrete și cheile sunt lăsate deoparte. Vezi Importă o aplicație.

Limite. Exportul face parte din planurile plătite: pe Free butonul îți cere să treci la un plan superior. Importul costă o aplicație nouă plus citirea codului, iar primul tău import este gratuit: vezi Planuri și credite. Înregistrările dintr-o bază de date nu trec printr-un import, doar structura ei.

Bine de știut. Exportul este un buton în Publish, nu o cerere pe care o scrii în conversație.

Pentru ce e. Același lucru ca exportul GitHub, pentru GitLab: codul tău într-un depozit al tău.

Conectare. Apasă Connect GitLab, autentifică-te și aprobă, sau folosește Connect GitLab în fereastra de export. Se folosește când trimiți codul și nu devine niciodată parte dintr-o aplicație pe care o publici.

Export. Deschide meniul Publish din editor și alege Export to GitLab. Dă un nume depozitului, alege Private repository (implicit) sau nu, și apasă Export to GitLab. Exportă din nou ca să-l actualizezi. Este un proiect Vite și React care poate rula.

Limite. Exportul face parte din planurile plătite, ca la GitHub. GitLab nu are import: ca să aduci o aplicație dintr-un proiect GitLab, descarcă-o ca ZIP și folosește importul ZIP din Importă o aplicație.