There might be a more complete example someone can link, but you will likely have to have your Motoko backend canister at least answer HTTP requests. Here’s an example of that:
Hopefully this helps!
This is a good one which I started with.
Frontend uses nextjs which can be deployed on Vercel.
Backend is written with motoko running in canister
Here is a brand new (soon to be official) starter project for Vite + React + Motoko which includes live reloading for both the frontend and backend using the Motoko Dev Server. Although this template is a work in progress, it could be useful as a reference point for setting up a Vite frontend with a Motoko canister backend.
If you want to host the frontend on an external service such as Vercel or Netlify, you’ll want to configure the IC HTTP agent to use
http://localhost:4943 for your local replica or
https://ic0.app for the mainnet. Here’s a code example for reference, although it’s using an outdated version of
dfx (which originally used port 8000 instead of 4943).
Hopefully these links will help get you started, and I’ll let you know if I come across anything else that could be useful.
Many thanks for all the answers. I‘ll give them a try.
which includes live reloading for both the frontend and backend using the Motoko Dev Server.
wow that sounds awesome! will it be possible to turn this into a general starter to provide other bundlers & frameworks to chose from a cli?
Is that template ready for production?
We are currently merging parts of this starter project into the
dfx new template. If you use this one, definitely let me know if you run into any issues and I’d be happy to help debug.
is svelte on the table as well
Yep! It’s relatively simple to adjust the starter project to use any front-end framework supported by Vite.
We could also start maintaining a Svelte template if there’s enough interest.
We do have some Svelte examples, but I’m not sure how well-tested they are right now