1. Form value check (Frontend)

// Prevent submitting incomplete forms
if (!Object.values(editForm.value).every((value) => value !== '')) {
    formError.value = true;
    return;
}

2. try...catch blocks for API request (Frontend)

try {
    // Code that might throw an error
} catch (error) {
    // Code to handle the error
} finally {
    // (Optional) Cleanup or follow-up logic that runs regardless of success/failure
}

3. Message Prompt (Frontend)

// Message prompt element
<MessagePrompt ref="messagePromptRef" />

// Create a ref to access MessagePrompt methods
const messagePromptRef = ref<InstanceType<typeof MessagePrompt> | null>(null);

try {
    ...
} catch (error) {
    // Code to handle the error
    messagePromptRef.value?.show(undefined, err.response?.data?.message);
} finally {
    ...
}

4. Laravel Request and Policy (Backend)

Request

// Determine if the authenticated user is authorized to make this request.
// If false, Laravel will return a 403 response with an error message.
public function authorize(): bool

// Define validation rules for the incoming request.
// If validation fails, Laravel will return a 422 Unprocessable response
// with error messages for each failed rule.
public function rules(): array

Policy

// an AuthorizationException and return a 403 Forbidden response 
// if this returns false.
public function update(User $user, Note $note): bool
public function delete(User $user, Note $note): bool