El Тестовоеobjetivo заданиеes дляimplementar frontend-разработчикаuna javascript

Задачаde -una реализоватьsola одностраничное приложениеpágina (SPA), вdonde которомel пользовательusuario можетpueda зарегистрироватьсяregistrarse иy просмотретьver личнуюsu информациюinformación о себе.personal.

ДляPara простотыsimplificar разработкиel данногоdesarrollo приложенияde вesta видеaplicación, backend-частиse вproporciona данномel репозиторииarchivo представлен файл app.js. backend-частьen дополнятьeste иrepositorio изменятьcomo неla нужно.parte Процессbackend. запускаNo apies наnecesario вашейmodificar машинеni описанcomplementar ниже.la Авторизацияparte иbackend. регистрацияLa наautenticación backend-частиy реализованаel черезregistro en la parte backend se realizan mediante JSON Web Token.

ТребованияRequisitos

ПриложениеLa должноaplicación состоятьdebe изconstar следующихde страниц:las siguientes páginas:

• /login - страницаPágina сcon формойel входаformulario de inicio de sesión.
• /register - страницаPágina сcon формойel регистрацииformulario de registro.
• / - ГлавнаяPágina страницаprincipal сcon информациейla оinformación пользователе.del usuario.

ОписаниеDescripción страницыde la página /login

Здесь

содержится
• Contiene формаun авторизацииformulario пользователя.
  de

  Такжеautenticación долженpara бытьel предусмотренusuario.

переход
• Debe наtener страницуun botón para navegar a la página /register.
в виде кнопки.

ОписаниеDescripción страницыde la página /register

Здесь

содержится
• Contiene формаun регистрацииformulario пользователя.
  de

  Такжеregistro долженpara бытьel предусмотренusuario.

переход
• Debe наtener страницуun botón para navegar a la página /login.
в виде кнопки.

ОписаниеDescripción страницыde la página / - Главная(Página страницаprincipal)

Здесь

содержится
• Contiene информацияla оinformación пользователеdel -usuario: егоsu аватар,avatar, текстun оtexto себе,sobre имяél пользователя.
  mismo

  Желательноy оформитьsu вnombre видеde карточки.

  usuario.
• Se recomienda presentar esta información en forma de tarjeta.

ТехническиеRequisitos требованияtécnicos

• Убедитесь,Asegúrese чтоde уtener васinstalada стоитla Node.jsúltima последнейversión LTS версии:de Node.js: https://nodejs.org/en/Node.js
• ПриложениеLa должноaplicación бытьdebe написаноestar наescrita en javascript.
• ИспользуемыйFramework фреймворкutilizado: - VuejsVue.js.
• КомпонентнаяBiblioteca библиотекаde -componentes: Vuetify.js

ЗапускInstrucciones para iniciar el API

• Убедитесь,Asegúrese чтоde уtener васla стоитúltima последняя nodeversión LTS версии.de Ссылка для скачивания:Node.js: https://nodejs.org/en/Descargar Node.js
• ВEn консолиla открытьconsola, папкуabra la carpeta frontend.
• УстанавливаемInstale зависимостиlas apidependencias -del вAPI консолиcon запускаемel командуcomando npm install.
• ЗапускаемInicie apiel -API вcon консолиel запускаемcomando команду node app.js.
  

ВAl результатеejecutar вel консолиAPI, получаемverá output:un output en la consola.

СерверEl сservidor con API стартовалha поiniciado адресуen la dirección http://localhost:8080

ПриDurante выполненииlas запросовsolicitudes кal apiAPI, вse консолиgenerarán будутlogs возникатьen логи,la удобноconsola, дляlo тестированияcual приложения.es útil para probar la aplicación.

Запрос

Enviar сsolicitudes jwt-токеном

ЧтобыPara отправитьenviar запросuna сsolicitud токеномcon нужноel указатьtoken, заголовокdebe incluir el encabezado Authorization: Bearer ${токенtoken пользователя}del usuario}.

ПримечанияNotas

