WordExpress - WordPress using Node, React, GraphQL, and Apollo

  •        20

UPDATE This project has been moved into several separate repositories. Second, you'll need to take a look at a starter kit. I have created a kit for Vue and for React. Fair warning, I've spent much more time developing the Vue starter kit than the React one. The starter kits provide you with everything you'll need to get up and running on the front end.

https://github.com/ramsaylanier/WordpressExpress
https://github.com/ramsaylanier/WordExpress

Dependencies:

apollo-client : ^1.0.1
babel-polyfill : ^6.3.14
body-parser : ^1.17.1
dotenv : ^1.2.0
ejs : ^2.4.1
engine.io-client : ^1.6.7
express-expose : ^0.3.4
graphiql : ^0.9.3
graphql : ^0.9.2
graphql-server-express : ^0.6.0
graphql-tag : ^0.1.7
graphql-tools : ^0.11.0
gsap : ^1.19.1
highlightjs : ^9.10.0
history : ^1.17.0
htmlparser2 : ^3.9.0
lodash : ^4.13.1
mysql : ^2.11.1
npm : ^3.5.3
php-unserialize : 0.0.1
prerender-node : ^2.2.0
react : ^15.4.2
react-apollo : ^1.0.0
react-css-modules : ^3.7.7
react-dom : ^15.4.2
react-helmet : ^2.3.1
react-redux : ^5.0.3
react-router : ^2.5.1
react-router-redux : ^4.0.5
request-promise : ^3.0.0
sequelize : ^3.15.1
wordexpress-components : ^2.0.1
wordexpress-schema : ^2.0.0

Tags
Implementation
License
Platform

   




Related Projects

relay-fullstack - :point_up::running: Modern Relay Starter Kit - Integrated with Relay, GraphQL, Express, ES6/ES7, JSX, Webpack, Babel, Material Design Lite, and PostCSS

  •    Javascript

Relay Fullstack is a Relay scaffolding application that aims to help you get up and running a project without worrying about integrating tools. It comes with many modern technologies; Relay, GraphQL, Express, ES6/ES7, JSX, Webpack, Babel, Material Design Lite, and PostCSS. Relay Fullstack is also using Hot-reload to real time update the screen whenever any code changes. Check out the Live demo on Heroku.

crate - πŸ‘•πŸ‘–πŸ“¦ A sample web and mobile application built with Node, Express, React, React Native, Redux and GraphQL

  •    Javascript

πŸ‘•πŸ‘–πŸ“¦ A sample web and mobile application built with Node, Express, React, React Native, Redux and GraphQL. Very basic replica of stitchfix.com / krate.in (allows users to get monthly subscription of trendy clothes and accessories).

apollo-universal-starter-kit - Apollo 2 Universal Starter Kit — GraphQL React JavaScript app boilerplate for Mobile, Server and Web where code for all platforms built with Webpack to enable max code reuse, stack: Apollo, GraphQL, React 16, React Native, Expo, Express, Knex, SQLite, Twitter Bootstrap, Babel, Webpack

  •    Javascript

Apollo Universal Starter Kit is a SEO friendly boilerplate for Universal Mobile and Web app development built on top of Apollo, GraphQL, React 16, React Native, Expo, Redux, Express with SQL storage support, for styling Twitter Bootstrap, NativeBase and Ant Design integration. Hot Code Reload of back end & front end using Webpack and Hot Module Replacement to reflect your changes instantly and help you stay productive. This starter kit adds full React Native integration, with Webpack as a packager and Expo. No native code compilation tools are needed in order to develop native mobile applications with this kit. You are able to run both web and mobile versions of your app at the same time connected to the same backend.

react-relay-network-layer - ReactRelayNetworkLayer with middlewares and query batching for Relay Classic

  •    Javascript

The ReactRelayNetworkLayer is a Relay Network Layer with various middlewares which can manipulate requests/responses on the fly (change auth headers, request url or perform some fallback if request fails), batch several relay request by timeout into one http request. ReactRelayNetworkLayer can be used in browser, react-native or node server for rendering. Under the hood this module uses global fetch method. So if your client is too old, please import explicitly proper polyfill to your code (eg. whatwg-fetch, node-fetch or fetch-everywhere).

WordPressExpress - WordPress using Node, React, GraphQL, and Relay

  •    Javascript

WordPress using Node, React, GraphQL, and Relay


