Это видео недоступно.
Сожалеем об этом.

Angular + NGRX за час

Поделиться
HTML-код
  • Опубликовано: 15 ноя 2019
  • За час рассмотрел:
    - Что такое хранилище
    - Какая библотека организует хранилище в Ангулар
    - Как организован NGRX
    - Что такое #Actions #Reducer #Selectors #Effects
    - Установил базовую сборку #Andular + #NGRX
    - Установил NGRX/Store NGRX/Router NGRX/Effect NGRX/DevTools
    - Изменил комопонент App чтобы он обслуживал логику счетчика
    - Создал #Reducer для хранения #State счетчика
    - Для начального #State описал #Selectors с помощью которых вывел в шаблон данные используя #pipe #async
    - Описал #Actions для создания запроса на изменение #State и описал логику изменения #State в #Reducer
    - Описал Effect для обновления даты в #State
    - Доработал приложение
    - Описал полностью рабочую часть приложения в качестве заключения
    Презентация docs.google.co...
    Код проекта
    github.com/Mak...
    Шаги по установке
    1) git clone github.com/Mak...
    2) cd ngrx-by-an-hour
    3) npm ci
    4) npm start
    5) Открыть в браузере localhost:4200
    Привет друзья. Меня зовут Максим, я начал свой путь в IT в 2014 году.
    Преподавал в ХАИ аж 6 лет, почти что решился защищать кандидатску но IT меня сманило :)
    Мой канал направлен на развитие IT, повышение качества разработчиков и упрощение начала карьеры в IT индустрии.
    Люблю сложные решения, однако понимаю, чтобы давать сложные решения, нужно научить типовым :) Так что толи еще будет на моем канале
    в linkedIn можно посмотреть чем я знимаюсь сегодня
    / maksym-grom-7b1098112
    я в фесбуке (подписывайся)
    / maksym.grom
    Также меня можно найти в твиттере
    / makym_grom
    И телеграмм канале
    t.me/webDevGro...
    Подписывайтесь на канал, рекомендуйте друзьям, ставьте лайки и пишите коменты. Давайте вместе делать мир лучше!
    #NGRX, #angular, #redux, #javascript, #js, #ангулар, #async, #pipe async, #ngrx #reducer, #selectors, #webdev, #typescript, #effects, #ngrxCounterApp, #ngrx #store, #rxjs, #ngrx #rxjs, #frontend
    #ityoutubersru

