Building an app with Velo is easy, but building a business with your friend will have challenges : ) You’ve been warned! CAUTION! Let’s build something great Any good company, like friendship, is built on diversity. A diversity of skill sets, tendencies, experiences, and of course opinions! Velo and wix are that beautiful partnership. In early 2020, my friend Matthew approached me with a neat-looking prototype for an ecommerce drop-shipping application built, drag-and-drop, on Wix. Matthew: “So here’s what I need you to do: Build a t-shirt designer into the site.” Me: “Excuse me?! *Barf* 🤮 Is that even possible with Wix. I want to see the bare metal baby!” Matthew: “Bare metal??” Thanks to Velo, I managed to do it by the way (but that could be a separate post): T-Shirt Designer Built with Velo Enter Velo Velo provides a powerful interface between the painless design of your front-end (Matthew’s realm) and the nuts and bolts of keeping your app running smoothly in the backend (my domain). In addition to providing standard back-end tools like , Velo comes out-of-the-box with powerful systems like . database manipulation Ecommerce integration Example Time It’s crunch time and our site still needs a catalog page to display each of the products we offer for designing. Let’s take a look at the interplay between wix and Velo: Matthew chooses to build our catalog page with a element. The repeater is connected to our product collection (database) via a . repeater dataset Catalog Page = repeater + dataset Does Matthew know he’s using Velo-ready components? Nope. It’s just drag and drop! Easy Peasy! “One more thing,” he says, “When you click on an item, let’s send the user to the t-shirt designer and load in the product they chose.” “Easy peasy!” I tell him. Do I know how to do that? Of course not! But I head over to the and within a few moments I have full control. Velo Api Documentation $w.onReady( {
	$w( ).onItemReady( { button = $item( );
		button.link = ;
	});
}); ( ) function "#repeater1" ( ) => $item, itemData, index let "#button1" `/designer?pid= ` ${itemData.productId} Using Velo I can easily hook into the contents of the repeater once they have loaded. I query the button using a friendly selector $item(“#button1”) and change its link properties. Remember that the repeater has been populated with data from the dataset. I can grab the product id of each item from the dataset and pass it as a GET parameter to our designer page. Woo! Better Together That’s how it’s done! Velo enables diverse teams to come together and accomplish amazing things. It’s a great tool for offloading the burden of front-end development while maintaining control over those precious 1s and 0s. (Did I mention velo supports a large library of arbitrary backend node.js packages 🥰) Business, like life, is a dance. Every solution to a problem has its tradeoffs. Know when to do it yourself and when to ask for help. Advanced Stuffs The conversation about working in a team is incomplete without mentioning version control. Admittedly, this is a challenge for the wix ecosystem, but the Velo team is hard at work on this issue! For teams serious about using this technology, I would recommend looking into the . This enables teams to work with local versions of the wix editor and keeps us all from pulling out our hair : ) Velo CLI Check out our fledgling project: easychurchmerch.com Image Credit Photo by Annie Spratt on Unsplash This article is part of a writing contest hosted by Hacker Noon in partnership with Wix. Learn how to enter here and take a shot at winning $1000 every month , from March 1st, 2021 to May 31st, 2021.

Check out our free custom merchandise solution for your church!

Read My Stories

Too Long; Didn't Read

Get free API security automated scan in minutes

How to Build a Website With Non-Coding Teammates using Velo By Wix

Too Long; Didn't Read

Company Mentioned

@d1zzy1zzy

RELATED STORIES