در قسمت قبل موفق شدیم که یکی از مشکلات اصلی برنامه ی خود را حل کنیم: بهینه سازی UI و UX با نمایش مشروط لینک ها در navigation و همچنین اضافه کردن navigation guard ها در مسیر dashboard. ممکن است از جلسه ی قبل سوالی برایتان پیش آمده باشد که اگر قرار است در صورت login نبودن کاربر اصلا لینک dashboard را در برنامه نمایش ندهیم، پس چرا از navigation guard برای آن استفاده کردیم؟ مسئله اینجاست که عدم نمایش لینک در navigation با عدم دسترسی به لینک برابر نیست. اگر navigation guard را تعریف نکرده بودیم، کاربر می توانست آدرس dashboard را به صورت دستی وارد کرده (http://localhost:8080/dashboard) و به آن صفحه برود. باید این نکته ی مهم و تفاوت اصلی را درک کنید تا بتواند برنامه های امنی بسازید. بحث این جلسه ی ما در مورد یکی از دو مشکل اساسی برنامه است: در حال حاضر هیچ راهی برای logout شدن نداریم به جز اینکه صفحه را refresh کنیم که اصلا از نظر UI و UX جالب نیست. ما باید دکمه ی جداگانه ای را برای عملیات logout داشته باشیم تا کاربران بتوانند با آن از حساب خود خارج شوند. در حال حاضر داده ها persist نمی شوند. یعنی اگر کاربری login شود و صفحه را refresh کند، توکن امنیتی از بین رفته و دیگر login نخواهد بود چرا که از vuex برای ذخیره ی داده ها استفاده می کنیم و vuex یک پکیج مدیریت state است و state برنامه های وب با refresh شدن از بین می رود مگر آنکه داده ها در جایی مانند localstorage مرورگر persist شود.
پنل نویسندگان