YoVDO

React WooCommerce Theme With Nextjs and REST API - Headless WordPress WooCommerce

Offered By: YouTube

Tags

React Courses Web Development Courses WooCommerce Courses

Course Description

Overview

Learn to build a React-based WooCommerce theme using Next.js and WordPress REST API in this comprehensive tutorial. Explore setting up a Next.js project, integrating TailwindCSS with SASS, creating header and footer components, fetching data with Axios, and implementing essential e-commerce functionalities. Master techniques for displaying WooCommerce products, handling image components, managing cart operations, and customizing Tailwind CSS. Gain hands-on experience with React Context API for state management and discover how to integrate Google Fonts into your Tailwind CSS setup.

Syllabus

#1 Setup Next.js Project for WooCommerce React Application | React WooCommerce Theme With REST API.
#2 Setting up TailwindCSS with SASS in Next.js | Combining tailwind css with sass using webpack.
#3 Header Footer REST API Endpoint | React WooCommerce Theme | Nextjs WooCommerce REST API Example.
#4 GetStaticProps with Axios in Next.js | React WooCommerce REST API | Data Fetching | next js axios.
#5 Fetch Site title, Logo in Next.js | React WooCommerce RESTAPI | WordPress React Ecommerce Example.
#6 Nav Menus Next.js | React WooCommerce REST API | Woocommerce React Theme Example | DOMPurify.
#7 Add SVG Icons Nextjs | React WooCommerce REST API | next js woocommerce example | Reactjs.
#8 Footer Widgets Next.js | React WooCommerce REST API | woocommerce react theme | tutorial.
#9 Footer Menus And Social Links Next.js | React WooCommerce REST API | WooCommerce React Theme.
#10 Fetch WooCommerce Products With REST API | @woocommerce/woocommerce-rest-api | Nextjs React.
#11 Display WooCommerce Products Next.js | React WooCommerce REST API | woocommerce react theme.
#12 Create Next.js Image Component | React WooCommerce REST API | woocommerce react theme.
#13 Add Product Image | | React WooCommerce REST API | woocommerce react theme | wordpress rest api.
#14 WooCommerce Products Price Next.js | React WooCommerce REST API | woocommerce react theme.
#15 Warning: Prop dangerouslySetInnerHTML did not match. | How to fix the `dangerouslySetInnerHTML`.
#16 Run Next.js Production Build | React WooCommerce REST API | woocommerce react theme.
#17 Add To Cart WooCommerce REST API | View Cart | React WooCommerce REST API | woocommerce react.
#18 Add To Cart Function | WooCommerce REST API | View Cart | React WooCommerce REST API | WordPress.
#19 View Cart | WooCommerce REST API | React WooCommerce REST API | woocommerce react theme.
#20 Add To Cart Demo | React WooCommerce REST API | WooCommerce react theme | javascript example.
#21 Tailwind CSS Customization | tailwind css react template | tailwind css tutorial | talwindConfig.
#22 Using React Context API To Store Cart Data | React WooCommerce REST API Theme Example.
#23 React Context Provider | Add To Cart | Set Cart | React WooCommerce REST API Example.
#24 Add View Cart Button | React WooCommerce REST API Example | Headless WordPress REST API.
#25 React WooCommerce Add To Bag | React WooCommerce REST API Theme Example | Add To Cart.
#26 How to use Google Fonts in TailwindCSS | Add a Custom Google Font to a Next.js and Tailwind CSS.
#27 The Complete Guide To Customizing A Tailwind CSS theme | Nextjs | Configuration - Tailwind CSS.


Taught by

Imran Sayed - Codeytek Academy

Related Courses

Introduction to ReactJS
Microsoft via edX
Front-End Web Development with React
The Hong Kong University of Science and Technology via Coursera
Multiplatform Mobile App Development with React Native
The Hong Kong University of Science and Technology via Coursera
Client-based Web Applications development: ReactJS & Angular
Universidad Politécnica de Madrid via Miríadax
React
Udacity