Project Structure

  • App/Common folders

    • Config.js: main config variables for the app
    • Colors.js: config theme color for the app
    • Constants.js: Config wordpress URL, icons, categories...
    • Images.js: list of all images use for the app
    • Languages.js: main language file config
    • Layout.js: Use to config the main flexible homepage.
    • Tools: Common functions
  • src/Components: Common components that could be used many time, this could be a custom button, comment component, icon input...
  • src/Containers: most components of the app is putting here, you could change or re-structure by matching with your own project design.
  • src/Expo: Wrapper Expo function
  • src/Services: The Wodpress Api for the app you can refer to the Wordpress API -http://v2.wp-api.org/and custom your own function if you want to add more feature for the app.
  • src/Redux: Main action and reducer
  • src/Navigation: Wrapper function for react-nativigation v2.0

img

Debug app with Reacttotron

Link download on desktop: http://bit.ly/2L0R9gY

It's already configed with the project, after installed the Reacttotron you can see list of Log, Image, connection, API, Redux actions....

img

You can able to the config the app to work with Reactotron or React Native Debugger by change useReactotron:false (file common/Constants.js)

Common API

GET Products

https://your-hosting.com/wp-json/wp/v2/posts

This endpoint allows you to get list of products, detail from - http://bit.ly/2L3vvJi

