Jump to content

Using Processwire for an API


POWERFULHORSE
 Share

Recommended Posts

I've been looking into both React and Vue.js for a while and how front-end frameworks like these could integrate with my current workflow of building websites with ProcessWire. Ultimately I've decided to go with Vue.js after using it for certain sections of a few previous projects and familiarizing myself with the documentation, but I assume the same concepts I'm trying to work out would apply for both.

So for my next project, I was thinking of using ProcessWire to simply manage content and serve what would function as the website's API. Essentially I would install ProcessWire into a subdirectory of my site's root folder, say '/api', and all template files would serve JSON only.

The site itself would essentially be a webapp served by a simple node.js server, with all routing handled by the vue-router component of Vue.js. This way I could also utilise some sort of server side rendering to avoid initial asynchronous content loading. I would then set up my ProcessWire tree structure so that the API routes match those defined by vue on the front-end, only prefixed with '/api', subsequent pages could then be loaded asynchronously.

Has anyone used ProcessWire in a similar way in the past, or used it in another way alongside React or Vue.js? I would eventually like to start using this approach for client projects, my first attempt will be an internal project however.

  • Like 3
Link to comment
Share on other sites

  • 2 months later...

@johnteaksf - I have personally used it many times with AngularJS and plan on using it for the first time with VueJS pretty soon. A couple of other resources that might be helpful:

Quote

Front-end JS $pages API. front-end Javascript API of ProcessWire's $pages API variable would be really handy for a lot of cases, and so I'm going to continue to keep this in our roadmap.

https://processwire.com/blog/posts/roadmap-2017/#whats-in-store-for-processwire-in-2017

  • Like 1
Link to comment
Share on other sites

  • 1 month later...
31 minutes ago, POWERFULHORSE said:

I just finished a medium sized website/SPA using processwire and vue with vue router and vuex. Has lots of nice features like server side rendering, happy to share details with people if they'd be interested. Shoot me a PM.

If the details are not covered by an NDA, maybe you could share them publicly in this very topic ;)

  • Like 10
Link to comment
Share on other sites

  • 2 weeks later...

We started using mustache template engine with PW. Since mustache is implemented in various languages. Currently I can render anything either server side or client side with js or php and both share the same code base. Data can be either objects arrays or json whatever you like. We also use patternlabs node mustache version for prototyping and so all patterns can be used 1:1 in PW later using some simple controller system based on Classes that extend PW WireData so all API can be used. We also use terrificjs for easy modular js components.

So no vue or react but just to mention that there's everything possible in PW.

  • Like 6
Link to comment
Share on other sites

On 3/25/2017 at 1:39 AM, Soma said:

We started using mustache template engine with PW. Since mustache is implemented in various languages. Currently I can render anything either server side or client side with js or php and both share the same code base. Data can be either objects arrays or json whatever you like. We also use patternlabs node mustache version for prototyping and so all patterns can be used 1:1 in PW later using some simple controller system based on Classes that extend PW WireData so all API can be used. We also use terrificjs for easy modular js components.

So no vue or react but just to mention that there's everything possible in PW.

I'm interested to learn how this all works. Please nudge me to the right direction, with links perhaps, or examples specific to PW :).

  • Like 2
Link to comment
Share on other sites

 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...