Using Webstudio Cli for a Vite Project

sync downloads build data

what do you mean?

locally it's a vite project, and there's no folder called data.

folder is called .webstudio

So you're saying as long as I don't touch anything in .webstudio. I'm safe?

I would assume other folders like pages isn't safe either since it maps to the pages I'm made in webstudio.

I'm trying to understand which files can be edited because I want to extend it with some custom code which I can only do locally.

nothing webstudio generates can be edited

product in the current stage is not meant to have a sync and editing generated stuff at the same time

How would I go about adding authentication with clerk then?

Because I need to added it as a dependancy, and write a basic script that attaches it to a div.

The way it will work later on is that you will be able to import specific components from your code.

we have examples with supabase and firebase

in the marketplace

these work using client-side auth

theey don't require server-side auth

that's what I want to do

I have personally not used clerk, I don't know their requirements

client-side auth

that's just an html embed

This sums up everything I need to do for authentication https://clerk.com/docs/quickstarts/javascript

there is one issue though, after you authorized the client you can not use Resource with server-side rendering if you want it to be secure

I don't want serverside rendering.

I have my own backend and want to render on the frontend

Well unless your backend takes that auth token via resource and verifies it before it sends data back to the client

Problem is when you do client-side rendering you will need to somehow render collections on the client with data fetched on the client

Ahh cool. Didn't notice I could use that. (still new to a lot of the webdev stuff)

There are hacky ways to achieve that right now but really what we need for this use case is to be able to pass data from the client to the collection and make it render the UI like normal

Does that not really work in webstudio?

Not yet no.

We have discussed it a few times but other things took priority.

Can I not write custom javascript fetch request and populate some variable here (in embed)?

Then have the rest of the UI watch those variabled like shown in tutorials.

Not data variables. They are not exposed to the client, they are essentially server-side variables.

Then have the rest of the UI watch those variabled like shown in tutorials.

We don't have such tutorials.

Really? I saw a guy show how to make a search menu in webstudio using variables.

Maybe it was YouTube.

I'm looking for a frontend builder that I can use to make a UI. I'm interested in it supporting client-side rendering, or producing SSG which I can inject code into to support dynamic content and authentication (client-side). And has an export option so I can host it from my backend.

Sounds like webstudio might not be that. What alternatives do you think would?

(I've managed to find a lead myself. Looking into figma+anima)