Wix-ի Velo-ի օգտագործման սկսնակների ուղեցույց

Wix-ը ստանում է ավելի հզոր անհատականացման և ծրագրավորման առանձնահատկություններ Velo-ի միջոցով: Ահա թե ինչպես օգտագործել այն:

Velo-ն շրջադարձով Wix արտադրանք է: Wix-ը վեբում մշակման առավել հայտնի հարթակներից մեկն է: Այն թույլ է տալիս դիզայներներին (և կայքի սովորական սեփականատիրոջը) ստեղծել զարմանալի կայքեր՝ առանց կոդ գրելու:

Velo-ի հետ Wix-ն ընդլայնում է իր օգտատերերի բազան՝ ներառելով մշակողներին: Velo-ն ամբողջական փաթեթի զարգացման հարթակ է, որը թույլ է տալիս օգտվողներին ստեղծել հիանալի կայքեր՝ օգտագործելով կոդ: Միակ ծրագրավորման լեզուն, որը դուք պետք է իմանաք Velo-ն օգտագործելու համար JavaScript-ն է: Պլատֆորմն աջակցում է ժամանակակից JavaScript-ի առանձնահատկություններին և օգտագործում է NodeJS-ի վրա հիմնված սերվերային համակարգ:

Այս հոդվածում դուք կսովորեք Velo-ի եզակի առանձնահատկությունների և դրանց օգտագործման մասին:

Velo-ի մշակողի առանձնահատկությունները

Velo մշակման հարթակն ունի ներկառուցված IDE, որը թույլ է տալիս ծրագրավորողներին գրել JavaScript կոդ և տեսնել փոփոխությունները իրական ժամանակում: Velo-ն աշխատում է NodeJS սերվերի վրա, ինչը նշանակում է, որ մշակողը մուտք ունի npm փաթեթներ և մշակողի այլ գործիքներ։ Մշակողի այս հատկանիշները ներառում են.

• Վեբ էջի վրա հատուկ դասավորություններ և փոխազդեցություններ ստեղծելու ունակություն:
• Տվյալների բազայում հավաքածուներ ստեղծելու ունակություն:
• Ձեր կայքի համար հատուկ API-ներ ստեղծելու ունակություն:

Կայքի ստեղծում Velo-ի միջոցով

Velo-ն օգտագործելու համար դուք պետք է նավարկեք նրա հիմնական կայք: Երբ այնտեղ եք, ընտրեք նոր նախագիծ սկսելու տարբերակը: Սա ձեզ կտանի սովորական Wix կայքի ստեղծման գործընթացով, որտեղ դուք պետք է ընտրեք կայքի տեսակը, որը ցանկանում եք կառուցել: Դուք կարող եք կամ ինքնուրույն ընտրել ձևանմուշ կամ Wix ADI-ի օգնությամբ:

Ձեր ձևանմուշը խմբագրելու տարբերակը ընտրելուց հետո կտեսնեք հետևյալ միջերեսի պես մի բան.

Վերևի նկարի ձախ կողմում կա կայքի կառուցվածքի կողագոտին, որը հնարավորություն է տալիս մուտք գործել տարբեր JavaScript ֆայլեր, որոնք կապված են ձեր կայքի բոլոր էջերին: Ներկայումս ընտրված էջը գլխավոր էջն է, և եթե նայեք վերևի նկարի ներքևում, կտեսնեք կոդերի խմբագրիչ, որը ցուցադրում է HOME.js ֆայլի բովանդակությունը:

Հատուկ դասավորության կառուցվածքի և փոխազդեցությունների ստեղծում

Այս հոդվածի համար ընտրված ձևանմուշը առողջության առցանց խանութն է: Այս կայքի գլխավոր էջն ունի «ամենատարածված», որը կարող եք տեսնել հետևյալ պատկերում.

Այնուամենայնիվ, եթե ցանկանում եք օգտագործել այլ վերնագիր այս բաժնի համար, կարող եք դրան հասնել Velo խմբագրիչում՝ HOME.js ֆայլի մեջ տեղադրելով հետևյալ կոդը:

HOME.js ֆայլը

$w.onReady(<strong>function</strong> () {
   $w('#text20').text = 'TRENDING ITEMS'
});

Վերոնշյալ կոդը կթարմացնի «ամենահայտնի» վերնագիրը դեպի «թրենդային տարրեր, և դուք կարող եք դիտել այս թարմացումը՝ սեղմելով Velo ինտերֆեյսի վերևի աջ մասում գտնվող նախադիտման կոճակը: Համապատասխան հատվածի գլխավոր էջում դուք պետք է տեսնեք հետևյալ արդյունքի նման մի բան.

Աշխատեք Velo-ի տվյալների բազայի հետ

Դինամիկ կայքերից շատերն ունեն տվյալների բազա, որը տարբեր կերպ է պահում տվյալները՝ կախված տեսակից: Velo-ն իր տվյալները պահում է իր կենտրոնական տվյալների բազայի հավաքածուներում: Այս տվյալների բազա մուտք գործելու համար դուք պետք է նավարկեք Velo-ի մշակողների միջերեսի ձախ կողմում գտնվող տողերի և սյունակների աղյուսակը:

