From the course: Master React 19 and Next.js 16 with Hands-On Projects and Real-World Applications

Unlock this course with a free trial

Join today to access over 25,200 courses taught by industry experts.

Pull messages using a server action

Pull messages using a server action

Welcome to this session. The main goal is to fill our MessagesList component. We will fetch messages from our server, not with a traditional API endpoint, but by using a server action. Now I am importing two fundamental hooks from React – UseEffect and UseState. You'll Use State to create and manage the state within our component, such as the list of messages we fetch and the loading status. Use Effect is for handling side effects. In this case, its primary job will be to trigger the data fetching process as soon as the component is ready or when the course ID changes. Here I'm setting up the state for our component using the Use State hook. First, I'm initializing a state variable called messages as an empty array. This array will eventually hold all the message objects we fetch from the server. The setMessages function is what you'll use to update this array. Next, I'm creating a loading state and initializing it to true because the component will start fetching data as soon as it…

Contents