Build A Complete E-Commerce Website (Next.js 15, React Query, Tailwind CSS, TypeScript, Wix Studio)

[@sooshil]

I follow you since this channel was Android specific. I am still in Android but still follow along with your tutorials as a side learning. What an amazing tutorial is this. Very much thank you Florian.

[@SeamlessError]

I learned how to make 2d games in unity from this guy and now im learning fullstack websites as well, what a goat.

[@codinginflow]

Respect for going through it all 💪

[@Jaco_codeeza]

Thank you Florian. I am currently busy doing a project with a word press backend. This is fantastic. Bcz it's similar types of logic. Appreciated Bro. Keep up your good coding practise. Learning alot on your channel

[@ArjunCodess]

Hey! I am too starting a project with Woocommerce (Wordpress) and have some questions - can we connect?

[@Leesdjo]

All projects and coding tutorials in this channel are amazing and super engaging. Thank you CodingInFlow

[@codinginflow]

You're very welcome!

[@ectoplasm1285]

oh well, this is going to be a busy weekend. thanks

[@hemantbhonsle1087]

Commenting for algorithm, you deserve it 🙌

[@codinginflow]

thank you my friend!

[@ionutsandu5913]

I love the project and happy over all. One thing I would suggest is that if you need the same data in multiple places it would make sense to fetch it once and put it in a context then get it from there in the components that need it. Fetching the data in the component that needs it every time may make the app feel slow. I've had the best performance times doing it like this.

[@codinginflow]

Can you give an example?

[@ionutsandu5913]

@@codinginflow Let's take the cart for example. It is needed pretty much anywhere in the app. What I would do I would fetch the cart into the top level layout then I will put all the data in a context (CartContext). In the context I will also create some functions to mutate the cart data. There's the pace where I would use the useCart hook you created to fetch data. Long story short I would try to keep all the related data in one place while making it available to all the components that need it and also not having to pass props too many levels down. You might argue that then I will have to turn all the cart components into client components but that's fine. Because the data is fetched on the server there's no layout shit or screen flash because it is passed to the context from the server. Then the client components are also run on the server initially and they will have access to context data even on the server. Following this approach, my websites hit less than 0.5 seconds to load and they are not static websites.

[@codinginflow]

@@ionutsandu5913 The cart data is managed in a single place using React Query

[@deathdefier45]

Great choice avoiding temptation there at 1:01:48 XD thanks for this awesome content

[@GregPeters1]

Top Tier Channel

[@rearevilleza392]

Hello Florian!, I will stay tuned for more heavy enterprise level Next/Typescript React-query Projects.

[@Frames_of_Mind-1]

Wow this is really loaded. I'm starting this right away

[@nice-vf4rj]

The man the myth the legend

[@RamaGuptaOfficial]

Awesome Buddy, please make more like this on Ecommerce

[@prakashbanjade4374]

Top notch video, there's a lot we can learn from this single video. Amazing brother👏

[@codinginflow]

Glad you think so!

[@didholipyan8227]

Trying this tutorial using latest Next JS 15, it has some changes to the rc before. In Latest NEXT 15, dynamic api is asynchronous and you have to await it first before you use it. If you going into some error about the latest NEXT 15 when following this tutorial, just read the documentation that served by NEXT happy coding

[@ermax7]

Amazing job. Thank you, sir !!! 🎉🎉🎉

[@codinginflow]

My pleasure!

[@elianismedina]

This amazing , great job

[@codinginflow]

Thank you!

[@ckayhuo2630]

Your video is awesome for studying! Thank you!

[@codinginflow]

Glad you like it!

[@maorsaadia9806]

Amazing!! Thank you for this kind of content

[@ui-desingerbro]

Om my God thankyou flowshop intergrated COD Delivery

[@SoftwareWrangler]

Hi Florian. I plan to implement a web shop following your tutorial using Wix. What I’m not clear about is whether Wix allows me to redirect the user to the bank’s site for payment processing, after which the bank, by calling one of three endpoints (successful payment, failed payment, cancellation), redirects the user back to the site, and I receive a confirmation. I’ve already implemented this in NextJS 13 with a custom-made backend, but I really like Wix.

[@_hugo_cruz]

Thanks for this bro. Thanks for take you time for build an excelent base project for our future. Hugs!!

[@codinginflow]

Thanks brother

[@codingjitsu]

This is great, Thanks for Sharing.

[@ustin91]

This is really cool. Thank you. I just finished your social media app tutorial and now I'm going to start this new one.

[@igihara2662]

Hello, awesome project! Did you ever use or consider to do Strapi cms?

[@michaelfrieze]

This is awesome!

[@annelourin1456]

Amazing lecture❤❤

[@AjaySingh-jz8qx]

This is amazing😍

[@SoftwareWrangler]

I am following the video, and Wix is great, but I am a bit worried about letting 3rd party company handle my customer's business. Exporting the data and importing it into another database for some other CMS is a huge hustle. Do you consider using some open-source (self-hosted) CMS solution as an alternative to Wix?

[@elianismedina]

How can we implement the add product to a wishlist with Wix headless ?

[@nosajboodhan64]

Amazing content 😮

[@codinginflow]

Thank you!

[@calebopule2490]

This is really really nice. Thank you.

[@codinginflow]

Glad you like it!

[@calebopule2490]

@@codinginflow please is the wix studio free?

[@codinginflow]

@@calebopule2490 Everything except for checkout is free. That's why we implement it only at the end of the tutorial.

