I just created and published a course on the freeCodeCamp.org YouTube channel that will teach you how to build an online store with WooCommerce and WordPress.

In this video course, you will learn every step to make an eCommerce website using a drag-and-drop interface.

You will learn how to get a domain name and hosting, install Wordpress and WooCommerce, use a theme, customize your store, create products, set up payment methods, specify taxes and shipping, create coupon codes, and more.

Here is a list of all the topics covered in this course:

• Get hosting and domain name
• Setup custom email address
• Install Wordpress and WooCommerce
• Begin store customization
• Install store theme and template
• Initial WooCommerce Setup
• Customize website
• Customize store pages
• Create privacy policy
• Add products - Introduction
• Add simple product
• Add variable product
• Add grouped product
• Add downloadable product
• Setup payment processing with Stripe
• Setup payment processing with PayPal
• Setup automatic tax calculation
• Setup shipping
• Create coupon codes
• Test purchase and improve order flow
• Explore order information
• Customize emails sent to customers
• Update header

Watch the full course below or on the freeCodeCamp.org YouTube channel (1.5 hour watch).

Hello FreeCodeCamp Reader Community! This Tutorial is made as a little thought experiment but might have some merit for the one or other person.

Please keep in mind that this plugin is making an example by adding a product via Construct 3 Forms + REST API cURL Request to an existing WordPress + WooCommerce installation.

The principles still are valid for other purposes you might have with the REST API, and I included the .c3p on the bottom of this tutorial. There are more elegant ways about feeding the arrays of information to the application, but this is a quick demo as proof-of-concept that I put together within 2 hours and felt like sharing it due to the lack of API and AJAX information for Construct 3.

Here is the entire code in a single screenshot:

Construct 3 Source Code Screenshot

The Code Broken Down once we click on 'Create Product' button

• productjson is an obligatory text field outside of the viewport on the layout.
• productjson contains our entire payload data pre-formatted as json to allow the REST API to work properly.
• The payload contains dynamically created content which are the forms in the layout such as product name, sku, price, etc.
• The AJAX module that I renamed AJAX_Data will set the Request_Header to "Content-Type" with the value of "application/json", because the REST API via cURL request will utilize JSON.
• The next AJAX_Data with the 'Post to URL' request will be our actual API request.
• The Tag is merely a name which can be utilized for example to return the values of the request, in the example of my project - as debugging information.
• The URL will start with your domain, i.e. 'https://www.example.com' The next part of the URL is the API request you would like to make, in our example as per WooCommerce documentation to add a product we need '/wp-json/wc/v3/products?'
• Last but not least for the URL we need the consumer key and secret in this manner: 'consumer_key=&consumer_secret='
• The full URL looks like this: "https://www.example.com/wp-json/wc/v3/products?consumer_key=&consumer_secret="
• Next up is the Data. This is simple since we already have made a text box for this exact purpose. Simply refer to it here, in my example the Data will be 'productjson.Text'.
• And at the very end, what type of Request. Since we are creating a product we will need 'POST', if we were to retrieve a product we would want a 'GET' request, see the respective documentation of the API you are using.

.c3p File Download:

https://drive.google.com/open?id=16DKq5RJD5tCw57oZPruGk_mtTIAe-Um9

Requirements for my .c3p example

• WordPress Installation with WooCommerce installed
• REST API enabled and issued a consumer secret & key
• Replace my API secret and key example in the code
• Uploaded an image in the media gallery within WordPress
• Created a Product Category within WordPress/WooCommerce

If you need a free WordPress environment to play around with, I used https://pantheon.io, under the free plan you can get 2 sandbox sites. Just make sure to install the WP-CORS plugin first and set allowed sites to '*' as seen in their documentation here:
https://pantheon.io/docs/platform-considerations/#cors

https://wordpress.org/plugins/wp-cors/

API Source Information & Relevant C3 Documentation:

WooCommerce REST API Documentation
Construct 3 AJAX Documentation
JSON Validator tool to verify if your JSON is properly formatted.
Original Tutorial I wrote on Construct.net