• РеализациюLa frontend-частиimplementación следуетde делатьla вparte отдельномfrontend репозитории,debe аhacerse неen вun этомrepositorio репозитории.separado Этотy репозиторийno содержитen вeste себеrepositorio. толькоEste backend-частьrepositorio вsolo видеcontiene api.la parte backend en forma de API.
• ВоDurante времяel разработкиdesarrollo приложенияde неla стоитaplicación, изобретатьno велосипеды.es Дляnecesario компонентовreinventar формыcomponentes. иPara карточекlos предусмотренаcomponentes библиотекаde formularios y tarjetas, utilice la biblioteca Vuetify.js.js.
• ПриAl работеtrabajar сcon Vue.jsjs, следуетuse использоватьVuex, Vuex, Vue-cli, y Vue-routerrouter.
  
• ПриAl перезапускеreiniciar backend-частиla приложенияparte списокbackend пользователейde сбрасываетсяla кaplicación, стандартномуla состоянию!lista de usuarios se restablece a su estado original.
• Написанные
  
unit/e2e-тесты
• Las будутpruebas плюсом.unitarias/e2e Дляson юнитовun уplus. насUtilice используетсяJest jest,para дляunit tests y Cypress para e2e - cypresstests.
  
• ИспользованиеUtilizar соверменногоsintaxis javascript-синтаксисаmoderna будетde плюсомJavaScript (ES5+) фишки)es un plus.
  

Результат

Resultado проделаннойdel работы

РезультатEl данногоresultado тестовогоde заданияesta следуетtarea опубликоватьdebe наpublicarse en github.com вcomo видеun репозиторияrepositorio сcon публичнымacceso доступомpúblico.

Описание

Descripción endpoint'овde los endpoints del API

НижеA будутcontinuación, представленыse всеpresentan возможныеtodos endpoint'ыlos api.endpoints disponibles en el API.

ВажныеNotas замечания:importantes:

• ПоPor умолчаниюdefecto, apiel запускаетсяAPI поse адресуejecuta en la dirección http://localhost:8080.
• ПриAl перезапускеreiniciar apiel пользователиAPI, сбрасываютсяlos вusuarios стандартноеse состояниеrestablecen a su estado original.
• ДляPara тестаprobar apiel можноAPI, использоватьpuede postmanutilizar илиPostman любуюu другуюotra утилиту,herramienta котораяque умеетpermita слатьenviar http-запросыsolicitudes HTTP.

/login/ - авторизация пользователя

ДанныйEste эндпоинтendpoint принимаетacepta запросыsolicitudes наpara авторизациюla пользователей.autenticación Методde HTTP-запросаusuarios. -Método HTTP:  POST

Тело

Cuerpo запросаde la solicitud (вen видеformato json)

Возможные

Posibles ответыrespuestas эндпоинта

endpoint

200 - успешнаяAutenticación авторизация

401 - неправильныеNombre имяde пользователя/пароль

/register/ - регистрацияRegistro пользователя

ДанныйEste эндпоинтendpoint принимаетacepta запросыsolicitudes наpara авторизациюel пользователей.registro Методde HTTP-запросаusuarios. -Método HTTP: POST.

Тело

Cuerpo запросаde la solicitud (вen видеformato json)

Возможные

Posibles ответыrespuestas эндпоинтa

endpoint

200 - успешнаяRegistro регистрация

401 - регистрацияRegistro не удаласьfallido

/about/ - Информация- оInformación пользователеdel usuario

ДанныйEste эндпоинтendpoint возвращаетdevuelve информациюla оinformación пользователе,del котораяusuario естьalmacenada наen сервереel Методservidor. HTTP-запросаMétodo -HTTP: GET.

Возможные

Posibles ответыrespuestas эндпоинтa

endpoint

200 - успешноеInformación получениеobtenida информации

401 - пользовательUsuario неno авторизован

ЕслиSi вno заголовкеse неenvía передаватьel jwt-токен,token либоJWT jwt-токенen былel просроченencabezado -o вернетсяel ответtoken ha expirado, se devolverá la respuesta:

400 - не удалось получить информацию

Полезные

Enlaces ссылки

• https://vuejs.org/ - Vuejs
• https://cli.vuejs.org/ - Vue-cli
• https://vuetifyjs.com/ - Vuetifyjs
• https://router.vuejs.org/- Vue-router
• https://www.getpostman.com/ - postman