[
{
    "id": 571,
    "date": "2017-08-20T03:53:00",
    "date_gmt": "2017-08-20T03:53:00",
    "guid": {
      "rendered": "https://inspireui.com/?p=571"
    },
    "modified": "2017-09-28T13:51:16",
    "modified_gmt": "2017-09-28T13:51:16",
    "slug": "my-typical-green-juice-combo",
    "status": "publish",
    "type": "post",
    "link": "https://news.inspireui.com/my-typical-green-juice-combo/",
    "title": {
      "rendered": "My Typical Green Juice Combo"
    },
    "content": {
      "rendered": "<p>To all those green juice addicts out there you’ll understand my sentiments here. I am a green juice addict. But with all habit forming activities this one took a while to set in. I remember (not so long ago) coming home from work and pouring myself a a big <strong>fat</strong> gin and tonic (with 3 large ice cubes and a hefty slice of lemon). I’d sit down and watch the SBS or ABC news every night with my &#8216;relaxant&#8217;. Far out I loved that little routine.</p>\n<p>I thought about that tonight when I came inside from the routine afternoon dog walk. How things have changed. These days there is something about the greenness of these green juices, the thought of the goodness running through my veins that keeps me coming back for more (I promise if this addiction happened to me, it could happen to anyone!). This evening I marched straight to the fridge, pulled out bundles of chilled greens and commenced my 5.30pm (ish) green juicing routine.</p>\n<p><iframe width=\"640\" height=\"360\" src=\"https://www.youtube.com/embed/jU22hHEOa6Y?feature=oembed\" frameborder=\"0\" allowfullscreen></iframe></p>\n<p>&nbsp;</p>\n<p>So you can throw anything green in a green juice, you can also throw lemon in green juice (which I recommend if you are new to green juices, it softens the flavour). It just needs to be raw (obviously), pesticide free, ideally organic and fresh (it&#8217;s all well and good to juice your veg because they&#8217;re going soft in the chiller but let&#8217;s be honest, soft veg is lacking in the nutrients department). Green juices are seriously one of the best things you can do for your health.</p>\n<h4>You&#8217;ll need:<br />\n1/2 bunch english spinach<br />\n1 or 2 stalks silver beet and kale<br />\n1 stalk celery<br />\nHandful of parsley &amp; mint (if you&#8217;ve got it)<br />\n1 lemon<br />\n1/2 cucumber<br />\n1 knob of ginger (to taste)<br />\n1 small piece of turmeric<br />\n1 clove garlic</h4>\n<p>Throw it all in the juicer and press play. Voila!</p>\n<p>Source: theholisticingredient.com</p>\n",
      "protected": false
    },
    "excerpt": {
      "rendered": "<p>To all those green juice addicts out there you’ll understand my sentiments here. I am a green juice addict. But with all habit forming activities this one took a while to set in. I remember (not so long ago) coming home from work and pouring myself a a big fat gin and tonic (with 3 [&hellip;]</p>\n",
      "protected": false
    },
    "author": 4,
    "featured_media": 884,
    "comment_status": "open",
    "ping_status": "closed",
    "sticky": true,
    "template": "",
    "format": "standard",
    "meta": [
      
    ],
    "categories": [
      34
    ],
    "tags": [
      39
    ],
    "better_featured_image": {
      "id": 884,
      "alt_text": "",
      "caption": "",
      "description": "",
      "media_type": "image",
      "media_details": {
        "width": 1200,
        "height": 1798,
        "file": "2017/02/milk-with-chia-seeds-P8RDZYN-1.jpg",
        "sizes": {
          "thumbnail": {
            "file": "milk-with-chia-seeds-P8RDZYN-1-300x360.jpg",
            "width": 300,
            "height": 360,
            "mime-type": "image/jpeg",
            "source_url": "https://news.inspireui.com/wp-content/uploads/2017/02/milk-with-chia-seeds-P8RDZYN-1-300x360.jpg"
          },
          "medium": {
            "file": "milk-with-chia-seeds-P8RDZYN-1-342x512.jpg",
            "width": 342,
            "height": 512,
            "mime-type": "image/jpeg",
            "source_url": "https://news.inspireui.com/wp-content/uploads/2017/02/milk-with-chia-seeds-P8RDZYN-1-342x512.jpg"
          },
          "medium_large": {
            "file": "milk-with-chia-seeds-P8RDZYN-1-768x1151.jpg",
            "width": 768,
            "height": 1151,
            "mime-type": "image/jpeg",
            "source_url": "https://news.inspireui.com/wp-content/uploads/2017/02/milk-with-chia-seeds-P8RDZYN-1-768x1151.jpg"
          },
          "large": {
            "file": "milk-with-chia-seeds-P8RDZYN-1-683x1024.jpg",
            "width": 683,
            "height": 1024,
            "mime-type": "image/jpeg",
            "source_url": "https://news.inspireui.com/wp-content/uploads/2017/02/milk-with-chia-seeds-P8RDZYN-1-683x1024.jpg"
          },
          "td_80x60": {
            "file": "milk-with-chia-seeds-P8RDZYN-1-80x60.jpg",
            "width": 80,
            "height": 60,
            "mime-type": "image/jpeg",
            "source_url": "https://news.inspireui.com/wp-content/uploads/2017/02/milk-with-chia-seeds-P8RDZYN-1-80x60.jpg"
          },
          "td_100x70": {
            "file": "milk-with-chia-seeds-P8RDZYN-1-100x70.jpg",
            "width": 100,
            "height": 70,
            "mime-type": "image/jpeg",
            "source_url": "https://news.inspireui.com/wp-content/uploads/2017/02/milk-with-chia-seeds-P8RDZYN-1-100x70.jpg"
          },
          "td_218x150": {
            "file": "milk-with-chia-seeds-P8RDZYN-1-218x150.jpg",
            "width": 218,
            "height": 150,
            "mime-type": "image/jpeg",
            "source_url": "https://news.inspireui.com/wp-content/uploads/2017/02/milk-with-chia-seeds-P8RDZYN-1-218x150.jpg"
          },
          "td_265x198": {
            "file": "milk-with-chia-seeds-P8RDZYN-1-265x198.jpg",
            "width": 265,
            "height": 198,
            "mime-type": "image/jpeg",
            "source_url": "https://news.inspireui.com/wp-content/uploads/2017/02/milk-with-chia-seeds-P8RDZYN-1-265x198.jpg"
          },
          "td_324x160": {
            "file": "milk-with-chia-seeds-P8RDZYN-1-324x160.jpg",
            "width": 324,
            "height": 160,
            "mime-type": "image/jpeg",
            "source_url": "https://news.inspireui.com/wp-content/uploads/2017/02/milk-with-chia-seeds-P8RDZYN-1-324x160.jpg"
          },
          "td_324x235": {
            "file": "milk-with-chia-seeds-P8RDZYN-1-324x235.jpg",
            "width": 324,
            "height": 235,
            "mime-type": "image/jpeg",
            "source_url": "https://news.inspireui.com/wp-content/uploads/2017/02/milk-with-chia-seeds-P8RDZYN-1-324x235.jpg"
          },
          "td_324x400": {
            "file": "milk-with-chia-seeds-P8RDZYN-1-324x400.jpg",
            "width": 324,
            "height": 400,
            "mime-type": "image/jpeg",
            "source_url": "https://news.inspireui.com/wp-content/uploads/2017/02/milk-with-chia-seeds-P8RDZYN-1-324x400.jpg"
          },
          "td_356x220": {
            "file": "milk-with-chia-seeds-P8RDZYN-1-356x220.jpg",
            "width": 356,
            "height": 220,
            "mime-type": "image/jpeg",
            "source_url": "https://news.inspireui.com/wp-content/uploads/2017/02/milk-with-chia-seeds-P8RDZYN-1-356x220.jpg"
          },
          "td_356x364": {
            "file": "milk-with-chia-seeds-P8RDZYN-1-356x364.jpg",
            "width": 356,
            "height": 364,
            "mime-type": "image/jpeg",
            "source_url": "https://news.inspireui.com/wp-content/uploads/2017/02/milk-with-chia-seeds-P8RDZYN-1-356x364.jpg"
          },
          "td_533x261": {
            "file": "milk-with-chia-seeds-P8RDZYN-1-533x261.jpg",
            "width": 533,
            "height": 261,
            "mime-type": "image/jpeg",
            "source_url": "https://news.inspireui.com/wp-content/uploads/2017/02/milk-with-chia-seeds-P8RDZYN-1-533x261.jpg"
          },
          "td_534x462": {
            "file": "milk-with-chia-seeds-P8RDZYN-1-534x462.jpg",
            "width": 534,
            "height": 462,
            "mime-type": "image/jpeg",
            "source_url": "https://news.inspireui.com/wp-content/uploads/2017/02/milk-with-chia-seeds-P8RDZYN-1-534x462.jpg"
          },
          "td_696x0": {
            "file": "milk-with-chia-seeds-P8RDZYN-1-696x1043.jpg",
            "width": 696,
            "height": 1043,
            "mime-type": "image/jpeg",
            "source_url": "https://news.inspireui.com/wp-content/uploads/2017/02/milk-with-chia-seeds-P8RDZYN-1-696x1043.jpg"
          },
          "td_696x385": {
            "file": "milk-with-chia-seeds-P8RDZYN-1-696x385.jpg",
            "width": 696,
            "height": 385,
            "mime-type": "image/jpeg",
            "source_url": "https://news.inspireui.com/wp-content/uploads/2017/02/milk-with-chia-seeds-P8RDZYN-1-696x385.jpg"
          },
          "td_741x486": {
            "file": "milk-with-chia-seeds-P8RDZYN-1-741x486.jpg",
            "width": 741,
            "height": 486,
            "mime-type": "image/jpeg",
            "source_url": "https://news.inspireui.com/wp-content/uploads/2017/02/milk-with-chia-seeds-P8RDZYN-1-741x486.jpg"
          },
          "td_1068x580": {
            "file": "milk-with-chia-seeds-P8RDZYN-1-1068x580.jpg",
            "width": 1068,
            "height": 580,
            "mime-type": "image/jpeg",
            "source_url": "https://news.inspireui.com/wp-content/uploads/2017/02/milk-with-chia-seeds-P8RDZYN-1-1068x580.jpg"
          },
          "td_1068x0": {
            "file": "milk-with-chia-seeds-P8RDZYN-1-1068x1600.jpg",
            "width": 1068,
            "height": 1600,
            "mime-type": "image/jpeg",
            "source_url": "https://news.inspireui.com/wp-content/uploads/2017/02/milk-with-chia-seeds-P8RDZYN-1-1068x1600.jpg"
          },
          "td_0x420": {
            "file": "milk-with-chia-seeds-P8RDZYN-1-280x420.jpg",
            "width": 280,
            "height": 420,
            "mime-type": "image/jpeg",
            "source_url": "https://news.inspireui.com/wp-content/uploads/2017/02/milk-with-chia-seeds-P8RDZYN-1-280x420.jpg"
          }
        },
        "image_meta": {
          "aperture": "0",
          "credit": "",
          "camera": "",
          "caption": "",
          "created_timestamp": "0",
          "copyright": "",
          "focal_length": "0",
          "iso": "0",
          "shutter_speed": "0",
          "title": "",
          "orientation": "0",
          "keywords": [
            
          ]
        }
      },
      "post": 551,
      "source_url": "https://news.inspireui.com/wp-content/uploads/2017/02/milk-with-chia-seeds-P8RDZYN-1.jpg"
    },
    "_links": {
      "self": [
        {
          "href": "https://news.inspireui.com/wp-json/wp/v2/posts/571"
        }
      ],
      "collection": [
        {
          "href": "https://news.inspireui.com/wp-json/wp/v2/posts"
        }
      ],
      "about": [
        {
          "href": "https://news.inspireui.com/wp-json/wp/v2/types/post"
        }
      ],
      "author": [
        {
          "embeddable": true,
          "href": "https://news.inspireui.com/wp-json/wp/v2/users/4"
        }
      ],
      "replies": [
        {
          "embeddable": true,
          "href": "https://news.inspireui.com/wp-json/wp/v2/comments?post=571"
        }
      ],
      "version-history": [
        {
          "href": "https://news.inspireui.com/wp-json/wp/v2/posts/571/revisions"
        }
      ],
      "wp:featuredmedia": [
        {
          "embeddable": true,
          "href": "https://news.inspireui.com/wp-json/wp/v2/media/884"
        }
      ],
      "wp:attachment": [
        {
          "href": "https://news.inspireui.com/wp-json/wp/v2/media?parent=571"
        }
      ],
      "wp:term": [
        {
          "taxonomy": "category",
          "embeddable": true,
          "href": "https://news.inspireui.com/wp-json/wp/v2/categories?post=571"
        },
        {
          "taxonomy": "post_tag",
          "embeddable": true,
          "href": "https://news.inspireui.com/wp-json/wp/v2/tags?post=571"
        }
      ],
      "curies": [
        {
          "name": "wp",
          "href": "https://api.w.org/{rel}",
          "templated": true
        }
      ]
    }
  },
]
  