Комментарии • 139

  • @grommaks
    @grommaks  3 года назад +1

    Привет всем, я снял вторую версию этого урока для того чтобы использовать последний Angular и учесть проблемы этого видео
    ruclips.net/video/TCBFnWYOHk8/видео.html
    Приятного просмотра 😀

  • @aalolooo
    @aalolooo 3 года назад +4

    Вы так все четко и ясно разложили. У вас талант в рассказывании сложных вещей 👍

    • @grommaks
      @grommaks  3 года назад +3

      Я думаю тут не талант 😁
      - потратил достаточно времени на подготовку
      - есть опыт в преподавании
      - есть опыт в разработке
      - есть желание создавать уроки :)
      - и для зрителя актуально и по уроню
      Мне еще нужно много над чем работать)
      - дикция
      - качество звука
      - монтаж
      - связность материаллов
      - сценарий
      - юмор 😅
      Я ценю Вашу поддержку, спасибо 😉

  • @grommaks
    @grommaks  4 года назад +14

    Спасибо ребята что смотрите мои видео :)
    Уже 11 900+ просмотров на этом видео!!! Вы все крутые 😎😎😎

    • @denis_penis
      @denis_penis 4 года назад +1

      >.

    • @romanmekelyta4640
      @romanmekelyta4640 4 года назад +1

      Тебе спасибо, за труд, очень интирестно и доходчиво.

  • @yoelzerbib5009
    @yoelzerbib5009 3 года назад +7

    I don't speak russian but you helped me a lot !! Thank you :)

  • @MrVIPKent
    @MrVIPKent Год назад +2

    Фух найстрашніша для мене частина ангуляру

  • @YevgenKhramov
    @YevgenKhramov 3 года назад +3

    Очень понятно! Спасибо! 12 минута - Redux это расширение для Chrome - его ставить надо.

  • @AndreyDelay
    @AndreyDelay 2 года назад +2

    Браво! Спасибо за шикарную работу!

    • @grommaks
      @grommaks  2 года назад +1

      Спасибо) рекомендую посмотреть плейлист с обновлённым этим уроком, в закреплённом комменте ссылка

  • @ViktOvcharenko
    @ViktOvcharenko 4 года назад +4

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

    • @grommaks
      @grommaks  4 года назад

      Твои слова RUclips в уши ;) Спасибо за поддержку

  • @praecantat1o
    @praecantat1o 3 года назад +2

    Спасибо за хорошее видео! Почему-то сложно найти подобные подробные ролики по NgRx, будто бы никто им не пользуется, хотя все требуют))

  • @user-df8bd7oj6j
    @user-df8bd7oj6j 4 года назад +3

    Хорошее объяснение, мне помогло. Спасибо!

    • @grommaks
      @grommaks  4 года назад

      Приятно знать:) спасибо за отзыв)

  • @Re_p1ay
    @Re_p1ay 4 года назад +2

    Очень крутой видос.
    На работе, в проекте используется диспатч...но хоть убей не понимал почему туда отправляют целый "new Class()", после просмотра твоего видоса, всё встало на свои места.
    Спасибо чувак 👍

    • @grommaks
      @grommaks  4 года назад

      Спасибо за отзы :)
      Очень рад что видео помогло 😎✌️

  • @artyomslife9488
    @artyomslife9488 4 года назад +2

    Топовый контент. Сложно но вроде понятно. Спасибо!

  • @bekzhanseitkali781
    @bekzhanseitkali781 3 года назад +1

    Спасибо большое! Все стало понятно! 👍✊

  • @NN-it2vm
    @NN-it2vm Год назад +1

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

  • @vktarius_dev
    @vktarius_dev 4 года назад +2

    Отличная работа, спасибо)

    • @grommaks
      @grommaks  4 года назад

      Спасибо за хороший отзыв :)
      С 18 Января по 14 февраля будут публиковаться серия уроков по другому приложению, на Angular + NGRX (Todo app) где я раскажу какой логики я следую при разработке на angular

  • @arkadii4052
    @arkadii4052 3 года назад +7

    У кого 11 angular, отключите строгий режим (в tsconfig.json и angular.json изменить strict: true на strict: false). Без этого у вас на ~40 минуте будет ошибка в index.ts в папке reducers. Не знаю исчерпывающее решение, или нет, но в моём случае помогло.

    • @19stalkeronline91
      @19stalkeronline91 2 года назад +1

      Возможно уже не актуально, но можно просто добавить второй параметр CountActions в джинерики ActionReducerMap и MetaReducer следующим образом
      export const reducers: ActionReducerMap
      и
      export const metaReducers: MetaReducer[]
      И сборка проходит успешно. Там просто по дефолту в качестве типа экшенов указан стандартный тип Action из ngrx и когда мы изменили в редьюсере на CountActions тип экшенов типы перестали совпадать.

  • @ole6711
    @ole6711 4 года назад +1

    Большое спасибо) ты очень мне помог)

    • @grommaks
      @grommaks  4 года назад

      Рад слышать это :)

  • @Renarus
    @Renarus 4 года назад +12

    На 28 минуте понимаю какая же это хрень, "ваша заливная рыба". Сложность зашкаливает.

    • @grommaks
      @grommaks  4 года назад +6

      Хочу обратить внимание, что ngrx не сильно сложнее полноценного redux. Главное что есть типизация, а это спасает от проблем :) такой подход широко используется в энтерпрайзе, т.е. Когда проект должен длится год до релиза и потом еще активная фаза десятки лет, а количество команд одновременно работающих над проектом может быть большим (5 и больше, знаю проект с 200 гребцами, фронтов там с пол сотни точно)
      Для мелких проектов достаточно использовать сервисы :) я об этом сниму отдельный ролик, иначе все скажут что vuejs или react очень простой по сравнению с angular;)
      После Java, .NET проектов или Symfony, Magento (php) эта писанина не кажется трудоемкой) а выгляди как спасение от ада на стадии поддержки )

    • @grommaks
      @grommaks  4 года назад

      Скоро выйдет видео о том как сделать REST через @ngrx/data
      ruclips.net/video/-_bHj729Pxc/видео.html
      Думаю Вам понравится это решение, практически не нужно писать код, NGRX дает абстракцию для реализации REST одним сервисом

    • @andreyka26_se
      @andreyka26_se 4 года назад +3

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

    • @grommaks
      @grommaks  4 года назад

      Intellect 👍
      Это видео я делал как hanoff чтобы передать проект после себя :)
      Как вы и написали :)
      Пока никто убить не захотел, значит сделал все правильно 😅
      Даже более того, процесс доработки был довольно таки лояльным для новых ребят

    • @andreyka26_se
      @andreyka26_se 4 года назад +1

      @@grommaks да, видос норм, ибо ненавижу людей который делают что-то для людей (пишут код, статьи, книги, проекты) и не удосуживаются сделать это нормально. Сори, это крик души с галеры xD

  • @levapveeskela4327
    @levapveeskela4327 2 года назад +1

    хороший урок аж из 2019, но думаю он всё ещё очень актуален, спасибо)

    • @grommaks
      @grommaks  2 года назад

      На канале есть вторая версия этого урока) из 2021

    • @grommaks
      @grommaks  2 года назад +1

      В закреплённом комментарии под видео

  • @yevhenolefirenko3000
    @yevhenolefirenko3000 2 года назад +1

    thank you!

  • @user-wb2tb9yo2j
    @user-wb2tb9yo2j 3 года назад +1

    красиво доку пересказал!

    • @grommaks
      @grommaks  3 года назад

      Так я на доку ссылался) в этом смысл урока был, помочь начать

  • @user-gk3ke7dx2x
    @user-gk3ke7dx2x 4 года назад +1

    Бомба 💣!

  • @user-th1zq5id3q
    @user-th1zq5id3q 4 года назад +1

    Я начал работать с NGRX, поработал пару месяцев и понял, что пишу очень много механического кода каждый раз. Думаю - может я как-то не так его понял, пойду послушаю гайды и узнаю как короче писать тот же объем. Открываю вашу лекцию, вижу "очень много писанины" и в принципе мне с этой технологией всё становится понятно

    • @user-th1zq5id3q
      @user-th1zq5id3q 4 года назад +2

      Попробуйте Vue store. Там принципиально меньше писать. Action(там это "мутация") вызывается по названию функции и просто мутирует объект, который приходит ему в аргумент. Никаких трёхтонных switch. Вместо танцев вокруг селект там селект - просто функция, которая принимает state и возвращает из него значение. Вместо всей этой "удобной" мути с Observable все переменные по умолчанию отслеживаются: никаких subscribe, |async, map и прочих.

    • @grommaks
      @grommaks  4 года назад +1

      Я работал на вью и несколько проектов успешно сдано. Но есть одно но, если проект долгоиграющий, то основная цена - поддержка, а не разработка)
      Чем дольше я работаю с e comerce и enterprise, тем сильнее ценю xml, много писанины и большие вложенности :)
      Но я люблю и вью и реакт, каждый хорош по своему :)

    • @grommaks
      @grommaks  4 года назад

      @@user-th1zq5id3q @ngrx/data одна из абстракций которая позволяет писать мало кода
      ruclips.net/video/-_bHj729Pxc/видео.html
      Возможно получится переубедить :) планирую сделать подобный фронтенд на VueJs, вдруг получится лаконичнее :)

  • @ErikGhukasyan
    @ErikGhukasyan 4 года назад +2

    Извините а что и почему Вы добавили в интерфейс и в редусеры в файле index.ts ?

    • @grommaks
      @grommaks  4 года назад

      Если я правильно понял вопрос, то вопрос относится к 22:18
      Хранилище - один объект, который рекурсивно повторяет себя
      В моем случае, главный объект содержит объект Счетчика. В интерфейс я добавил описание дочернего объекта
      Интерфейс это всего лишь описание, но это еще не сама логика.
      Логика находится в редюсере, а значит нужно добавить редюсер для обработки логики Счетчика.
      В корневой объект отвечающий за редюсеры (Combine Reducers) Я добавил редюсер моего модуля

    • @ErikGhukasyan
      @ErikGhukasyan 4 года назад +1

      @@grommaks Спасибо большое за ответ. А за что отвечает файл индекс.тс.
      const reducers: ActionReducerMap зачем создан этот обьект и почему в нем есть элемент countкоторый имеет значение возврашаемого типа метода countReducer. что мызадаем в этом const reducers: ActionReducerMap-е и что если не зададим ничего тут ? СПасибо

    • @grommaks
      @grommaks  4 года назад

      ​@@ErikGhukasyan Если посмотреть презентацию, то в ней видно, что к Store обращение происходит посредством Actions.
      Т.е. в хранилище отправляются объекты, которые должны попросить кого-то, сделать что-то с нашими данными.
      Вот этот кто-то это редюсер, а сделать что-то это код который описан в редюсере
      Если мы не зарегестрируем редюсер, то все Actions которые я создавал в этом уроке ничего не изменят в хранилище, потому что обработкой занимается именно редюсер (в swithc-case конструкции или в другой валидной конструкции).
      Если говорить более простым языком, index.ts в этом уроке, это место регистрации всех редюсеров в проекте и описания типа данных всего хранилища целиком.

    • @ErikGhukasyan
      @ErikGhukasyan 4 года назад +1

      @@grommaks Спасибо Вам за ответы. Я хорошо понял роль редюсеров. Не понимал как и почему описывать редюсеры и стор в индекс.тс. Но вот медленно но проясняется.

    • @grommaks
      @grommaks  4 года назад

      @@ErikGhukasyan рад что смог помочь разобраться :)

  • @igorbond2823
    @igorbond2823 3 года назад +1

    для первого знакомства топ контентент - но теперь есть еще больше вопросов:
    Как дела обстоят с роутингом - мы его подключили но не юзали.
    Всегда ли мы юзаем async пайп или можно делать подписку и в этом случае обязательна ли отписка?
    Можем ли мы где то юзать ngrx, а где то не заморачиваться на наше усмотрение? или если уж юзаем то тотально для всех данных даже если они априори никогда не выйдут за пределы одного компонента и не нужно организовывать единую базу для всех?
    Как работать с массивами данных например items и с одним item? Было бы более наглядно если бы видос был не на примере каунтера, а на примере полноценного Todo приложения.
    Как все это синхронизируется с сервером? NGRX берет на себя работу с HTTP или все равно мы юзаем свой сервис а NGRX просто остается хранилищем?
    Как работать с данными вытянутыми через JOIN или Populate (если это Монго) - к примеру у нас есть хранилище для юзера, а есть для его todos - если мы берем тудушки и там есть поле юзер с данными юзера.
    Как синхронизировать это с формами - то ли у нас остается двусторонная привязка - то ли мы диспатчим данные когда уже полностью заполнили форму и сохраняем.
    Как быть с данными которые меняются и которые только для чтения? - мы храним их вместе или по отдельности?

    • @grommaks
      @grommaks  3 года назад +1

      Все вопросы валидны, на часть из этих вопросов у меня уже есть видео
      Часть вопросов может не иметь однозначных ответов, т.е. приминительно к определенной задаче ngrx обслуживает связи сущностей самостоятельно, а не backend, но это не для каждого приложения
      Все вопросы классные, чувствуется что опыт работы есть около 1-2 года точно, если меньше, интересно узнать сколько опыта работы в реальности? (суммарной в веб разработке)

    • @igorbond2823
      @igorbond2823 3 года назад +1

      @@grommaks суммарный опыт с 2013 года, но больше половины потрачено можно сказать впустую на фрилансе - верстка, работа с движками, несложные скрипты типа галерей, калькуляторов, формочек, корзин сайтики, бложики, магазинчики - короче никак не связано с текущими делами и вопросами. В 2017 делал уже более или менее приличное приложение CRM но без фреймворка, только jQuery на подпевке - вот там столкнулся с кучей проблем которые решены в angular но нужно самому решать в нативном приложении - это и работа с беком, и работа со всеми событиями, и рендеринг нового стейта и т.д. В 2018 взял курс по Angular - и потом же в одно лицо делал эту CRM на angular с беком на nestjs.
      Так что, да примерно 2 года опыта - но это по своему мутный опыт - по сути варился в своем супе, не работал в команде, не видел чужого кода и лучших практик - только по документации и по видосам. А NGRX только сейчас учить начал - как то не сильно и нуждался в нем в CRM но понимаю что он нужен. Как то так.

    • @grommaks
      @grommaks  3 года назад +1

      ​@@igorbond2823 Деньги можно зарабатывать и будучи одиноким разработчиком :)
      Ваш путь это путь через фриланс...когда сначала на фрилансе работаешь, а потом в офис не берут на ЗП к которой привык...а на меньшие деньги уже не хочется по 40 часов в неделю работать...
      Более практичный путь, это в офисе быть в самом адском проекте 5 лет, потом пойти на фриланс отдыхать с нормальным рейтом :)
      Хотя после проектов со сложной архитектурой, мало кто умеет делать быстро, а не сидеть часами вычислять где сломалось...
      NGRX все еще топовая библиотека для хранилища, хоть хранилище и не всегда нужно, но мне нравится именно NGRX...хотя многим нравится Akita или NGXS

    • @igorbond2823
      @igorbond2823 3 года назад +1

      @@grommaks Да можно конечно. Меня в свое время забанили на Веблансере за разговорчики с администрацией, был довольно рейтинговый акк. Я продолжил со старыми заказчиками работать. Вот с одним из них и пилили приложуху о которой говорил - сначала на modx evo и фронт на нативном js, потом на ангуляре с нест на беке. Сначала была приложуха для компании, потом решили как сервис для всех сделать - но не пошло - денежек не хватило - заморозили. Сейчас ищу че нить на галере в команде поработать. В пятницу собес был, завтра жду результат. NGRX полюбому нужен. Вот копаю )
      А фриланс как то уже не прет - с версткой или с мелкими багами на вордпресах возится не охота, нормальный проект не возьмешь без рейтинга, на angular вообще проектов нет, Короче такое )

    • @grommaks
      @grommaks  3 года назад +1

      @@igorbond2823 Надеюсь все получится в Вашу пользу) работать в фирме часто проще и предсказуемо, а если клиент при деньгах, то можно продавать лучшие практики и он их купит (тесты, архитектуру, модульность) если приложение приносит доход, то ему некуда деваться как стабилизировать его

  • @serdotsenko
    @serdotsenko 3 года назад +1

    привет. спасибо. добавляй пж-та тайм-коды в описание. лайк, подписка. именно та тематика канала, что мне нужно !

    • @grommaks
      @grommaks  3 года назад +1

      Есть ещё вторая версия этого видео в плейлисте из 5 видео) рекомендую посмотреть, это видео содержит старые подходы и актуальную на момент записи видео версию ангуляр, но все что в этом видео я ещё использую на работе, так что оба видео актуальны 😣

    • @serdotsenko
      @serdotsenko 3 года назад +1

      @@grommaks спасибо! я всё прочитал, что есть продолжение ) пока смотрю RxJS

  • @yudgine
    @yudgine 4 года назад +2

    Привет, спасибо за туториал. А где скачать репозеторий с данным проектом?

    • @grommaks
      @grommaks  4 года назад

      Я его не добавлял, вот думаю добавить, изза частых запросов

    • @kamronmaxmudov3060
      @kamronmaxmudov3060 3 года назад +1

      @@grommaks Добавьте пожалуйста

    • @aalolooo
      @aalolooo 3 года назад +2

      @@grommaks Здравствуйте, ещё не добавили данный репозиторий ?

    • @grommaks
      @grommaks  3 года назад +1

      @@aalolooo Добрый день, добавил только что, смотрите описание видео :)

    • @aalolooo
      @aalolooo 3 года назад +2

      @@grommaks Спасибо Огроменное!!! Завтра утром с новыми силами буду зубрить ваш код и экспериментировать.

  • @almazhand
    @almazhand 4 года назад +1

    Можно ли добавить ссылку на гитхаб в описание? Хочется посмотреть на проект в целом сразу

    • @grommaks
      @grommaks  4 года назад

      В этом видео я не шарил код в гитхаб, чтобы была мотивация набирать код...
      Однако думаю, что стоило бы...потому что версии меняются и немного меняется логика настройки проекта.
      Пример с использованием NGRX есть в этом репозитории
      github.com/MaksymGrom/todo-api
      ruclips.net/video/QVuWPLECddU/видео.html

    • @almazhand
      @almazhand 4 года назад

      @@grommaks По ссылке открывается проект PHP + Laravel

  • @advanceduser3713
    @advanceduser3713 3 года назад +1

    Почему почти все русские туториалы на WebStorm и MacOS, где православный VSCode под виндой?

    • @grommaks
      @grommaks  3 года назад +1

      Вторая версия этого виде сделана в VSCode) предлагаю посмотреть, это плейлист из 5 коротких видео

  • @nurda1997
    @nurda1997 4 года назад +1

    Хочу задать простой вопрос получается после того как мы создали Effect все Actions проходят через него?

    • @grommaks
      @grommaks  4 года назад +1

      Да, именно так

    • @nurda1997
      @nurda1997 4 года назад +1

      @@grommaks а что будет если не указать, какой либо экшн?

    • @grommaks
      @grommaks  4 года назад +1

      @@nurda1997 . Будет отрабатывать со всеми action. А значит будет отрабатывать в бесконечном цикле. Потому что effect обязан вернуть новый action (если не указано что empty action), новый action вызовет этот effect еще раз и так до бесконечности

    • @nurda1997
      @nurda1997 4 года назад +1

      @@grommaks спасибо!

    • @nurda1997
      @nurda1997 4 года назад +1

      @@grommaks извини за много вопросов😅 получается все экшнс которые мы пишем, внутри offType(countType.increase...) это новые экшнс которые эффект должен возращать, и если мы не пишем его мы сделаем бесконечный луп?

  • @user-xw3ek8sf9t
    @user-xw3ek8sf9t 4 года назад

    Отличное видео. Если будет время сделай видео про ngrx route , не могу самостоятельно разобраться как можно получить из него текущий route. Буду очень благодарен)

    • @grommaks
      @grommaks  4 года назад

      Спасибо за отзыв и за предложение к видео :)
      Поставил в расписание, расчитываю опубликовать в первой половине февраля)

    • @grommaks
      @grommaks  4 года назад

      Снял, думаю видео получилось не плохим ;) будет опубликовано 17 февраля, можешь подписаться на уведовмление, зайдя на канал в список доступных видео или просто не забудь помостреть :)

    • @user-xw3ek8sf9t
      @user-xw3ek8sf9t 4 года назад +1

      @@grommaks Огромнейшее спасибо!

    • @grommaks
      @grommaks  4 года назад

      @@user-xw3ek8sf9t Думаю будет интересно следующее видео по этой теме
      ruclips.net/video/-_bHj729Pxc/видео.html
      Используя NestJs я реализовал REST API, а на Angular просто использовал @ngrx/data модуль

  • @miraclechina1301
    @miraclechina1301 4 года назад +1

    Есть скорее не вопрос а пожелание: есть такая хорошая практика чтобы нест сам не роздавал статический контент, а делал это nginx можете показать как это зделать? И такая идея для видео: рендеринг на стороне ползователя vs на стороне сервера когда лучше и как, лучшие практики. Также хотел попросить видео о том как несколько инстансов сервера ноды паралелить nginxом мало инфы поетому делу в интернете.

    • @grommaks
      @grommaks  4 года назад

      1) ruclips.net/video/zaCiTTP9zoM/видео.html
      я вроде тут подобную тему раскрыл :)
      2) CSR vs SSR отлично, добавил себе в копилку идей :)
      3) Вас интересует балансер нагрузки? Или единую точку запросов для микросерверов?

    • @miraclechina1301
      @miraclechina1301 4 года назад

      @@grommaks меня интересует(сори незнаю как правильно назывется) когда ставится nginx запускается нода на 4 разных портах, nginx принимет запросы и роздаёт их рандомно на порты ноды.

    • @miraclechina1301
      @miraclechina1301 4 года назад

      @@grommaks по вашей ссылке на первый вопрос не нашол ответа, как установить и настроить nginx для статики, как совместить работу его и nest как апи сервера...

    • @grommaks
      @grommaks  4 года назад

      @@miraclechina1301 Ага, это баланс нагрузки.
      Не могу обещать такое видео :( посмотрю в эту сторону, если получится найти быстрый пример, то сниму видео
      И да, в первом вопросе я перепутал...вопрос по nginx
      Тут все довольно просто у nginx есть узлы location
      вот делаете если location /media то возвращаете статику
      Если location /api то проксируете на backend
      Если location / то на js бандл, где билд ангуляра
      nginx идет сверху вниз...если попадет на первый то отдаст что найдет
      т.е. корневой путь должен быть в самом низу
      Тут надо искать примеры для себя в интернете...быстро видео сейчас сделать не могу :(

  • @user-wv9ds4ft6d
    @user-wv9ds4ft6d 7 месяцев назад +1

    когда приходишь из Vue-разработки и офигеваешь от творящегося безумия. Час мы пишем хрень, которая в других фреймворках, делается минут за 10, предоставляет всю ту же функциональность и работает быстрее. Да блин! Всё в других фреймворках делается в разы проще, чем в ангулар. Ангулар это 1С в мире frontend разработки.

    • @grommaks
      @grommaks  7 месяцев назад

      Это работает в обе стороны :) с ангулара во вью тоже не радость переходить

  • @yakovlimanskiy5238
    @yakovlimanskiy5238 10 месяцев назад +1

    ОРНУЛ "бог ей судья"

  • @user-uc5bz3is2n
    @user-uc5bz3is2n 3 года назад +1

    В целом ясно, не совсем понятно какая иерархия этого всего по правильному в большом приложении. Есть приложение с кучей модулей, аля страниц например и кучей всего, там куча моделей описывающих сущности разные. Содается какая-то одна большая стора, или же создаются сторы отвечающие за какие-то закрытые отдельные логические куски, например покомпонентно? Если второй вариант, как эти сторы шарить между собой, если инфа какая-то нужна в другом модуле? Опять же нужны сервисы.

    • @grommaks
      @grommaks  3 года назад

      У меня на канале есть плейлист где я делаю todo app и там рассказываю как делать для большого приложения :) еще есть курс джедайй веб разработки, я над ним еще работаю, там более сложное и большое приложение, там больше нюансов работы с хранилищем...но там много информации об ангуларе в целом, хранилище это всего часть материаллов курса.

    • @user-uc5bz3is2n
      @user-uc5bz3is2n 3 года назад +1

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

    • @grommaks
      @grommaks  3 года назад

      @@user-uc5bz3is2n Мой опыт со смешенными хранилищами показывает, что часто сильно тормозит то что чего-то еще нет в хранилище...
      Тут нужно сразу готовиться на максимальный перевоз в хранилище данных...хотя может то мой неудачный опыт :) кто знает

  • @olegpryatko2748
    @olegpryatko2748 4 года назад +1

    ракета))

  • @user-jl1jz5jv1g
    @user-jl1jz5jv1g 4 года назад +1

    для тех кто впервые изучает ngrx будет сложно разобраться тк каждый автор одну и туже фичу реализует разными путями))

    • @grommaks
      @grommaks  4 года назад

      Вы абсолютно правы :) в реальных проектах асорти еще то 😃

  • @afriendRU
    @afriendRU 4 года назад +1

    ruclips.net/p/PLqHlAwsJRxANFIgAf7BO8hNYdvipLERxQ - ребят, вот обучающие видео по редаксу, там материал тоже изложен достойно.
    А так, спасибо за работу!)

    • @grommaks
      @grommaks  4 года назад +1

      Привет :) спасибо за отзыв :) Буду стараться улучшать материал в новых видео...
      Однако не всегда получается выделять больше времени на подготовку новых видео :(
      Возможно понравится эта серия уроков ruclips.net/video/QVuWPLECddU/видео.html

  • @nurda1997
    @nurda1997 4 года назад

    Спасибо за годный туториал до этого не понимал NGRX и как работать с ним сейчас более менее, только можешь помочь прописал все точно как ты, но почему то не видит action "countActionType.updatedAt", и еффект не работает, как именно запускается effect? автоматом с помощью декоратора Effect? в чем может быть моя ошибка? Спасибо!!

    • @grommaks
      @grommaks  4 года назад +1

      Спасибо за отзыв :)
      Эффекты регистрируются в модуле, нужно проверить если в модуль был добавлен эффект.
      Если можешь, то лей на гитхаб и скидывай ссылку 😉

    • @nurda1997
      @nurda1997 4 года назад +1

      @@grommaks Извини что трачу твое время но я потратил 2 часа не могу понять почему Эффект не работает, запостил вопрос в стэковерфлоу тихо там, создал репу если у тебя будет время еще раз извини и спасибо!! github.com/nurdared/https-github.com-nurdared-ngrx-tutorial-gromax

    • @nurda1997
      @nurda1997 4 года назад

      @@grommaks Извините еще раз, хотел спросить репу не смотрели?🙌

    • @grommaks
      @grommaks  4 года назад

      Так нужно Ваш репозиторий смотреть, по этому уроку я не публиковал в гитхаб

    • @nurda1997
      @nurda1997 4 года назад

      @@grommaks github.com/nurdared/https-github.com-nurdared-ngrx-tutorial-gromax вот репа спасибо заранее

  • @Heretic3234
    @Heretic3234 2 года назад +1

    Спасибо, за вводные данные. Схему понял, установил. Дальше пошел мрак сплошной. То есть ты просто работаешь и комментируешь. Дружище, это не есть обучение. Почему нет вводной по структуре - где что лежит и т.д? Почему не объясняешь не просто что делаешь, а зачем и как еще можно? Не стал смотреть далее 16-ти минут потому как просто нет смысла. Спасибо за кусочек инфы.

    • @grommaks
      @grommaks  2 года назад

      Может вторая версия понравится больше, в закрепленном комменте есть ссылка на новый плейлист с переработанным сценарием

    • @Heretic3234
      @Heretic3234 2 года назад +1

      @@grommaks я посмотрю, спасибо

  • @ivanormanzhi7755
    @ivanormanzhi7755 3 года назад +2

    10:05 Похоже, что наоборот - если продакшн, то logOnly = true

  • @tonybonybob
    @tonybonybob 4 года назад +1

    Мда эти простыни кода в ngrx убивают, а вы не пробовали использовать надстройку над ngrx-data вроде бы там все проще?

    • @grommaks
      @grommaks  4 года назад

      Планирую использовать) на своих проектах не использовал еще.

    • @tonybonybob
      @tonybonybob 4 года назад +1

      @@grommaks Если будете использовать записывайте видео, очень познавательно и помогают быстрее разобраться и понять, что да как! я сейчас по вашему плейлисту TODO изучаю ngrx. Всегда как-то обходились без редакса, но на носу большой проект и нужно изучать, спасибо за вашу работу!

    • @grommaks
      @grommaks  4 года назад +1

      @@tonybonybob Постараюсь записать как можно быстрее :) NGRX Data мне нравится, уж больно там ничего писать не нужно :) просто нужно понять как правильно API сделать, чтобы работало :) сразу и кеши в LocalStorage будет и все CRUD операции

    • @tonybonybob
      @tonybonybob 4 года назад +1

      @@grommaks Если будет время, очень жду, подписался, колокольчик поставил)))

    • @grommaks
      @grommaks  4 года назад

      ​@@tonybonybob Дублирую в этот поток, возможно кому то будет интересно
      Я сделал видео по @ngrx/data ruclips.net/video/-_bHj729Pxc/видео.html
      Желательно смотреть весь плейлись, однако видео весьма самодостаточно, см. описание видео, там инструкция по старту :)

  • @alexandersinitsyn5107
    @alexandersinitsyn5107 4 года назад +2

    Очень странно, что у тебя так мало подписчиков...

    • @grommaks
      @grommaks  4 года назад

      Я планирую с нового года повысить активность канала, думаю тогда попретб спасибо за отзыв :)

    • @alexandersinitsyn5107
      @alexandersinitsyn5107 4 года назад

      @@grommaks можешь свой вк / телеграмм оставить?Ну или что нибудь для связи)

    • @grommaks
      @grommaks  4 года назад

      @@alexandersinitsyn5107
      Попробуй найди "WebDev. GromMax" в телеге, я создал группу

    • @alexandersinitsyn5107
      @alexandersinitsyn5107 4 года назад

      @@grommaks не смог найти

    • @grommaks
      @grommaks  4 года назад

      @@alexandersinitsyn5107 Исправил, вот ссылка t.me/webDevGromMaxChannel and t.me/webDevGromMaxGroup

  • @user-iq8qp5mt4b
    @user-iq8qp5mt4b 3 года назад +1

    Появилась ужасная ненависть к стору и всему что с ним связано

    • @grommaks
      @grommaks  3 года назад

      Вторая версия этого видео или укрепит мнение или его развеет) там я использовал более новые подходы к написанию сторы 🙂

    • @user-iq8qp5mt4b
      @user-iq8qp5mt4b 3 года назад +1

      @@grommaks а можно ссылку, вынужден разобраться

    • @grommaks
      @grommaks  3 года назад

      @@user-iq8qp5mt4b ruclips.net/video/TCBFnWYOHk8/видео.html в закреплённом посте под этим видео есть ссылка на плейлист, а вот ссылка на первое видео в плейлисте

  • @aleksandrdevelopment3321
    @aleksandrdevelopment3321 4 года назад

    Ребята используйте Akita хватит фапать на дерьмо в виде Redux это из прошлого столетия

    • @grommaks
      @grommaks  4 года назад

      Возможно, однако я в практике вижу много проектов на redux. А akita даже не слышал, обязательно почитаю что это.
      Хочу донести мысль, большому числу зрителей важно попасть на первую работу, другому числу зрителей поддерживать проекты новых клиентов, и лишь не многие могут выбирать на какой технологии работать. NgRX это всего лишь инструмент...со своими плюсами и минусами)

    • @aleksandrdevelopment3321
      @aleksandrdevelopment3321 4 года назад +1

      @@grommaks тогда поглядите что такое Akita и NGSX store хотелось бы увидеть сравнение на вашем канале :)

    • @grommaks
      @grommaks  4 года назад +1

      @@aleksandrdevelopment3321 добавил в копилку идей) спасибо за годное предложение :)