Build a FULLSTACK React Ecommerce App that is fully Responsive with Stripe Payment

Big thanks to @EdRoh for sharing such valuable content. Truly appreciate the hard work and dedication you put into this. May others assist and support you as much as you've helped us. Keep up the amazing work!

i like this but no pagination included

Hi ed, after installing strapi >> npm run develop is not working, can you guide me??

Has anyone managed to deploy it? I tried on render but i get errors when i go to /admin also even if i manage to get in i go to register and lose all the content i have uploaded and even if i create it from scratch sometimes i lose it all over again making me re-register etc

Can you provide me the live website

As a newbie as well as enthusiast I just wanted to know about the reliability and scope of stripe for backend I mean i have learnt about whole MERN and built some projects too but i just wanted to know that whether it is right to trust on this stripe thing or carry on with my node and express only ??

Im not able to download the stripe images from the github link given in the description , can anyone help me to get out of it ?

Strapi is a piece of crap. I keep losing connection at the time.

Edroh, you don't know how grateful I am to come across your page. Your videos have been really helpful, from your social media application(conventional and blockchain). this was really helpful in developing a free eCommerce website. However, I encountered some issues trying to integrate it with Paystack as the Stripe payment gateway is not accepted in my country(Nigeria). I would also appreciate your assistance with the Build command for Strapi in deployment on render. I am really grateful.

Please please please show the rendering page while doing code , otherwise FED will lose interest right. So boring , your technique is right but the way to make understand is so boring I wasted my 1hr here, sorry but next time please show render page side by side.

Hello. Can I go back latter to Strapi dashboard and add more items, price and descr?

const stripe = require("stripe")(process.env.STRIPE_KEY); getting an error here plzz help

your stripe payment is not working

But how do you show the stock in each product sold?

fyi don't bother following the stripe setup and integration part. His code doesn't work anymore and doesn't know the solution.

nice but next time please show us the screen of the website in order for us to know whats happening to the code that weve following in every update.

I wonder why not use the zustand instead of redux stuff... Is any particular reason for this?

Please make Part 2 of this video fixing the errors and adding additional functionality..It's been 8 months..I tried donig it myself but as a beginner I couldn't.

Doing cart without specifying products hits different

How to run that code and see that output, anyone please tell me😢

Thank You for this amazing resource, I have been able to improve upon my skills.
Having a bit of an issue with the stripe configurations. Kindly assist, Thank You

OKAY so how do deploy the ui WITH STRAPI connected to it????

❤❤

Is project responsive for mobile? Please tell me.

Can i see orders in Strapi or i must imported it as code ....

Where is Part 2 where we complete the validation, the navigational components/pages, create user log-in/database, complete the other informational pages in footer, resolve the 3 errors present in the order.js stripe controller, and deploy our pages via gh-pages or web-host otherwise? Fantastic job with this project and the react admin dashboard otherwise. As you mentioned feedback, I would like to see how you resolve more errors and how to strategize the development of each page/not just the composition of each. More documentation back and forth would also be appreciated. Let's get part 2 on this one and the admin dashboard when you find the time. - Love that you provide all your code and assets otherwise - this is helpful on 4hour long projects if we get stuck along the way - for instance, you had some editing issues on react admin and having the code handy provided crucial to my study of your tutorial - you are usually very thorough and informative though - so these 2 projects were a huge undertaking and very informative endeavor otherwise - I appreciate you!

An amazing video but won't advice a newbie to use cause its a bit complex and would just confuse them. But a good tutorial👍

I really wish I had the know how to make the search bar working, to fill out the footer, to create a user login, to use the three dots, and to create a side bar.

thanks edroh. i have some comment , when building part of the component it is better to open browser and visual studio side by side and show us the effect of each change

I am getting an error in the item.jsx file , the error is required is not defined can anyone solve the problem

this video is great.
thank you so much.
what's the name of extension that you mention it?

const importAll = (r) =>
r.keys().reduce((acc, item) => {
acc[item.replace("./", "")] = r(item);
return acc;
}, {});

export const heroTextureImports = importAll(
require.context("../../assets", false, /\.(png|jpe?g|svg)$/)
);

// There is an error at this point. please help me..

Really bad, i don't recommend this

The command to install packages:

npm i @mui/material @emotion/react @emotion/styled @mui/icons-material react-router-dom@6 react-redux @reduxjs/toolkit formik yup dotenv react-responsive-carousel

Hi @EdRoh . I am about to finsih the tutorial and I am on "Stripe setup and integration" But I cannot proceed because of this error ? tp://localhost:1337/api/orders 500 (Internal Server Error)
:1 Uncaught (in promise) IntegrationError: stripe.redirectToCheckout: You must provide one of lineItems, items, or sessionId.
Maybe I am unable to get stripeSessionId? please help. I am about to finsh this. this is also a great tutorial . Thank you

Was anyone able to deploy it successfully ?

Stripe is not working at all when we follow your instructions

To acces the URL of image you have to replace line 19 to 28 of Item.jsx by :
const {
data: {
attributes: { url },
},
} = image;

is it beginner friendly????

It is difficult to run is there some tips for run
Please help me oyt

here's a bit of a QoL tip: use the react snippets extension and type "rface" to create react components faster.
saves time instead of copying and pasting then using ctrl+d to make new components