All Projects → rtCamp → Wp Decoupled

rtCamp / Wp Decoupled

Licence: mit
Next.js app with WPGraphQL and WordPress at the backend.

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to Wp Decoupled

Woo Next
🚀 React WooCommerce theme, built with Next JS, Webpack, Babel, Node, Express, using GraphQL and Apollo Client
Stars: ✭ 342 (+73.6%)
Mutual labels:  graphql, wordpress, woocommerce, nextjs
Nextjs Woocommerce
NextJS (React) eCommerce site with WooCommerce backend
Stars: ✭ 53 (-73.1%)
Mutual labels:  graphql, woocommerce, nextjs
Wooshop
A Wocommerce Based React Native App for IOS and Android over GraphQL
Stars: ✭ 92 (-53.3%)
Mutual labels:  graphql, wordpress, woocommerce
Gatsby Woocommerce Themes
⚡ A Gatsby Theme for WooCommerce E-commerce site Gatsby WooCommerce WordPress
Stars: ✭ 306 (+55.33%)
Mutual labels:  graphql, wordpress, woocommerce
Nextjs Headless Wordpress
🔥 Nextjs Headless WordPress
Stars: ✭ 110 (-44.16%)
Mutual labels:  graphql, wordpress, nextjs
Graphql Api For Wp
[READ ONLY] GraphQL API for WordPress
Stars: ✭ 136 (-30.96%)
Mutual labels:  graphql, wordpress
Dokan
Multivendor marketplace platform
Stars: ✭ 146 (-25.89%)
Mutual labels:  wordpress, woocommerce
Next Graphql Blog
🖊 A Blog including a server and a client. Server is built with Node, Express & a customized GraphQL-yoga server. Client is built with React, Next js & Apollo client.
Stars: ✭ 152 (-22.84%)
Mutual labels:  graphql, nextjs
Pop
Monorepo of the PoP project, including: a server-side component model in PHP, a GraphQL server, a GraphQL API plugin for WordPress, and a website builder
Stars: ✭ 160 (-18.78%)
Mutual labels:  graphql, wordpress
Giraffeql
🦒 Developer tool to visualize relational databases and export schemas for GraphQL API's.
Stars: ✭ 128 (-35.03%)
Mutual labels:  graphql, nextjs
Vulcan Next
The Next starter for GraphQL developers
Stars: ✭ 155 (-21.32%)
Mutual labels:  graphql, nextjs
Flutter Woocommerce App
WooCommerce App template that uses Flutter. Integrated to work with WooCommerce stores, connect and create an IOS and Android app from Flutter for IOS and Android
Stars: ✭ 161 (-18.27%)
Mutual labels:  wordpress, woocommerce
Next Advanced Apollo Starter
Advanced, but minimalistic Next.js pre-configured starter with focus on DX
Stars: ✭ 131 (-33.5%)
Mutual labels:  graphql, nextjs
Thunderhub
ThunderHub LND Lightning Node Manager in your Browser
Stars: ✭ 131 (-33.5%)
Mutual labels:  graphql, nextjs
Gatsby Wpgraphql Blog Example
Demo showing how to use WPGraphQL as the source for Gatsby Sites
Stars: ✭ 152 (-22.84%)
Mutual labels:  graphql, wordpress
Wcvendors
The Marketplace plugin for WordPress and WooCommerce
Stars: ✭ 130 (-34.01%)
Mutual labels:  wordpress, woocommerce
Next Apollo Auth
Authentication Boilerplate with Next.js and Apollo GraphQL
Stars: ✭ 159 (-19.29%)
Mutual labels:  graphql, nextjs
Ran
⚡ RAN! React . GraphQL . Next.js Toolkit ⚡ - SEO-Ready, Production-Ready, SSR, Hot-Reload, CSS-in-JS, Caching, CLI commands and more...
Stars: ✭ 2,128 (+980.2%)
Mutual labels:  graphql, nextjs
Code Snippets Wp Speed Up
Code Snippets for WordPress and WooCommerce speed up, which can be imported into the plugin.
Stars: ✭ 168 (-14.72%)
Mutual labels:  wordpress, woocommerce
React Conf 17 Videos
Find that one presentation you missed!
Stars: ✭ 182 (-7.61%)
Mutual labels:  graphql, nextjs

WP Decoupled ⚡️

Project Status: WIP – Initial development is in progress, but there has not yet been a stable, usable release suitable for the public.

This is a React theme boilerplate for WordPress, built with Next JS, Webpack, Babel, Node, Express.

Live demo site.

Live Demo

Demo 🎥

Getting Started 🏄

These instructions will get you a copy of the project up and running on your local machine for development purposes.

Installing 🔧

  1. Clone this repo in [email protected]:rtCamp/wp-decoupled.git
  2. cd wp-decoupled
  3. nvm use
  4. npm install

Configure Backend( WordPress site ) 🔧

1. Add GraphQl support on WordPress

  1. Clone and activate the following plugins, in your WordPress plugin directory:

  2. You can also import default wooCommerce products that come with wooCommerce Plugin for development ( if you don't have any products in your WordPress install ) WP Dashboard > Tools > WooCommerce products(CSV) : The WooCommerce default products csv file is available at wp-content/plugins/woocommerce/sample-data/sample_products.csv

2. For Authentication 🔒

a. You can use any secret token of your choice, however it would be best if you generate one using WordPress Salt generator (https://api.wordpress.org/secret-key/1.1/salt/) to generate a Secret. And just pick up any one of the token and add it in place of 'your-secret-token' below:

Define a Secret in wp-config.php of your WordPress directory:

define( 'GRAPHQL_JWT_AUTH_SECRET_KEY', 'your-secret-token' );

b. Depending on your particular environment, you may have to research how to enable these headers, but in Apache, you can do the following in your .htaccess:

SetEnvIf Authorization "(.*)" HTTP_AUTHORIZATION=$1

Configure Front End 🔧

  • Rename .env.example to .env and update your details
SITE_URL=http://localhost:3000
NEXT_PUBLIC_WOO_SITE_URL=http://yourwocommercesite.com
WOO_CONSUMER_KEY=xxxxx
WOO_SECRET=xxxxx

Commands 💻

  • npm run dev Runs the node server in development mode
  • npm run dev:inspect Runs the dev server with Inspector
  • npm run server Runs the NEXT produciton server
  • npm run lint Runs the linter
  • npm run format Runs the formatter
  • npm run build Creates the NEXT build

Using PWA on mobile 📱

  • Open the site in Chrome on your mobile and then click on add to home screen.
  • It will be downloaded and saved as a Progressive Web App on your mobile.
  • Once added Look WP Decoupled app on your mobile.
  • This PWA will work even when you are offline.

Branches Information 🌱

  1. master Main React WooCommerce theme
  2. develop For testing
  3. wp-docoupled-boilerplate Boilerplate to start a new React theme project with PWA implementation ( Work in Progress )

Author

Contributors 👤

License 📃

This project is licensed under the MIT License - see the LICENSE.md file for details

Does this interest you?

Join us at rtCamp, we specialize in providing high performance enterprise WordPress solutions

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].