react-starter-kit - React Starter Kit — isomorphic web app boilerplate (Node

  •    Javascript

React Starter Kit is an opinionated boilerplate for web development built on top of Node.js, Express, GraphQL and React, containing modern web development tools such as Webpack, Babel and Browsersync. Helping you to stay productive following the best practices. A solid starting point for both professionals and newcomers to the industry.

graphql-wp - GraphQL endpoint for WordPress

  •    PHP

Uses this excellent graphql-php library. Supports Relay Connections.

react-firebase-starter - Boilerplate (seed) project for creating web apps with React

  •    Javascript

React Firebase Starter (RFS) is a popular project template (aka boilerplate) for creating single-page applications with React, Firebase and GraphQL.This project was bootstraped with React Firebase Starter by Kriasoft (get support on Telegram).

mean - The MEAN stack uses Mongo, Express, Angular(4) and Node for simple and scalable fullstack js applications

  •    Javascript

MEAN started out as a combination of MongoDB, ExpressJS, AngularJS and Node.js. With MEAN2 we are providing the ability to mix and match additional frontend frameworks, databases and technologies. We aim to create a robust, flexible and scalable full-stack javascript solution.The default MEAN stack you get out of the box can work with either Angular or React and is built with the following technologies...

react-universal - React, redux, react-router, graphql, postgres, koa, universal starter-kit

  •    Javascript

A react starter kit that handles universal rendering as well as a bunch of another neat things. This is sort of a living spec for how I build web applications. react-relay, though the tools are included to get started with Relay, including the graphql backend, I've decided to not include the start of a Relay based front end until server-side rendering hooks are exposed [facebook/relay#136].

Relay '- JavaScript framework for building data-driven React applications.

  •    Javascript

Relay is a JavaScript framework for building data-driven React applications. Never again communicate with your data store using an imperative API. Simply declare your data requirements using GraphQL and let Relay figure out how and when to fetch your data.

react-transmit - Relay-inspired library based on Promises instead of GraphQL.

  •    Javascript

Relay-inspired library based on Promises instead of GraphQL. Let's start one together! After you β˜…Star this project, follow me @Rygu on Twitter.

reactql - Universal React+GraphQL starter kit: React 16, Apollo 2, Webpack 4, Styled Components 4, React Router 4, PostCSS, SSR

  •    TypeScript

Universal front-end React + GraphQL starter kit, written in Typescript. Hot code reloading. Make a change anywhere in your code base (outside of the Webpack config), and changes will be pushed down the browser automatically - without page reloads. This happens for React, Styled Components, SASS - pretty much anything.

webpack-express-boilerplate - A boilerplate for running a Webpack workflow in Node express

  •    Javascript

Please read the following article: The ultimate Webpack setup to know more about this boilerplate. Inspired by this project and the evolving of react-transform and CSS Modules, this project has gotten a major upgrade.

graphql-relay-js - A library to help construct a graphql-js server supporting react-relay.

  •    Javascript

This is a library to allow the easy creation of Relay-compliant servers using the GraphQL.js reference implementation of a GraphQL server.A basic understanding of GraphQL and of the GraphQL.js implementation is needed to provide context for this library.

react-apollo - :recycle: React higher-order component for Apollo Client

  •    TypeScript

React Apollo allows you to fetch data from your GraphQL server and use it in building complex and reactive UIs using the React framework. React Apollo may be used in any context that React may be used. In the browser, in React Native, or in Node.js when you want to server side render.React Apollo unlike many other tools in the React ecosystem requires no complex build setup to get up and running. As long as you have a GraphQL server you can get started building out your application with React immediately. React Apollo works out of the box with both create-react-app and React Native with a single install and with no extra hassle configuring Babel or other JavaScript tools.

react-redux-universal-hot-example - A starter boilerplate for a universal webapp using express, react, redux, webpack, and react-transform

  •    Javascript

I cobbled this together from a wide variety of similar "starter" repositories. As I post this in June 2015, all of these libraries are right at the bleeding edge of web development. They may fall out of fashion as quickly as they have come into it, but I personally believe that this stack is the future of web development and will survive for several years. I'm building my new projects like this, and I recommend that you do, too. The first time it may take a little while to generate the first webpack-assets.json and complain with a few dozen [webpack-isomorphic-tools] (waiting for the first Webpack build to finish) printouts, but be patient. Give it 30 seconds.

language-babel - ES2017, flow, React JSX and GraphQL grammar and transpilation for ATOM

  •    CoffeeScript

Language grammar for all versions of JavaScript including ES2016 and ESNext, JSX syntax as used by Facebook React, Atom's etch and others, as well as optional typed JavaScript using Facebook flow. This package also supports highlighting of GraphQL language constructs when inside certain JavaScript template strings. For .graphql and .gql file support please see language-graphql . The colour of syntax is determined by the theme in use. By default the language-babel package will detect file types .js,.babel,.jsx, .es, .es6, .mjs and .flow. Use the standard ATOM interface to enable it for other file types. This provides a grammar that scopes the file in order to colour the text in a meaningful way. If other JavaScript grammars are enabled these may take precedence over language-babel. Look at the bottom right status bar indicator to determine the language grammar of a file being edited. language-babel will be shown as either Babel or Babel ES6 JavaScript. Clicking the name will allow the grammar for a file to be changed.

graphql.js - A Simple and Isomorphic GraphQL Client for JavaScript

  •    Javascript

GraphQL is based on a very simple HTTP transaction, which sends a request to an endpoint with query and variables.Many libraries require complex stacks to make that simple request. In any project you don't use React, Relay, you'll need a simpler client which manages your query and makes a simple request.