Frontity in Woocommerce

[kataviqc]

Hello, I am new to the use of Frontity, but I do have a few questions, I hope this is the right place for it!.

Can someone explain me how to :

• List products with Frontity.

• Show varible products with Frontity

• The use of REST API in Frontity.

[juanma]

HI @kataviqc

Welcome to the Community!

Working with WooCommerce in a Frontity project has the same challenges than working with WooCommerce from an isomorphic React app.

The most important challenge is that WooCommerce endpoints (those you can use to get the products, categories, …) require authentication through an API Key so you should add this API Key in every request to these endpoints

Here you have a few threads that might be interesting for you to check:

WooCommerce Proof of Concept

We are going to investigate how a WooCommerce package for Frontity could look like. This proof of concept is going to be built on top of a new client-side API the WooCommerce has started working on for their Gutenberg blocks, called Store API. We did an intro meeting to talk about the first goals: [Zoom Recording [[email protected] - Luis Herranz's Personal Meeting Room]] WooCommerce Gutenberg blocks: https://docs.woocommerce.com/document/woocommerce-blocks/ WooCommerce Store A…

Docs don't cover WooCommerce

Hi @inamkbmail Sorry for the delay in the answer. I’ve been doing some research to provide a proper answer. Frontity provides you a way to create a theme with React that connects easily to your WP REST API. The type of React app you’ll be creating is what is called an isomorphic app, this is, a React App that can be used in both the server and the client So, when connecting to other API’s you need to take this into account as it has to do with things like authentication. WooCommerce provide…

How do I add woocommerce endpoint to the state?

Not sure if combining the handler with postTypes will work. I think the best option is to choose between: Using a custom endpoint and use a handler to point to that data. Using the CPT product and add more info (if necessary) from your WordPress. Just to clarify it a bit more we have two cases: If you use the CPT you defined With that settings, you are telling Frontity to fetch that CPT. As you have defined it: If you access to https://mysite.com/product/first-product (from Frontity) you’l…

How do I add woocommerce endpoint to the state?

the solution was a handler to read the necessary products: const HeaderCart = ({ state, actions }) => { ... useEffect(() => { if (state.frontity.platform === 'client') { if (0 === state.theme.cart.length) { const storedCart = localStorage.getItem( 'frontity_wc_cart' ); if (storedCart && storedCart.length !== 0) { state.theme.cart = JSON.parse(storedCart); state.theme.cart.map(cartItem => { actions.source.fetch( …

Hope this helps