A React theme for WooCommerce using Gatsby in a Decoupled WordPress Architecture.
* Front end in React
* Backend in WordPress.
* Uses GraphQL to fetch WordPress data withe the help of wp-graphql and wp-graphql-woocommerce.
This theme uses gatsby-source-wordpress@v4 BETA
*** 👨💻 Please star my repo and follow me to support my work 🙏 ***
Repo: https://github.com/imranhsayed/gatsby-woocommerce-themes
Live Demo: https://gatsby-woocommerce-theme.netlify.app/
It has following features:
Uses React with Gatsby ( Blazing Fast )
PWA ( Works Offline )
Image Optimization ( blur effect )
GraphQL ( with wp-graphql on WordPress )
Custom Widgets, Menus, Social elements.
WooCommerce store
Yoast SEO supported ( with og tags )
Product Search with pagination ( even works offline )
Product pagination
Archive pages.
Authentication with JWT
My Account page ( with Login and Registration )
Create an account on checkout.
Social share.
Product Carousel.
Add to wishlist( even works offline )
Uses wp-graphql-jwt-authentication, wp-graphql-yoast-seo, wp-gatsby
source
Great work & explanation. I'm going to start a pilot project using your resources. One question though..will it works cross domains? Meaning that the woocommerce backend installed on different server & domains while the front end react is using another domains?
Awesome!
where is the full tutorial placing ?
How to download the theme
Hi Imran, huge fan bro just love your work 🙏🙏
Love your content and this is so cool. Please do make a tutorial on how to hook up woo using graphql, gatsby because there is nothing out there as far as I can see.
I am transfering my company on this in upcomming months. Gatsby is great and with this it's complete game changer. Thank you very much for this plugin
Hello very nice video but i have a question…I have a woocomerce site and i want to make it in gatsby but in my case the price of the products depends on the logged in customer how can i manage that with gatsby ….
Can you make a detail tutorial for beginners how to install Gatsby and the project locally for testing and how to upload it to a server. That might be very helpful for most of us.
Hi! Can you expand a little on the chekout process? I see you are redirecting the user to the backend. Are there other alternatives? Thanks, great video!!
Awesome
Most underrated teacher on yt
How can i convert it into real android app? Is it possible with ionic and phonegap or react native
Awesome work ! Well done ! Quesiton as a non techie 😀
Are you going to add some css to login, check-out and my account pages.
That would be more beautifull 🙂 Subscribed
Браво! Я Ваш фанат!!!
Offline browsing looks futuristic 🤩. Super Awesome!
Another great video man! Glad I subscribed to your channel always interesting content, keep up the good work 🙂
Its a great video. Excellently done and explained. Love the overall view and the best part is that most of it features work offline. Great theme in woocommerce. Explained very precisely. Keep up the good work.
Sir how to build same like this wordpress
https://www.stillwhite.com/sell/create
Beautiful! Could this work with Dokan ?
Can you please give the tutorial how to build all the things step by step.
And thank you ❤️
superb , why not Vue.js ?
Very impressed by the functionality of the site with no internet connection. Incredible.
Best channel in youtube!! Please keep that content my friend! Very nice work!
please make a video on affiliate website .with the same technologies
Waiting for the complete tutorial!! I need it!
Awesome. I can see the front end is really fast. Love it! Thanks for your sharing.
Really really amaizing! This woocommerce theme built in React theme powered by Gatsby is mind blowing! Amaizing Single page theme that has impressive offline features excellent UI. This is super sleek! In my opinion this is a Bentley of themes! Great Job Imran! Impressive video quality, narration and soothing music. There is tonnes of learning that one can get with just this video. Yay Electra!!!
Sir, I don't know why you have fewer viewers but believe me you are providing premium content. Keep it up.
There is one problem with this approach… when navigating using the pagination, the URL does not reflect the page I am on, making it impossible to bookmark that location.