Ինչպես տեսնում եք վերևի պատկերից, Wix-ի յուրաքանչյուր ձևանմուշ գալիս է որոշ լռելյայն հավաքածուներով՝ կախված կայքի տեսակից: Այս հոդվածի համար ընտրված կայքի ձևանմուշը առողջության խանութ է: Հետևաբար, այն ունի լռելյայն արտադրանքների հավաքածու, որը դուք հեշտությամբ կարող եք փոխարինել ձեր իրերով:

Այնուամենայնիվ, եթե ցանկանում եք ստեղծել ձեր հավաքածուն զրոյից, նրանք նույնպես ունեն այդ տարբերակը։

Ձեր Velo-ի տվյալների բազայում նոր հավաքածու ստեղծելու համար պարզապես մկնիկը սահեցրեք «բովանդակության հավաքածուներ» բաժնի վրա, և տեքստի աջ կողմում կհայտնվի գումարած պատկերակ:

Սեղմելով վերը նշված պատկերի նոր հավաքածուի ընտրանքը, կստեղծվի հավաքածուի ստեղծման հետևյալ ձևը.

Հավաքածուի անուն տրամադրելը և ստեղծել կոճակը սեղմելը ձեզ կտանի դեպի հետևյալ բովանդակության կառավարիչ էջը.

Վերևի բովանդակության կառավարիչ էջից կարող եք սկսել համալրել ձեր արտադրանքի հավաքածուն՝ օգտագործելով համապատասխան գումարած պատկերակները: Բայց մինչ սկսեք ապրանքներ ավելացնել ձեր հավաքածուին, դուք պետք է ստեղծեք համապատասխան դաշտերը:

Նայեք վերևում գտնվող բովանդակության մենեջերի էջին. այն ներկայումս ունի մեկ դաշտ՝ վերնագիր: Դուք չեք կարող ջնջել այս դաշտը, քանի որ այն հիմնական դաշտն է (կամ եզակի նույնացուցիչը), որը պետք է ունենա յուրաքանչյուր հավաքածու: Այնուամենայնիվ, դուք կարող եք դրան ավելի համապատասխան վերնագիր տալ, օրինակ՝ ապրանքի անվանումը կամ ID-ն:

Ձեր հավաքածուում գոյություն ունեցող դաշտի անունը փոխելու համար պարզապես սեղմեք տվյալ դաշտի վրա և կտեսնեք մի քանի տարբերակ:

Ընտրելով գույքի տարբերակը, որը կարող եք տեսնել վերևի նկարում, կստեղծվի հետևյալ թռուցիկ ձևը.

Վերևում բացվող ձևը թույլ է տալիս փոխել դաշտի անունը՝ մուտքագրելով ձեր ուզած վերնագիրը «դաշտի անուն» պիտակավորված տեքստային դաշտում և սեղմելով պահպանել:

Նոր դաշտի ավելացում

Ձեր հավաքածուն նոր դաշտ ավելացնելու երկու եղանակ կա: Առաջին տարբերակն է՝ սեղմել գումարած պատկերակը հավաքածուի առկա վերնագրի աջ կողմում: Այս մեթոդը կստեղծի հետևյալ ձևը.

Դաշտի նոր ձևը թույլ է տալիս տրամադրել դաշտի անուն, դաշտի բանալի (ձեր կոդի մեջ ինտեգրվելու համար) և դաշտի տեսակը: Դաշտի տեսակը կարող է լինել հետևյալներից որևէ մեկը.

• Տեքստ
• Պատկեր
• Բուլյան
• Թիվ
• Ամսաթիվ և ժամ
• Ժամանակը
• Հարուստ տեքստ
• Հղում
• Multi-Reference
• URL

Ձեր հավաքածուին նոր դաշտ ավելացնելու երկրորդ եղանակն է՝ սեղմելով «թաքնված դաշտեր» բաժինը և բացվող դաշտերի ցանկից ընտրելով «Ավելացնել դաշտ» տարբերակը: Դուք պետք է տեսնեք ստորև ներկայացված պատկերի նման մի բան.

Նյութերի ավելացում հավաքածուին Ձեր հավաքածուին նոր ապրանք ավելացնելու համար կարող եք սեղմել «Ավելացնել նյութ» կոճակը բովանդակության կառավարչի էջի աջ կողմում կամ սեղմել պլյուս նշանը դաշտերի վերնագրերի տակ: Ձեր առաջին տարրը ձեր հավաքածուին ավելացնելուց հետո այն պետք է այսպիսի տեսք ունենա.

Այժմ դուք կարող եք հնարավորինս շատ տարրեր ավելացնել ձեր հավաքածուին՝ օգտագործելով վերը նշված մեթոդներից որևէ մեկը: Այնուամենայնիվ, ձեր կայքը ցանկացած հավաքածուով թարմացնելու համար նախ պետք է հրապարակեք կայքը:

Ինչն է դարձնում Velo-ն հետաքրքիր

Այժմ դուք գիտեք, թե ինչպես հարմարեցնել ձեր կայքը՝ օգտագործելով JavaScript կոդը Velo IDE-ում: Դուք կարող եք նաև ստեղծել անհատական հավաքածուներ Velo տվյալների բազայում այնքան իրերով, որքան կցանկանաք: Բայց Velo-ի ամենալավ բանը npm փաթեթներ ներմուծելու և օգտագործելու հնարավորությունն է: