Svelte describes itself as a radical new approach to building UIs. Svelte takes a unique approach of moving the heavy-lifting from the browser to the compiler at build time.
Svelte doesn't rely on a virtual DOM, but instead is intelligent at writing code to update the actual DOM when the state of your app changes.
Svelte is a great choice for commerce due to how small files are. Product pages that load quicker are great for conversions.
In this tutorial we will touch on some of the basic "before cart/checkout" APIs available from Commerce.js.
Let's start by creating a new Svelte Sapper project using the sapper-template repository.
Don't forget to give your project a name by replacing sapper-commercejs-example:
npx degit "sveltejs/sapper-template#rollup" sapper-commercejs-example
Once it's cloned, cd into the directory, and install the dependencies.
cd sapper-commercejs-example
npm install
Now you're ready to go!
If you make any changes to the .svelte route files you should see this reflected in the browser. Do npm run dev and head to localhost:3000 🚀
💡 Feel free to remove any unwanted files, styles, or folders from the boilerplate. I'll go ahead and remove all routes, and components.
In the next step we'll install the @chec/commerce.js dependency.
Top comments (0)