This lesson preview is part of the Blazing Fast Next.js with React Server Components course and can be unlocked immediately with a \newline Pro subscription or a single-time purchase. Already have access to this course? Log in here.
Get unlimited access to Blazing Fast Next.js with React Server Components, plus 70+ \newline books, guides and courses with the \newline Pro subscription.
[00:00 - 00:06] Hey, let's get started by discovering the application we want to build in this course. So we want to create an e-commerce application.
[00:07 - 00:25] We are going to put ourselves in the shows of an e-commerce owner who wants to display product on the website and choose the most to buy those. So on the home page I can see a flagship product that is the most important right now for my e-commerce and then a list of products.
[00:26 - 00:40] I can also see the products on the specific page that just displays the same list. If I go back to your home I can pre-order the flagship product so the user can enter their email and pre-order the product.
[00:41 - 00:51] We can see that the call to action here automatically increases any time a user pre-orders. It increases for the current user but also if all the customers are pre- ordering the product.
[00:52 - 01:15] Our e-commerce application also includes an administration area for the e- commerce owner that contains the form that lets us create a new product. So let's create an awesome course, a new line at the price of $1,000 because it 's really a very good course.
[01:16 - 01:28] Save change and now we should be able to see the results on the product list and the home page. So if I go to the product list, yeah indeed I see and know some course on your line for $1,000 so it's up to date.
[01:29 - 01:43] What I want to point out here is that we want the e-commerce to be very fast, to have a good user experience but also to display dynamic data. And the whole point of this course is that it's not that obvious.
[01:44 - 01:50] It needs to blend two techniques, static rendering and revalidation using next.js server actions.