• ReactJS Где хранить state статуса модального окна(Как правильно, чтобы не был говнокод)?

    Хорошо, что вы задались этим вопросом!Вы думаете в верном направлении.
    Начнем с того, что держать state в main компоненте, плохая практика, при его изменении будет происходить перерендер всех дочерних компонентов по умолчанию и вам придется подтирать за собой - сравнивая пропсы,
    там где это не нужно и где вы даже ничего не принимаете (например в любых контейнерах).
    Для этого есть store, той самой flux архитектуры которой вы пользуетесь. С этим мы поняли, да.

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

    Если оно у вас по типу - что-бы что-то сделать в приложении зарегистрируйтесь, и вылетает модалка , куда бы не нажали. То переиспользовать его уже становится бессмысленным, оно должно быть одно на верхнем уровне, так как это уже глобальное представление, а не плодить кучу в каждом компоненте, где есть обработка любых событий связанных с функционалом приложения напрямую. Тем более что ваш компонент, в таком случае с филосовской точки зрения , ничего не знает ни про какие модальные окна и знать не хочет, он отвечает за представление самого-себя любимого.
    Поэтому вы решаете засунуть в store - reducer modalWindow с значением - show : false/true и диспачите экшен из любого компонента если нужно показывать/скрывать его.
    Повторюсь в данном кейсе модальное окно ОДНО логически их не может быть куча, тем более, что конкретно к компонентам оно никакого отношения не имеет.

    Если оно имеет прямое отношение к вашему компоненту вы хотите и можете его переиспользовать, меняя текст и прочую чепуху, прокидывая true/false и callback через пропсы, храня их в состоянии компонента, к которому это все относится. Но чаще всего это даже не модальные окна, а подсказки которые показывают дополнительную информацию, связанную с компонентом.

    Если это алерты по типу - success, warning, error, которые вылетают где-то внизу (например ) в углу,
    Вы могли бы их также переиспользовать, до момента пока пользователь не нажмет сразу же на эту/другую кнопку и не получит новое сообщение до того как пропало прежнее, и тут вам снова нужно выносить список алертов, которые в настоящее время активны в store, и складывать их в список в том же углу, удаляя и добавляя их, чтобы пользователь успевал читать, что именно ему "кричат".

    Всегда думайте , нужно ли то что я пишу здесь, или может оно должно быть в другом месте.
    С одной стороны создается впечатление, что создав state в main компоненте вы облегчите долю приложения, вместо того чтобы создавать лишний reducer, но как показывает практика это не так.
    Ответ написан
    Комментировать
  • WOW.js не работает в Webpack, почему?

    Добрый день.
    1. Вы устанавливаете https://www.npmjs.com/package/wowjs
    npm i wowjs
    2. Вы импортируете
    import WOW from 'wowjs';
    3.Вы создаете экземпляр класса WOW, у которого есть метод WOW , с помощью него и инициализируете
    new WOW.WOW({
        live: false
       //и любые другие параметры - это просто пример
    }).init();

    4.Далее вы подключаете animate.css
    import 'wowjs/css/libs/animate.css'

    И все должно работать.

    Проверял на анимации появления, элемент должен выезжать снизу.
    <div class="wow bounceInUp">
          Я появляюсь снизу
    </div>
    Ответ написан
  • Как прикрепить смену стиля к id или class?

    Посмотрите подобное решение , думаю оно подойдет вам, если некоторые синтаксические фишки не понятны, я оставил возле них комментарии с ссылками, хороший повод для вас выучить , что-то новое)
    https://codepen.io/olegarh2916/pen/oNzBBRN
    Удачи в изучении!
    Ответ написан
    Комментировать
  • Как реализовать адекватную структуру React приложения?

    Да, вполне. Для такого приложения больше и не нужно.
    Но делить компоненты на умные и презентационные , так себе идея, на каждого умного найдется умнее, в данном контексте , у каждого родителя по отношению к дочернему компоненту, будет свой родитель.
    Если вы также подразумеваете под "умным компонентом" тот где будет вся логика большого компонента , родителя - умного компонента и его детей. То лучше логику писать так где она уместна - на месте , не отходя от кассы)
    И стараться меньше передавать по пропсам данные , где этого можно избегать избегайте, дабы не захламлять логику движения данных.
    В вашем примере на роль умного компонента больше подходит компонент ContactForm, в котором и будет вся возможная логика - обработка импутов и тд, а на роль презентационных - инпуты. А в компоненте Contact, если больше ничего не будет, его можно просто убрать, а если вам нужна обертка для оберните ее просто в div и все.
    Удачи в изучении)
    Ответ написан
    Комментировать
  • Какие знания требуются для js trainee?

    Чтобы компания могла себе позволить нанять стажера, у нее должны быть для этого ресурсы.
    Маленькие компании как правило этого не делают.
    Стажеры в основном - это окончившие либо оканчивавшие в данный момент студенты данной специальности.
    Стажировка - это по своей сути отбор имб, у которых есть потенциал и куча теоретических знаний, но нет практического опыта дева и работы в команде.
    Не советую вам думать в этом направлении.
    Теперь про программирование.
    Чтобы им заниматься нужно вваливать уйму времени - сутки на момент учебы, так как кейсов просто миллион , начиная от простых и заканчивая сложными шаблонами , которые к тому же еще нужно знать куда применять.
    Пройдите первые главы любой книги по js для начинающих и конечно же освойте хоть на каком-то уровне работу с ДОМ.
    После попробуйте написать, простое приложение - пример, игру в которой можно ставить ставки и в зависимости от рандомного значения выигрывать или проигрывать. Чуток улучшите ее, но без перфекционизма .
    Ключ в том, что на момент начала разработки этого приложения вы не должны знать как его написать,
    в течении процесса вы должны апаться и делать для себя маленькие открытия.
    И так далее пока не дойдете до приложений которые могли бы быть хоть кому-то полезны.
    В перерывах между разработкой, брать время и доучивать теорию, неделю из месяца хотя-бы.
    И это все до фреймворков!
    И возможно тогда вы получите оффер, после бесплатного испытательного срока.
    Советую вам поторопиться так как скоро, если не уже, фреймворк будет минимальной базой при получении оффера.
    Это жестко, но это сработает.
    Возможно вам повезет и другим образом, но надеяться не стоит.
    Ответ написан
    Комментировать