Perform CRUD operations using Firebase
How to Clone?
Follow all these steps to clone the web app:
- Clone the Webflow website
- Clone the Wized project, and paste the Wized embed code into the cloned Webflow website
- Build a Firebase backend, and get your API key
- Update your API key in My Apps inside the Wized Configurator
Walkthrough tutorial
If you have any questions, please reach out to Support.
- Add Firebase in the My Apps panel.
- Build a Data Out request to CREATE item. Next, in the Actions panel, build an on-click trigger (applied to the relevant form-submit button) that executes the CREATE item request.
- Go to Page Data > General > Variables > +New.
- Build a Data In request to READ items that's triggered on page load. Next, in Actions panel, build a Render List configuration that displays all the items loaded in the READ request & use the newly created variable as the index. Then, build more Actions (such as replace text) to display properties of the loaded data, using the created variable as the index.
- Create Actions to pre-fill values of the item (using the created variable as the index) in the input fields. Next, build a Data Out request to UPDATE item using the created variable as the index. Then, in Actions panel, build an on-click trigger (applied to the relevant form-submit button) that executes the UPDATE item request.
- Build a Data Out request to DELETE item. Finally, in the Actions panel, build an on-click trigger (applied to the relevant button) that executes the DELETE item request using the created variable as the index.