Průvodce pro začátečníky k používání Velo od Wix

Velo je produkt Wix s twistem. Wix je jednou z nejpopulárnějších vývojářských platforem na webu. Umožňuje návrhářům (a průměrnému majiteli webových stránek) vytvářet úžasné webové stránky bez psaní jediného řádku kódu.

S Velo Wix rozšiřuje svou uživatelskou základnu o vývojáře. Velo je full-stack vývojová platforma, která uživatelům umožňuje vytvářet skvělé webové stránky pomocí kódu. Jediný programovací jazyk, který potřebujete znát, abyste mohli používat Velo, je JavaScript. Platforma podporuje moderní funkce JavaScriptu a používá serverový systém založený na NodeJS.

V tomto článku se dozvíte o jedinečných funkcích Velo a o tom, jak je používat.

Vývojářské funkce Velo

Vývojová platforma Velo má vestavěné IDE, které umožňuje vývojářům psát kód JavaScript a sledovat změny v reálném čase. Velo běží na serveru NodeJS, což znamená, že vývojář má přístup k balíčkům npm a dalším vývojářským nástrojům. Mezi tyto vývojářské funkce patří:

• Schopnost vytvářet vlastní rozvržení a interakce na webové stránce.
• Schopnost vytvářet kolekce v databázi.
• Možnost vytvářet vlastní API pro váš web.

Vytvoření webu pomocí Velo

Chcete-li používat Velo, budete muset přejít na jeho hlavní web. Jakmile tam budete, vyberte možnost zahájit nový projekt. To vás provede zvykem Proces vytváření webu Wix, kde si budete muset vybrat typ webu, který chcete vytvořit. Šablonu si můžete vybrat buď sami, nebo pomocí Wix ADI.

Poté, co vyberete možnost úpravy šablony, uvidíte něco jako následující uživatelské rozhraní:

Vlevo od obrázku výše je postranní panel struktury webu, který vám umožňuje přístup k různým souborům JavaScript připojeným ke všem stránkám na vašem webu. Aktuálně vybraná stránka je domovská stránka, a pokud se podíváte na spodní část obrázku výše, uvidíte editor kódu zobrazující obsah souboru HOME.js.

Vytváření vlastní struktury rozvržení a interakcí

Šablona vybraná pro tento článek je internetový wellness obchod. Domovská stránka tohoto webu má „nejpopulárnější“, což můžete vidět na následujícím obrázku:

Pokud však chcete pro tuto sekci použít jiný nadpis, můžete toho dosáhnout v editoru Velo vložením následujícího kódu do souboru HOME.js.

Soubor HOME.js

$w.onReady(funkce () {
 $w('#text20').text = 'TRENDNÍ POLOŽKY'
});

Výše uvedený kód aktualizuje nadpis „nejpopulárnější“ na „trendy“ a tuto aktualizaci můžete zobrazit kliknutím na tlačítko náhledu v pravém horním rohu rozhraní Velo. Na domovské stránce v příslušné sekci byste měli vidět něco jako následující výstup:

Práce s databází Velo

Většina dynamických webů má databázi, která ukládá data různě v závislosti na typu. Velo ukládá svá data do kolekcí ve své centrální databázi. Chcete-li získat přístup k této databázi, budete muset přejít do tabulky řádků a sloupců nalevo od vývojářského rozhraní Velo.

Jak můžete vidět na obrázku výše, každá šablona Wix je dodávána s některými výchozími kolekcemi v závislosti na typu webu. Šablona webu vybraná pro tento článek je wellness obchod. Proto má kolekci výchozích produktů, které můžete snadno nahradit vašimi položkami.

Příbuzný: Jak si vybudovat profesionální online přítomnost s Wix

Pokud však chcete vytvořit svou sbírku od začátku, mají také tuto možnost.

Chcete-li vytvořit novou sbírku ve své databázi Velo, jednoduše najeďte myší na sekci „sbírky obsahu“ a napravo od textu se objeví ikona plus.

Kliknutím na možnost nové kolekce na obrázku výše vygenerujete následující formulář pro vytvoření sbírky:

Zadáním názvu sbírky a kliknutím na tlačítko vytvořit se dostanete na následující stránku správce obsahu:

Na stránce správce obsahu výše můžete začít plnit svou sbírku produktů pomocí příslušných ikon plus. Než však začnete přidávat produkty do své sbírky, budete muset vytvořit příslušná pole.

Podívejte se na stránku správce obsahu výše; v současnosti má jedno pole – název. Toto pole nemůžete smazat, protože se jedná o primární pole (nebo jedinečný identifikátor), které musí mít každá kolekce. Můžete mu však dát vhodnější název, například název produktu nebo ID.

Chcete-li změnit název existujícího pole ve vaší sbírce, jednoduše klikněte na příslušné pole a zobrazí se několik možností.

Výběrem možnosti vlastnosti, kterou můžete vidět na obrázku výše, se zobrazí následující vyskakovací formulář:

Vyskakovací formulář výše vám umožňuje změnit název pole zadáním požadovaného názvu do textového pole označeného „název pole“ a kliknutím na tlačítko Uložit.

Přidání nového pole

Existují dva způsoby, jak přidat nové pole do sbírky. První možností je kliknout na ikonu plus napravo od stávajícího titulu v kolekci. Tato metoda vygeneruje následující formulář:

Nový formulář pole vám umožňuje zadat název pole, klíč pole (pro integraci do vašeho kódu) a typ pole. Typ pole může být některý z následujících:

• Text
• obraz
• Boolean
• Číslo
• Datum a čas
• Čas
• Bohatý text
• Odkaz
• Vícenásobná reference
• URL

Druhým způsobem, jak přidat nové pole do sbírky, je kliknout na sekci „skrytá pole“ a vybrat možnost „Přidat pole“ ze seznamu vyskakovacích polí. Měli byste vidět něco jako obrázek níže:

Přidání položek do sbírky Chcete-li do své sbírky přidat novou položku, můžete kliknout na tlačítko „Přidat položku“ na pravé straně stránky Správce obsahu nebo kliknout na znaménko plus pod názvy polí. Po přidání první položky do sbírky by měla vypadat takto:

Nyní můžete do své sbírky přidat co nejvíce položek pomocí jedné z výše uvedených metod. Chcete-li však svůj web aktualizovat jakoukoli sbírkou, budete muset web nejprve publikovat.

Co dělá Velo vzrušujícím

Nyní víte, jak upravit svůj web pomocí kódu JavaScript v IDE Velo. V databázi Velo můžete také vytvářet vlastní kolekce s libovolným počtem položek. Co je ale dost možná nejlepší na Velo, je schopnost importovat a používat balíčky npm.

Co je npm? Vysvětlení správce balíčků JavaScript

Vylepšete své projekty pomocí balíčků npm.

Přečtěte si další

O autorovi