Frontend Skills
Frontend Skills
  • Видео 43
  • Просмотров 189 366
#9 Проект "Список собеседований" на Vue3, TS, Pinia. Деплой
Мой telegram-канал t.me/front_everyday
Код на GitHub github.com/AlexanderBelkevich/list-interviews
Готовый проект interviewstest.netlify.app/auth
Практические курсы:
JavaScript frontend-everyday.tilda.ws/
React react.frontend-everyday.ru/
Vue vue.frontend-everyday.ru/
Создаем проект 'Список собеседований' с использованием Vue 3, TypeScript, Pinia, Firebase и Vite! Узнайте, как создать современное веб-приложение. Подробный урок по разработке приложения для хранения данных о собеседованиях с использованием всех вышеперечисленных инструментов.
Просмотров: 321

Видео

#8 Проект "Список собеседований" на Vue3, TS, Pinia. Статистика и фильтр данных
Просмотров 383Месяц назад
Мой telegram-канал t.me/front_everyday Код на GitHub github.com/AlexanderBelkevich/list-interviews Готовый проект interviewstest.netlify.app/auth Практические курсы: JavaScript frontend-everyday.tilda.ws/ React react.frontend-everyday.ru/ Vue vue.frontend-everyday.ru/ Создаем проект 'Список собеседований' с использованием Vue 3, TypeScript, Pinia, Firebase и Vite! Узнайте, как создать современн...
#7 Проект "Список собеседований" на Vue3, TS, Pinia. Вывод новых данных
Просмотров 447Месяц назад
Мой telegram-канал t.me/front_everyday Код на GitHub github.com/AlexanderBelkevich/list-interviews Готовый проект interviewstest.netlify.app/auth Практические курсы: JavaScript frontend-everyday.tilda.ws/ React react.frontend-everyday.ru/ Vue vue.frontend-everyday.ru/ Создаем проект 'Список собеседований' с использованием Vue 3, TypeScript, Pinia, Firebase и Vite! Узнайте, как создать современн...
#6 Проект "Список собеседований" на Vue3, TS, Pinia. Редактирование собеседования
Просмотров 727Месяц назад
Мой telegram-канал t.me/front_everyday Код на GitHub github.com/AlexanderBelkevich/list-interviews Готовый проект interviewstest.netlify.app/auth Практические курсы: JavaScript frontend-everyday.tilda.ws/ React react.frontend-everyday.ru/ Vue vue.frontend-everyday.ru/ Создаем проект 'Список собеседований' с использованием Vue 3, TypeScript, Pinia, Firebase и Vite! Узнайте, как создать современн...
#5 Проект "Список собеседований" на Vue3, TS, Pinia. Отображение и удаление данных
Просмотров 7342 месяца назад
Мой telegram-канал t.me/front_everyday Код на GitHub github.com/AlexanderBelkevich/list-interviews Готовый проект interviewstest.netlify.app/auth Практические курсы: JavaScript frontend-everyday.tilda.ws/ React react.frontend-everyday.ru/ Vue vue.frontend-everyday.ru/ Создаем проект 'Список собеседований' с использованием Vue 3, TypeScript, Pinia, Firebase и Vite! Узнайте, как создать современн...
#4 Проект "Список собеседований" на Vue3, TS, Pinia. Создание собеседования
Просмотров 7512 месяца назад
Мой telegram-канал t.me/front_everyday Код на GitHub github.com/AlexanderBelkevich/list-interviews Готовый проект interviewstest.netlify.app/auth Практические курсы: JavaScript frontend-everyday.tilda.ws/ React react.frontend-everyday.ru/ Vue vue.frontend-everyday.ru/ Создаем проект 'Список собеседований' с использованием Vue 3, TypeScript, Pinia, Firebase и Vite! Узнайте, как создать современн...
#3 Проект "Список собеседований" на Vue3, TS, Pinia. Регистрация и авторизация
Просмотров 1,4 тыс.2 месяца назад
Мой telegram-канал t.me/front_everyday Код на GitHub github.com/AlexanderBelkevich/list-interviews Готовый проект interviewstest.netlify.app/auth Практические курсы: JavaScript frontend-everyday.tilda.ws/ React react.frontend-everyday.ru/ Vue vue.frontend-everyday.ru/ Создаем проект 'Список собеседований' с использованием Vue 3, TypeScript, Pinia, Firebase и Vite! Узнайте, как создать современн...
#2 Проект "Список собеседований" на Vue3, TS, Pinia. Меню и роутинг
Просмотров 1,3 тыс.2 месяца назад
Мой telegram-канал t.me/front_everyday Курс по Pinia ruclips.net/p/PL2hgv2vHkQ7DE77DNxPPEqzdk89PA4gkX Код на GitHub github.com/AlexanderBelkevich/list-interviews Готовый проект interviewstest.netlify.app/auth Практические курсы: JavaScript frontend-everyday.tilda.ws/ React react.frontend-everyday.ru/ Vue vue.frontend-everyday.ru/ Создаем проект 'Список собеседований' с использованием Vue 3, Typ...
#1 Проект "Список собеседований" на Vue3, TS, Pinia. Установка проекта.
Просмотров 3,4 тыс.2 месяца назад
Мой telegram-канал t.me/front_everyday Код на GitHub github.com/AlexanderBelkevich/list-interviews Готовый проект interviewstest.netlify.app/auth Практические курсы: JavaScript frontend-everyday.tilda.ws/ React react.frontend-everyday.ru/ Vue vue.frontend-everyday.ru/ Создаем проект 'Список собеседований' с использованием Vue 3, TypeScript, Pinia, Firebase и Vite! Узнайте, как создать современн...
JWT-аутентификация c Firebase #7 - Refresh Token и выход из приложения
Просмотров 2,2 тыс.Год назад
Завершаем серию видео обновлением токенов и разлогиниванием пользователя Telegram: t.me/front_everyday Instagram: frontend_everyday Разбавь свое портфолио крутыми работами под моим руководством: frontend-everyday.tilda.ws/ Код: github.com/AlexanderBelkevich/jwt-vue3-auth Axios: axios-http.com/
JWT-аутентификация c Firebase #6 - Защита роутов и сохранение состояния
Просмотров 1,5 тыс.Год назад
JWT-аутентификация c Firebase #6 - Защита роутов и сохранение состояния
JWT-аутентификация c Firebase #5 - Получение данных и использование Axios Interseptors
Просмотров 1,9 тыс.Год назад
JWT-аутентификация c Firebase #5 - Получение данных и использование Axios Interseptors
JWT-аутентификация c Firebase #4 - Страница входа
Просмотров 1,9 тыс.Год назад
JWT-аутентификация c Firebase #4 - Страница входа
JWT-аутентификация c Firebase #3 - Страница регистрации
Просмотров 3,3 тыс.Год назад
JWT-аутентификация c Firebase #3 - Страница регистрации
JWT-аутентификация c Firebase #2 - Создание проекта
Просмотров 2,9 тыс.Год назад
JWT-аутентификация c Firebase #2 - Создание проекта
JWT-аутентификация c Firebase #1 - Теория
Просмотров 4,4 тыс.Год назад
JWT-аутентификация c Firebase #1 - Теория
Поболталка. Про портфолио
Просмотров 726Год назад
Поболталка. Про портфолио
Поболталка. Обо мне
Просмотров 1,3 тыс.Год назад
Поболталка. Обо мне
Курс по Pinia #8 - Связка с LocalStorage
Просмотров 7 тыс.Год назад
Курс по Pinia #8 - Связка с LocalStorage
Курс по Pinia #7 - Стиль Composition API
Просмотров 9 тыс.Год назад
Курс по Pinia #7 - Стиль Composition API
Курс по Pinia #6 - Модули
Просмотров 7 тыс.Год назад
Курс по Pinia #6 - Модули
Курс по Pinia #5 - Ассинхронные actions
Просмотров 9 тыс.Год назад
Курс по Pinia #5 - Ассинхронные actions
Курс по Pinia #4 - Синхронные actions
Просмотров 9 тыс.Год назад
Курс по Pinia #4 - Синхронные actions
Курс по Pinia #3 - Getters
Просмотров 10 тыс.Год назад
Курс по Pinia #3 - Getters
Курс по Pinia #2 - State
Просмотров 20 тыс.Год назад
Курс по Pinia #2 - State
Курс по Pinia #1 - Введение
Просмотров 24 тыс.Год назад
Курс по Pinia #1 - Введение
Разработка UI Kit (Vue 3 + Composition API) #8. Компонент Table
Просмотров 5 тыс.Год назад
Разработка UI Kit (Vue 3 Composition API) #8. Компонент Table
Генератор аватарки на JavaScript и HTML2Canvas
Просмотров 1,2 тыс.Год назад
Генератор аватарки на JavaScript и HTML2Canvas
Разработка UI Kit (Vue 3 + Composition API) #7. Компонент Tabs
Просмотров 3,4 тыс.Год назад
Разработка UI Kit (Vue 3 Composition API) #7. Компонент Tabs
Мультиязычность в приложении Vue 3 (i18n)
Просмотров 9 тыс.Год назад
Мультиязычность в приложении Vue 3 (i18n)

