• MAMP
• Ngrok OR localtunnel (tool to make localhost available over the internet)
• Relative URL (WP plugin, to make URL paths from wordpress relative)

SASS is used for styling, to compile it during development you have to run a script. See chapter 'Run' for this.

To interact locally with a webhook you should make use of a tool to make localhost available over the internet. Use Ngrok or localtunnel for this. Currently Ngrok is not working, but Localtunnel is.

Make and/or install WordPress locally using MAMP. Clone this project and place it in the themes folder of the WordPress installation. Make the theme active in your local WordPress admin panel. After that create in the admin panel new pages and connect the right template to each (new) page. So the coded pages are connected to the pages that are created in the admin panel.

• Run npm install in the theme folder (with package.json)

Make sure Ngrok and/or Localtunnel is installed globally:

https://ngrok.com/download

npm install -g localtunnel https://www.npmjs.com/package/localtunnel

• Start MAMP server
• Run npm run start to start the SCSS compiler

• Run npm run ngrok to share the localhost app over the internet using Ngrok (Not working atm).

Will run: ngrok http --host-header=myapp.dev 8888 ^ Will connect to Mollie webhook, but will return you to not existing webpage: myapp.dev:8888/xxx/xxx/xxx

You can also use rewrite to tell ngrok to use the local address hostname. ngrok http --host-header=rewrite 8888 ^ Will not connect to Mollie webhook.

• Run npm run localtunnel to share the localhost app over the internet using localtunnel.

Add this piece of code at the top to set site url and home url dynamically.

define('WP_SITEURL', 'http://' . $_SERVER['HTTP_HOST']);
define('WP_HOME', 'http://' . $_SERVER['HTTP_HOST']);

• https://ngrok.com/docs