I’ve been using ReactJS as I have been exploring Headless / Decoupled Drupal and have so far found it to be very nice to work with. However, as I am not overly familar with it I’ve found myself looking up lots of things to ensure I’m doing it “the React way”. This has meant I’ve been doing more React learning than I have Drupal learning.
My solution is to go back to an existing Drupal 7 project where I have a custom piece of search functionality and replicate it using JSON feeds provided by Drupal and a ReactJS frontend.
This has been really beneficial in my learning as I have very clea objectivies and expectations. It also means I am only focussed on learning one thing at time so I don’t skip around between documentation and tutorials.
The installation of a minimal Drupal setup is very quick and easy. From there I enabled a few modules and a theme to help me create some data.
- Modules enabled
- Field UI
- View UI
- RESTful Web Services
I also installed the Devel module to help with dummy content population of my content type Article.
A common function of a website is to list content in an order, newest items or most relevant, and paginate this list. In Drupal this is commonly done in Views.
I set up my view as follows
- REST Export
- URL of /api/articles
- Display 10 items
- Show fields
This is great, nice and easy and gives the JSON I want.
Now the questions began.
- If I can set a URL for this how are the URLs structured for individual nodes
- If my public facing site is example.com then do I need to access my CMS on a subdomain such as cms.example.com
- How do I know the URL to paginate the Views output
- Can it supply a next and previous URL, how about total number of page
There is a great discussion about React in Drupal core on the Lullabot podcast. At 48:58 they talk about the Drupal APIs and specifically Views. The current status is there are some in place but using Views is a workaround at the moment.
As I keep going hopefully some of these questions will be answered, and I’m sure there will be moe posts and more questions.