 One of the most exciting new features in XJS 14 is server actions. Server actions allow you to execute server-side code without creating dedicated API routes. Server actions can be very helpful in various tasks such as fetching data from external APIs, performing business logic, or even updating your database. First let's talk about the syntax for defining server actions. You can define your server actions in two places. In the server component that uses the action or in a separate file for usability. There are three ways to invoke a server action in XJS. First is the action prop. You can use the action prop to invoke a server action from any HTML element such as a button, an input, or a form. This code on the screen will invoke a like this article server action when the user clicks the add to shopping cart button. Number two, the use form state hook. You can use the form action prop to invoke a server action from a form element. This code will invoke the add comment server action when the user submits the form. And third, the start transition hook. You can use the start transition hook to invoke a server action from any component in your next XJS application. This code will invoke the add comment server action. The best method for invoking a server action depends on your specific needs. If you need to invoke a server action from a form element, then use the form action prop. If you need to invoke a server action from a component, then use the start transition hook. Once you have a basic understanding of server actions, let's show an example using server actions to send data to a third party API. First we'll show a server action that will trigger a form submission. As you'll see later, this is different from other functions triggered by JavaScript function calls. First create a new server action and let's call it add comment. This function will expect a single parameter of the type of form data. As you have the server action created, let's focus on invoking this function when a user submits the form. This is a component that will render the add comment form. With that you have a fully functional server action trigger from a form submission. But if you tried it out, you'll notice that it looks unresponsive and the user isn't aware of what's happening. If you want to fix that by adding a loading or saving activity, you can tell off the blog post about using next day as server action to call external APIs. Now we're going to talk about calling protected API endpoints. Protected APIs are not publicly accessible and require some form of authentication or authorization before they can be accessed. This is important for protecting sensitive data and preventing unauthorized access. There are multiple ways that you can protect APIs. For example, you can use API keys, which are secret strings that are given to authorized clients, or you can use access tokens. They are shortlist tokens that are generated by an authentication server and are sent to an application in response to a successful user authentication. The application then uses the access token to access the API by sending it in its request. Access tokens can take various forms, with the popular option being JSON web tokens, which are JWTs. In the rest of this video, I'm going to focus on using access tokens. And if you want to know why, you can check out the blog post, why you should migrate to OAuth 2.0 from API keys. So the process for using access tokens can be broken down into two steps. Authentication, identifying a user and retrieving an access token, and then calling the endpoint using the received and verifiable access token to call the API endpoint. We won't be covering authenticating, generating, verifying, and securely handling access tokens in this video. But we have several resources and guides that can walk you through that process. Once the user is authenticated, you can write your server action as follows. You can import get access token from the next JSR0 SDK. Then you can set the result of get access token to the access token value. Then you can simply pass the token to the request using the authorization header. Next, in the third party or strong API, you can verify the token to ensure that it's not compromised. And you can decode the token to obtain additional information, such as the user, permissions, and more. In this video, we covered some of the basic fundamentals of server actions. NextJS has tons of exciting features, and we'll be exploring more of them in the future. So if you have any specific NextJS feature that you would like for us to make a video about, please drop a comment below.