You can start your journey with this website from Lullabot education React ❤ Drupal. Then when you are ready to get your hands dirty, give Contenta or Reservoir a try. Have a look at Dries' post about How to decouple Drupal in 2018.
If you are still hungry, here are some clues.
Updated on 22 August 2018
React and Drupal 8
- Zivtech Getting Started with React, Drupal 8, and JsonAPI
- Dries Buytaert Drupal looking to adopt React
- Four Kitchens : API First Drupal 8, React, and You!
- Isomorphic (universal) JavaScript app using ReactJS + Drupal 8 + Webpack
- Lessons Learned from Drupalcon 2017 Baltimore: Decoupled Headless Drupal
- Amazee Labs Sustainable Drupal & React Maintenance
- Lullabot Decoupled Drupal Hard Problems: Image Styles
- Lullabot Decoupled Drupal Hard Problems: Schemas
- Lullabot Decoupled Drupal Hard Problems: Routing
- Appnovation Using React library on Drupal
- Acquia Lightning New React-based content Scheduler
Progressive decoupling
- Chapter Three Introducing React Comments
- Amazee Labs Progressive Decoupling 1: Modern Javascript
- Amazee Labs Progressive Decoupling 2: A How To Guide
React
- React official documentation
- Getting Started with React – An Overview and Walkthrough
- Wes Bos React For Beginners
- I wish I knew these before diving into React
- Lullabot How to Learn React: A Five-Step Plan
- Why Frameworks matter building a simple app in vanilla JS and React
- Scotch.io Learning React.js: Getting Started and Concepts (2014, but still a a good summary)
- React cheatsheet
- How to better organize your React applications?
- Free Code Camp Handling State in React: Four Immutable Approaches to Consider
- Intro to debugging ReactJS applications
- Hackernoon Configure ESLint, Prettier, and Flow in VS Code for React Development
- Preethi Kasireddy Internationalization in React - FreeCodeCamp
- LogRocket Advanced React Router concepts: recursive path, code splitting, animated transitions, and more
- React Armory How to integrate React into an existing app?
- Hackernoon How To Combine a NodeJS Back End with a ReactJS Front End App
- Hackernoon How to Single Sign-on with React Native and Fabric
- Free Code Camp Which Projects Need React? All Of Them!
- Scotch.io Conditional Routing with React Router v4
- Storybook for React
- Developer Tools for Firefox or Chrome
Learning React - Functional Web Development with React and Redux
React Boilerplates
React Components
- Free Code Camp 8 Key React Component Decisions
- GitConnected React Component Patterns
- React Primer React component prototyping tool that generates fully connected class component code
- JS Coach React components catalog
- Sindre Sorhus React extras (GitHub)
- React Autosuggest
Redux
- Redux official documentation
- TLTR; Redux
- A Dummy’s Guide to Redux and Thunk in React
- Egghead Getting started with Redux
- Egghead Redux cheatsheet
- Scotch.io 5 Essential React Concepts to Know Before Learning Redux
- Lullabot Eat This, It’s Safe: How to Manage Side Effects with Redux-Saga
Vue
- Drupal & Vue.js: how to work without jQuery
- Blake Newman Vue.js deep dive, looking to the future (Frontend United 2018)
- How Is React Different from Vue?
- Switching From React To Vue.js
- Why we moved from Angular 2 to Vue.js (and why we didn’t choose React)
- Sarah Drasner Replacing jQuery With Vue.js: No Build Step Necessary on Smashing Magazine
- A Killer Vue.js Blog Demo: Launch in 2 Hours Tops
- 3 Code Splitting Patterns For VueJS and Webpack
- 10 things I love about Vue
- Learn Vue.js from Top Articles for the Past Year (v.2018)
- Storybook for Vue
JSON API, REST and Drupal
- Drupal.org : JSON API documentation
- Drupalize.me JSON API: Request a Resource comes with about 20 other tutorials when you have an account on their site.
- DrupalCon Baltimore 2017 : Advanced Web Services with JSON API
- Acquia : Decoupled Drupal with Ember: Introducing Ember and JSON API
- Mateu Aguiló Bosch Contenta {json:api} on GitHub
- Smashing Magazine : json-api-normalizer: An Easy Way To Integrate The JSON API And Redux
- adci How to send the JSON data from a Drupal 8 site?
ES6
- Wes Bos ES6 for Everyone
- Scotch.io Better Node with ES6, Pt. I
- Luke Hoban ECMAScript 6 features
- David Walsh Six Tiny But Awesome ES6 Features
- David Walsh Six More Tiny But Awesome ES6 Features
- Previous Next Using ES6 in your Drupal Components
GraphQL
- GraphQL official documentation
- Amazee Labs GraphQL for Drupalers - the queries
- Amazee Labs Drupal and GraphQL with React and Apollo
- Amazee Labs Don’t Push it: Using GraphQL in Twig
- Amazee Labs Webinar GraphQL Twig video, slides, GitHub
- Drupal ♥ GraphQL Projects related to integrating Drupal and GraphQL
- Sitepoint REST 2.0 Is Here and Its Name Is GraphQL
- Pusher REST versus GraphQL
- Smashing Magazine A GraphQL Primer: Why We Need A New Kind Of API (Part 1)
Preact
- Preact Progressive Web App boilerplate, in 30 seconds
- Getting started with PreactJS — A Step By Step Guide
- Addy Osmani A React And Preact Progressive Web App Performance Case Study: Treebo
Fetch, Promise, Async, ...
- Scotch.io How to Use the JavaScript Fetch API to Get Data
- Jake Archibald That's so fetch!
- David Walsh async & await
- Addy Osmani Preload, Prefetch And Priorities in Chrome
Design, animation
- Material UI React components
- Elemental UI toolkit
- Announcing ? styled-components v2: A smaller, faster drop-in upgrade with even more features
- Styling React Components in Sass
- React Native Training React Animations in Depth
- Flight, Ultra Simple Animation Compositions for React
- Animated page transitions with React Router 4, ReactTransitionGroup and Animated
- Design Nation Sketching a Design System with React-SketchApp (playing with Airbnb tool)
- Smashing Magazine Basic Patterns For Mobile Navigation: Pros And Cons
Misc
- Luciano Mammino Universal JavaScript - Frontend United Athens 2017
- Lullabot The Hidden Costs of Decoupling
- AirbnbEng Isomorphic JavaScript: The Future of Web Apps
- Pieter Frenssen Working with Rest APIS - DrupalCamp Wrocław
- Free Code Camp The best front-end hacking cheatsheets — all in one place
- Benjamin De Cock Frontend guidelines
Comments
NC (not verified)
Fri, 13/04/2018 - 20:41
Permalink
Update Drupalize.me JSON API link
The link to the Drupalize.me JSON API article should be: https://drupalize.me/tutorial/json-api-resource-requests?p=3003 (the current link returns 404).
christophe
Mon, 30/04/2018 - 12:10
Permalink
In reply to Update Drupalize.me JSON API link by NC (not verified)
Thanks, fixed
Thanks, fixed
Add new comment