Original subtitles

In this lecture, we're going to take a step back to discuss designing our state.

The reason we're going to discuss this topic is because we're going to refactor our code with actions.

We've successfully registered and authenticated the user.

The code we've written is isolated in a single component.

In some cases, you may want to register a user in multiple locations.

For example, you may build an admin interface for managing the application.

This admin interface may include a feature for creating accounts.

It isn't uncommon to build such a feature in those cases.

It would make sense to make the code more reusable.

Currently, if we wanted to create an account in another part of the application, we'd have to rewrite

a lot of the code.

Pernia comes with a solution called actions.

Actions are functions for outsourcing business logic in the store.

Simple as that we can define functions in a store.

These functions will become available to all components.

If you are familiar with View X, Peneha has a different approach to actions.

From actions we can perform mutations.

This feature is completely different from other state management libraries where mutating the state

is disallowed.

There are advantages to using actions.

Firstly, they are available to all components in the register form components.

Any methods defined in the configuration options are isolated to the components.

They can't be used elsewhere unless we pass down the methods as props.

By using actions, they can be exposed to any component.

Another advantage is that actions can be asynchronous.

Since actions are not logged, there isn't a reason to keep track of them.

Lastly, actions can commit multiple mutations.

This can help reduce the amount of code you have to write.

One last thing before we get into writing action functions, I want to make it clear as to when you

would want to define an action instead of defining a method inside a component.

Here's a general rule of thumb If a code you write will affect the state, you'll want to write it as

an action, otherwise, define it as a method for the component.

For this reason, we're going to refactor the code we've written for the registration form.

We'll start the refactoring process in the next lecture.