Комментарии

  • @user-qf2gg4uq4x
    @user-qf2gg4uq4x 18 часов назад

    Все предельно понятно, спасибо за Ваш труд

  • @xenia1551
    @xenia1551 2 дня назад

    Отличный контент!! Прям СУПЕР! Сделай еще плииз компонент SELECT ...

  • @thesweetlife843
    @thesweetlife843 12 дней назад

    Подскажи по опыту, такой проект тянет на уровень ждуна или чуть повыше ?

  • @slava3553
    @slava3553 14 дней назад

    Спасибо за контент!

  • @tryit7233
    @tryit7233 14 дней назад

    очень классное видео, все получилось! спасибо большое)

  • @user-gr3ky3zu4i
    @user-gr3ky3zu4i 15 дней назад

    еще можно на к app-input-text добавить :disabled="isLoading" тогда при отправке данных будут блокироваться поля ввода)

  • @Anatoli-bq1pe
    @Anatoli-bq1pe 15 дней назад

    Огромная благодарность за отличный контент!

  • @user-fv5jb6nb9r
    @user-fv5jb6nb9r 16 дней назад

    👍

  • @yashuuo
    @yashuuo 23 дня назад

    удаление чет не работает у меня

  • @NillosT
    @NillosT 26 дней назад

    Блин.. Классный курс, но FireBase в реальности не используется в компаниях, у них свой бэк, а у тебя всё завязано на Firebase. Начинающему разработчику очень сложно будет использовать полноценно твой курс... Может сделать дополнительное видео, где можно будет изменить этот проект, чтобы он был максимально приближен к реальности?

    • @frontend-skills
      @frontend-skills 25 дней назад

      Firebase отлично годится для своих проектов, а также для проектов, которые хочется положить в портфолио. У меня ребята на курсе многие новички. Используют Firebase в более сложных кейсах) зато могут работодателям показать: 1. как умеют работать с базами данных и предоставляют, что это такое 2. Как работают с асинхронным кодом Так что именно этот проект пусть останется на Firebase. В будущем другой проект сделаем. А так от реального проекта отличие только тем, что у Firebase свои методы, а на работе чаще всего используется RestAPI или GraphQL. Но работа с ассинхронным кодом никуда не девается, это важнее всего :)

  • @Legolazik
    @Legolazik 26 дней назад

    Спасибо! Супер мини курс)

  • @davitvardanyan27
    @davitvardanyan27 27 дней назад

    💪

  • @davitvardanyan27
    @davitvardanyan27 28 дней назад

    Благодарю, вас

  • @Vladislav1449
    @Vladislav1449 28 дней назад

    Спасибо, кайфовый был курс

  • @xman5911
    @xman5911 28 дней назад

    Увидел багу. Например при регистрации произошла ошибка(отобразилась в UI)и потом переключится на страницу входа, то ошибка остается. Решил просто, в роутер-линк компонентов SingIn и SingUp добавил: @click="authStore.error = null"

  • @user-xj3yx4fy5x
    @user-xj3yx4fy5x 29 дней назад

    Спасибо большое. Думал по началу использовать Vuex, но были проблемы с интеграцией TypeScript. А Pinia - то, что надо! Работает все из коробки.

    • @frontend-skills
      @frontend-skills 29 дней назад

      Пожалуйста :) ну сейчас использовать Vuex - не канон в любом случае)) по крайней мере на новых проектах в связке с Vue3 :)

  • @WalksGirl
    @WalksGirl Месяц назад

    6:56 как по мне так лучше сделать фильтр без кнопок применить и сбросить грамоздко, что б были только чекбоксы Все | Оффер | Отказ, по умолчанию Все, в значение чекбоксов добавить Refusal, Offer и при выборе чекбокса получать его значение и передавать в функцию getAllInterviews если пустота то загружаем все, если не пустота фильтруем

  • @kostyafrompiter
    @kostyafrompiter Месяц назад

    Обязательно пройду курс и можно Джуном на вью

  • @defender6550
    @defender6550 Месяц назад

    👍👍👍👍👍👍👍👍👍👍👍👍

  • @siablo009
    @siablo009 Месяц назад

    Золотой человек, только благодаря тебе я начал понимать документацию)

    • @frontend-skills
      @frontend-skills Месяц назад

      Неожиданно и приятно))))

  • @evgeniys.4325
    @evgeniys.4325 Месяц назад

    Спасибо)

  • @user-pb1zu5wz9r
    @user-pb1zu5wz9r Месяц назад

    Перший камент !

  • @tonykeepfrozen
    @tonykeepfrozen Месяц назад

    Спасибо за урок! Мне не совсем ясна причина по которой фильтруя список, мы снова обращаемся за данными к серверу. Ведь по сути у нас уже есть список всех оферов, почему бы не отфильтровать уже полученные данные? Ведь мы точно знаем, что на момент фильтрации данные на сервере не изменятся. Буду признателен, за объяснение данного момента)

    • @frontend-skills
      @frontend-skills Месяц назад

      Это задел на то, что теоретически данных может быть очень много и тогда придется применять пагинацию данных. Пагинацию лучше реализовывать на сервере, чтобы не грузить кучу данных на фронт. В таком случае, при фильтрации корректней будет новый список получать именно с сервера, так как при локальном поиске данные будут не все

    • @tonykeepfrozen
      @tonykeepfrozen Месяц назад

      @@frontend-skills Понял, спасибо)

  • @valand3103
    @valand3103 Месяц назад

    Спасибо !

  • @evgeniys.4325
    @evgeniys.4325 Месяц назад

    Спасибо!

  • @kovtunos
    @kovtunos Месяц назад

    Спасибо за контент!

  • @user-pb1zu5wz9r
    @user-pb1zu5wz9r Месяц назад

    Опа! Похоже годный контент подъехал!

  • @frontend-skills
    @frontend-skills Месяц назад

    Если у вас при добавлении фильтрации с помощью where вылезает ошибка индексации в консоли - пройдите по предложенной ссылке и создайте индексы в Firebase. И все заработает <3

    • @timurminator2509
      @timurminator2509 10 дней назад

      а можно как-то поподробнее? :)

    • @frontend-skills
      @frontend-skills 10 дней назад

      Если пройти по ссылке в консоли - там форма откроется и все будет понятно, как сделать)

  • @miguelest1505
    @miguelest1505 Месяц назад

    Александр, приветствую! В описании ссылка на проект в GitHub, но там неполный код. Например компонента PageHome там вообще нет. Вообще ощущение, что он(код) с первого урока остался.

  • @miguelest1505
    @miguelest1505 Месяц назад

    Дружищще, что за расширение используешь, чтобы появлялись серые подсказки для набора кода?

  • @kovtunos
    @kovtunos Месяц назад

    Спасибо за контент. В `app-column` немного напрягают `slotProps`. Можно было бы деструктурировать `data`, выглядело бы намного лаконичнее.

    • @frontend-skills
      @frontend-skills Месяц назад

      Верно, можно использовать деструктуризацию)

  • @user-fy2km9pb3l
    @user-fy2km9pb3l Месяц назад

    Отличный курс!

  • @paimonc8593
    @paimonc8593 Месяц назад

    Нужна помощь. const isLogin = ref < boolean > true при форматировании удаляются круглые скобки и получаю ошибку

    • @frontend-skills
      @frontend-skills Месяц назад

      Нужно смотреть конфиг линтеров

  • @user-ri8ow3qh7l
    @user-ri8ow3qh7l Месяц назад

    Заметил, что вы не используете storeToRefs, когда используете переменные из store. Можете объяснить причину? Интересно ваше мнение.

  • @davidhayrapetyan7039
    @davidhayrapetyan7039 Месяц назад

    Спасибо большое 🔥 вопрос , а что если будет заполнено только salaryTo (будет отображаться в таблице не заполнено) Скорее всего нужна проверка если какое то одно заполнено то показывало {{ от salaryFrom }} или {{ до salaryTo }}

    • @frontend-skills
      @frontend-skills Месяц назад

      Можно так) я следовал той логике, что обычно заполняется оба поля) на то она и вилка)

  • @valand3103
    @valand3103 Месяц назад

    Полезный контент, спасибо !🔥

  • @defender6550
    @defender6550 Месяц назад

    💪

  • @defender6550
    @defender6550 Месяц назад

    👍💪

  • @defender6550
    @defender6550 Месяц назад

    👍👍

  • @user-zu3ld8is4y
    @user-zu3ld8is4y Месяц назад

    Благодарю

  • @paimonc8593
    @paimonc8593 Месяц назад

    очень круто, хотелось бы видос по разработке crm системы

    • @frontend-skills
      @frontend-skills Месяц назад

      А что именно хочется посмотреть? Почему именно CRM?)

    • @frontend-skills
      @frontend-skills Месяц назад

      @paimonc8593 ну в ближайшее время я точно не расчитываю делать подобные видео(

  • @davidhayrapetyan7039
    @davidhayrapetyan7039 Месяц назад

    Thankss !!!!

  • @davidhayrapetyan7039
    @davidhayrapetyan7039 Месяц назад

    Thanks !!!!!!!

  • @kovtunos
    @kovtunos Месяц назад

    Спасибо за контент!

  • @user-ri8ow3qh7l
    @user-ri8ow3qh7l Месяц назад

    Огромное человеческое спасибо

  • @Vladislav1449
    @Vladislav1449 Месяц назад

    Компонент app-calendar в v-model не принимает тип string. Это можно увидеть в документации PrimeVue на 44:08. Я сделал так - интерфейс IStage поле date: Date | null. В момент сохранения маплю date: stage.date ? dayjs(stage.date).format('MM.DD.YYYY') : null. И в getData маплю date: stage.date ? new Date(stage.date) : null У тебя компоненты primeVue не типизированы и не ругаются соответственно, что в app-calendar строка потому, что компоненты надо задекларировать. В комментариях к первой части проекта описал подробно как это сделать

    • @frontend-skills
      @frontend-skills Месяц назад

      Все верно :) в следующем уроке это исправим :)

    • @Vladislav1449
      @Vladislav1449 Месяц назад

      @@frontend-skills круто!)

  • @user-hu4fy4ce1f
    @user-hu4fy4ce1f Месяц назад

    🔥🔥🔥

  • @livingston9750
    @livingston9750 Месяц назад

    А если нужно реализовать с роутингом? Чтобы было вроде site/ru/page и т.п

    • @frontend-skills
      @frontend-skills Месяц назад

      Здесь все будет зависит от архитектуры проекта. Но готовое решение в комментариях не накидаю

  • @WalksGirl
    @WalksGirl Месяц назад

    Чтоб не дублировать код при удалении собеседования, можно наверно было изменить interviews.value, она же реактивная, или не получится?

    • @frontend-skills
      @frontend-skills Месяц назад

      А можно поподробнее, про какое дублирование речь?

    • @WalksGirl
      @WalksGirl Месяц назад

      На 36:57, файл PageList.vue, в onMounted строчка 55 ты скопировал спредом результат listIntervies в реактивную переменную interview.value, там массив получается, можно же из нее удалить удаляемое собеседование и она сразу пропадет, и не надо будет два раза дергать firebase.

    • @frontend-skills
      @frontend-skills Месяц назад

      @WalksGirl все верно, можно) но я люблю в таком случае дернуть Firebase. Чтобы точно работать с актуальными данными (здесь это не совсем нужно, но тем не менее). Но в целом вы правы, можно так, как вы говорите 👍

  • @Vladislav1449
    @Vladislav1449 Месяц назад

    Добрый день! А на гитхаб будете пушить? сейчас там только 5 веток. Текущая (6-ая) отсутствует(