GET Categories

https://your-hosting.com/wp-json/wc/v2/categories

[
{
    "id": 30,
    "count": 5,
    "description": "Browse our collection of family favourite meals for deliciously simple and crowd-pleasing recipes to get supper on the table in a jiffy. Find easy cheesecake recipes to make a show-stopping end to any dinner.",
    "link": "https://news.inspireui.com/category/deserts/",
    "name": "Deserts",
    "slug": "deserts",
    "taxonomy": "category",
    "parent": 0,
    "meta": [
      
    ],
    "_links": {
      "self": [
        {
          "href": "https://news.inspireui.com/wp-json/wp/v2/categories/30"
        }
      ],
      "collection": [
        {
          "href": "https://news.inspireui.com/wp-json/wp/v2/categories"
        }
      ],
      "about": [
        {
          "href": "https://news.inspireui.com/wp-json/wp/v2/taxonomies/category"
        }
      ],
      "wp:post_type": [
        {
          "href": "https://news.inspireui.com/wp-json/wp/v2/posts?categories=30"
        }
      ],
      "curies": [
        {
          "name": "wp",
          "href": "https://api.w.org/{rel}",
          "templated": true
        }
      ]
    }
  },
]

The app is base on An isomorphic JavaScript client for the WordPress REST API, please refer to this document for the detail - https://github.com/WP-API/node-wpapi

The detail API is clarify from - https://developer.wordpress.org/rest-api/reference/