- Página para hacer login (si el usuario no está autenticado)
- Página de Sign up para crear un nuevo usuario (si el usuario no está autenticado)
- Página con la información del usuario y botón para hacer logout (si el usuario ya está autenticado)
- Maquetar interfaz de pagina
sign-in
. - Crear pagina
sign-up
y maquetar su interfaz. - Crear logica que obtenga y almacene un usuario en el almacenamiento local del navegador. La estructura del objeto almacenado seria la siguiente:
account: {
name: String
email: String
password: String
}
- Crear logica que obtenga y almacene el estado del inicio de sesion en el almacenamiento local del navegador. La estructura del objeto almacenado seria la siguiente:
sign-out: Boolean
- Añadir la funcionalidad de agregar un usuario al boton "Create" del formulario en la pagina
sign-up
, ademas almacenar el estado del inicio de sesion activo. - Crear logica que verifique si existe un usuario y si se encuentra auntenticado
- Restringir acceso de las paginas
sign-in
ysign-up
a usuarios auntenticados - Corregir url de enlace de "Sign in" en el
Navbar
- Maquetacion de boton "Sign out" en la
Navbar
- Añadir funcionalidad de salir de sesion al boton "Sign out" del
Navbar
- Añadir funcionalidad de iniciar sesion al boton "Log in" en la pagina
sign-in
- Restringir acceso de la pagina
my-account
para usuarios logueados - Maquetar interfaz de pagina
my-account
, la cual, debera mostrar "nombre" y "email" del usuario logueado. - Añadir ruta para editar cuenta de usuario. Se recomienda reutilizar la interfaz de la pagina
sign-up
- Cambiar ligeramente la interfaz de la pagina
sign-up
en caso se este editando el usuario actualmente autenticado. Se deben mostrar los valores del usuario en los inputs y cambiar el texto del boton "Create" por "Edit".
La navbar o menú principal de la aplicación debe cambiar su estructura dependiendo de si el usuario está autenticado o no:
- Mostrar el correo del usuario (si ya está autenticado)
- Mostrar botón para hacer Sign (si no está autenticado)
- Mostrar correo de usuario autenticado en el componente
Navbar
- Mostrar los enlaces "Sign out", "My Account", "My Orders" y el "email" cuando un usuario se encuentre autenticado
- Mostrar el enlace "Sign in" cuando NO haya un usuario autenticado
Las rutas de Checkout, Órdenes de compra y Visualización de productos NO deben ser visibles para usuarios sin autenticar:
- Hacer redirect a la página de login si el usuario no está autenticado
- Mostrar común y corriente las páginas anteriormente mencionadas si el usuario ya está autenticado
- Restringir acceso de las paginas
home
,my-orders
,my-order
y sus sub-rutas a usuarios auntenticados
- Responsive design para componente
Navbar
- Responsive design para pagina
sign-in
- Responsive design para pagina
sign-up
- Responsive design para pagina
home
- Responsive design para componente
ProductDetail
- Responsive design para componente
CheckoutSideMenu
- Responsive design para pagina
my-account
- Responsive design para pagina
my-orders
- Responsive design para pagina
my-order