• Как redux обрабатывает actions?

    @xenonhammer
    а если нет, то просто возвращает стейт? - да

    т.е, при каждом вызове любого экшна, редакс всё время обходит полностью все редьюсеры? - нет
    экшен бращатся к своему редъюсеру и выполняется изменения
    Ответ написан
    5 комментариев
  • Закончил свой первый проект на React+Redux, может ли кто-нибудь посмотреть и сказать над чем поработать?

    Psixodelik
    @Psixodelik
    Преподаватель на Hexlet
    first_section, second_section и так далее — не лучшие имена компонентов. Что за первый второй компонент? А если компоненты поменять местами, то логика сохранится?

    Мне это кажется не удобным.


    Почему? В чём будет разница между css и sass файлами? В конечном итоге это всё должно скомпилироваться в один единый код.

    my-container — твой контейнер и твой. А почему твой и чем отличается это не ясно.

    В общем предлагаю начать с именования. Тут много мест, где с этим можно поработать. Вот я посмотрел, будучи не в курсе, что за проект и ничего не понял из имён компонентов и классов
    Ответ написан
    1 комментарий
  • Как правильнее передавать пропсы?

    bootd
    @bootd
    Гугли и ты откроешь врата знаний!
    Зависит от того, что делает компонент.
    Если вы создали свой компонент, блок с товаром или подобные, то лучше 1й вариант.
    Т.к. вы скорей всего большую часть опций будете выводить внутри шаблона, а проще это выглядит, когда свойство состоит из 1 элемента цепочки. Да и отладка будет куда проще с таким подходом.

    data.props.title vs title

    2й вариант лучше подходит, когда компонент - это обёртка для какой-то библиотеки, слайдера например и т.п.. Проще говоря, так удобнее передавать данные, когда вы с ними в самом компоненте не работаете на прямую, а лишь передаёте для инициализации библиотеке. Ведь у неё может быть 100500 опций. Их проще передавать именно таким способом.

    Вывод, создавайте отдельные пропсы для тех свойств, с которыми будете напрямую работать в компоненте, выводить в шаблоне, в вычисляемых свойствах или же просто внутри методов.
    А те, с которыми не будете, исходя из пункта 2, передавайте цельным объектом. Иначе замучаетесь каждую опцию описывать в виде пропса.
    Ответ написан
    Комментировать
  • Какой вариант наименования компонентов более корректный?

    Kozack
    @Kozack Куратор тега Vue.js
    Thinking about a11y
    Главное что бы было в одном стиле. А уж в каком -- это уже как лично вам или внутри вашей команды удобнее.
    Ответ написан
    Комментировать
  • Когда стоит применять em вместо rem?

    ArsenyMatytsyn
    @ArsenyMatytsyn Куратор тега CSS
    Руководитель frontend направления, предприниматель
    Верстка на rem-ах производится с вычислением от корня документа, т.е. body, html, а em от родителя. Притом если у родителя нет изменения в размере font-size, то поиск изменения будет подниматься вверх вплоть до корня.

    Пример тут.

    PS: такой подход позволяет на десктопа указать в html, body{ font-size: 20px, а для таблеток и мобильных html, body{ font-size: 16px и верстка будет пересчитана сама.
    Ответ написан
    7 комментариев
  • Какие единицы лучше использовать при адаптивной верстке?

    devellopah
    @devellopah
    если ты делишь страницу на компоненты, то размер шрифта компонента задаётся в rem, а всё остальное внутри - в em.
    посмотри пример
    я использовал rem чтобы задать размер шрифта компонента. Размеры дочерних элементов компонента должны зависеть от размера шрифта самого компонента, а не корневого элемента, поэтому внутри компонента всё вem.
    Для чего вообще это делать? Просто измени значениеfont-size у класса .card__card_big
    Ответ написан
    Комментировать
  • Когда стоит применять em вместо rem?

    AntonLitvinenko
    @AntonLitvinenko
    HTML coder
    Вот тут хорошо описано отличие em от rem:
    https://learn.javascript.ru/css-units
    В двух словах, em наследует от текущего размера родителя, а rem от базового размера шрифта, заданого html.

    Недавно довелось дорабатывать верстку, сделанную полностью на rem. Так вот, я по привычке некоторыее размеры писал в пикселях, в частности размеры кнопки у слайдера итд. Идея была в том, чтобы на мониторах 4к хорошо выглядело, в итоге базовый шрифт для 4к мониторов был увеличен до 30. НО! Все размеры что я писал в пикселях пришлось тоже переписать на ремы, потому что кнопки стали пропорционально слишком мелкие

    Собственно есть даже плагины для галпа, которые переводят ваши пиксели сразу в ремы
    Ответ написан
    5 комментариев
  • Как избавиться от длинного имени класса БЭМ?

    @Free_ze
    Пишу комментарии в комментарии, а не в ответы
    Необходимо гранулярнее делить на блоки, тогда часть специфичной семантики из названия элемента уедет в новый блок (что укоротит вложенные элементы).

    Текстовая часть напрашивается быть независимым блоком, причем, маркированным списком. Например, структура может быть такой:
    .advantages-card (&--reversed)
        &__description // текстовая часть
        &__picture
    
    .bullet-list
        &__item
        &__item-heading
        &__item-description

    То есть в разметке это будет что-то вроде:
    <div class="advantages-card">
      <ul class="bullet-list advantages-card__description">
        <li class="bullet-list__item">
          <header class="bullet-list__item-heading">User Journey</header>
          <p class="bullet-list__item-description">Description long text</p>
        </il>
      </ul>
      <img class="advantages-card__picture" :src="block.imgURL">
    </div>


    Кроме того, я бы рекомендовал избегать сокращения "description" в "desc", потому что туда идеально укладывается не менее популярный термин "descending".
    Ответ написан
    2 комментария
  • Как организовать кастомизацию компонентов?

    Kozack
    @Kozack Куратор тега CSS
    Thinking about a11y
    А выбирает цвет кто? Компонент parent? Или кто-то выше?
    Если второй случай, тогда, полагаю, пропсы в любом виде, или inject.

    Иначе, такой вопрос: Текст может быть только красным? Или существует вероятность что понадобится другой цвет? Если второй вариант, тогда, полагаю, кастомное свойство будет уместно:
    <template>
    <div class="parent">
      <Child1 class="child1">
        <Child2 class="child2" :style="'--text-color: ' + textColor">
        </Child2>
      </Child1>
    </div>
    </template>


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

    P.S. С БЭМ не работал, поэтому рекомендации могут не соотносится с данной методологией.
    Ответ написан
    Комментировать
  • В каких единицах задавать отступы?

    Ankhena
    @Ankhena Куратор тега CSS
    Нежно люблю верстку
    Всё просто до безобразия.
    Если при изменении размера шрифта у корневого элемента этот отступ должен изменится, то в rem.
    Если он зависит от текущего шрифта, то в em.
    Если не зависит ни от чего и всегда постоянен, то в px.
    Ответ написан
    Комментировать
  • Как работает @yield в Laravel?

    @D3lphi
    Вы создаете шаблон (Назовем его, first.blade.php), вставляете в него @yield():
    <div class="example">
        @yield('content')
    </div>


    Затем вы наследуете от этого шаблона другой шаблон (second.blade.php) и прописываете в него конструкцию @section() с тем же именем, что указали у yield:
    @extends('first')
    
    @section('content')
        Hello, World!
    @endsection


    Теперь вы рендерите второй шаблон:
    class Controller
    {
        public function indexAction()
        {
            return view('second');
        }
    }


    Рендерится вот такая страница:
    <div class="example">
        Hello, World!
    </div>


    Таким образом, получается, что @yield() служит своеобразным маркером, на место которого будет подставлено содержимое @section() дочернего шаблона.
    Ответ написан
    3 комментария
  • Как сделать обновление объекта внутри массива реактивно?

    Aetae
    @Aetae Куратор тега Vue.js
    Тлен
    На самом деле set в данном случае вообще не нужен. Те свойства, которые есть в объекте лежащем в data на момент создания инстанса компонента, становятся реактивными по умолчанию: тык.
    Set использовать нужно только для тех свойств, которых ещё не было.
    Ответ написан
    Комментировать
  • Как объяснить работу event loop под капотом?

    Xuxicheta
    @Xuxicheta
    инженер
    Логично же, что они выводятся в порядке попадания в стэк.
    Промисы - как раз микротаски, но сначала в стэк (для микротасков - это microtask queue) отправляются 4 и 7 (в общей фазе), потом 4 выполнится и добавит 5 после 7. Потом выполнится 7 и добавит в стэк 9. Ну и так далее.
    На 10 microtask queue будет исчерпан и итерация будет закончена.
    А 2 выполнятеся уже в следующей итерации цикла.

    upd. Поправил ответ.
    Ответ написан
    9 комментариев
  • Как правильно скруглить картинку?

    tuxfighter
    @tuxfighter
    троль
    например так:
    img {
        width: 100px;
        height: 100px;
        border-radius: 50%;
        object-fit: cover;
    }
    Ответ написан
    Комментировать
  • Как обеспечивают адаптивность страницы под разные виды устройств?

    @McBernar
    Все так же при помощи медиа-запросов.
    Ответ написан
    Комментировать
  • Реальные задачи JS?

    sfi0zy
    @sfi0zy Куратор тега JavaScript
    Creative frontend developer
    Хотелось бы более приближенные к реальной жизни.

    toster.ru/tag/javascript/questions
    Ответ написан
    Комментировать
  • Какой правильный принцип построения url?

    inoise
    @inoise
    Solution Architect, AWS Certified, Serverless
    Все варианты верные. По большей части разница в том что некоторые адреса проще роутить на разные микросервисы. Ну и личное предпочтение играет большую роль.

    UPD. А использовать get параметры в таком виде считается моветоном, но в основном по тому что так труднее использовать однотипные адреса и "вложенные" ресурсы
    Ответ написан
    Комментировать
  • Как соединить php и vue?

    FanatPHP
    @FanatPHP
    Чебуратор тега РНР
    через rest api
    целесообразно
    Ответ написан
    Комментировать
  • Задание с learn.javascript. Поясните код?

    Xuxicheta
    @Xuxicheta
    инженер
    + Чтобы число получить и работало строгое равенство number === 0
    Унарный плюс
    https://learn.javascript.ru/operators#preobrazovan...
    А обратных слешей у тебя в вопросе вообще нет, но вообще они используются для экранирования или указания спецсимволов
    Ответ написан
    Комментировать