[@stachycodes]

Kudos for all the effort you put into this one! If it was your own e-commerce project, would you go with Shopify or Wix headless? Or some other headless solution? Thanks

[@sahed9]

awsome man!

[@SoftwareWrangler]

I already published one project from your previous tutorial on this theme. I built the portion of the backend myself, but I like this one more. The problem is Wix supports only PayPal payment in my country and I have a direct connection with the bank for the payment. Is it possible to use Wix API to trigger that payment was made? Also, API could be super helpful for uploading products from an existing database and not adding them manually.

[@Jim49267]

If you are facing a problem with the (next Link), if the images or title do not appear, just replace them with (a tag)

[@ilan117]

Florian ❤ Thank you so much. I am wondering when will you have start paid courses more in depth ✌️

[@codinginflow]

What would you like to see in a paid course?

[@ilan117]

Thanks Florian. I think of in-depth courses e.g. forms and forms validation (client and server side) , server actions, react query, API`s, Next.js and ORM (Postgres) and so forth. So “short and precise’ more in depth tutorials/subject. I have learned from you so much and when I develop an application with Next.js I follow your "state of mind" 👌

[@codinginflow]

@@ilan117 Thank you I'll take note of that!

[@Dev-f6e]

Thank you for these perfect videos! Quick question - why not consider adding a ChatBot to this e-commerce site? It could really address the most sought-after features in the market :)

[@codinginflow]

That's a cool idea. You should do it!

[@markus_dev_cwb]

Awesome

[@brancode404]

Wow been waiting for this bro. This is great. Can I really use this for my freelance client?

[@codinginflow]

Yes of course!

[@brancode404]

@@codinginflow Thanks alot bro you're the best. Quick question. Should I upload it to VPS server like Hostinger cause I heard vercel is costly when used for production.

[@codinginflow]

@@brancode404 I would deploy to Vercel and only consider my own hosting if I get a ton of users

[@brancode404]

When should I stop using vercel? Will it alert me? What is the user limit for vercel to charge me bro?

[@sujoykrhaldar]

correct me if i am wrong, react query is a client side data fetching tool so how it will help SEO as data will be fetched at client side not in server side ? and why don't you use getServerSideProps ( don't know the same process for next 15 😅) or incremental static regeneration ?

[@codinginflow]

You're correct. That's why we only use React Query in specific places. We need it for optimistic updates and infinite loading since you can't do that server-side.

[@sujoykrhaldar]

@@codinginflow Thank you

[@johnMorris...4032]

nice

[@OmarFaruk-bz4gw]

❤❤❤❤❤❤

[@bh4541]

do we need know reatjs before join this tutorial

[@Deus-lo-Vuilt]

Thanks bro ❤

[@itsthemeg]

Can Printify be integrated so that the delivery is actually done?

[@codinginflow]

Wix e-commerce has numerous fulfillment integrations

[@sahilthummar8237]

One request please make admin panel for this with full functionality just like you used in this tutorial.

[@ionutsandu5913]

Yea right, so you're asking him just to build what a "bilions dollar company" built over the years. Seems fair.

[@yousefsaeed732]

Love u legend

[@devoxygen7395]

Level

[@Learning_1010]

Is there anything that is not free in the tools used?

[@JosephOpio]

Hello my favourite TV presenter

[@codinginflow]

Hello 👋

[@rishiraj2548]

🙂👍🏻💯💯

[@annelourin1456]

Literally best project with best instructor with amazing teaching skills❤❤❤

[@kartikgoel7208]

bhai dekh to le phale video

[@rajfekar1514]

I don't want to depend on wix I am creating whole wix backend in nextjs

[@codinginflow]

Fair enough

[@_vyas_ayush]

Hey there, i was planning on doing the same. let me know how you approach this.

[@rajfekar1514]

@@_vyas_ayush I am doing backend with Laravel API with MySQL dB.

[@rajfekar1514]

@@_vyas_ayush I am using Laravel API as a back-end framework. With MySQL dB

[@kwealcea]

5:15:00

[@kwealcea]

5:34:00

[@kwealcea]

6:16:00

[@JosephOpio]

1:01:44…. 😳😳😳 😮😮😮😮 How can you pray that the site works yet you hover over something else appealing to you. You need Jesus…

[@codinginflow]

😆

[@nicksnotion]

bro using edge☠

[@codinginflow]

Only in the beginning because I had some problem with Chrome 😆

[@ThabisoMasia-f3t]

Flow Shop

[@MaryLee-r2v]

Hernandez Nancy Rodriguez Dorothy Smith Melissa

[@imalh]

your face doesn't match your voice

[@NO8INN]

You r not funny

[@SK_Covers]

Your comment isn't related to this video .

[@raazyaa]

Who care ? Show us your’s

[@ilan117]

Hi Florain ❤ I am using the version 15 next.js. I’m trying to track the following error wix-client.base (getWixClient) … at the OAuthStrategy getting unhandled runtime … can’t read properties of undefined reading metadata. Do you have any idea where can I find a solution for this particular issue ? 🤲

[@elrenzizapatero]

Have the same error, did you fix it?

[@ilan117]

@ i reverted it back to the RC. I could not find a solution. I was hopping Florian will give it a look. 🤲

[@elrenzizapatero]

@@ilan117 I fixed it, the problem is updating all the @wix/... so is updated. And if you cant, then add to the package.json this: "overrides": { "jsonpath-plus": "^10.1.0" }, Hope it helps