• В чем смысл bootstrap'a и его аналогов?

    Vlad_IT
    @Vlad_IT Куратор тега CSS
    Front-end разработчик
    Я если и использую bootstrap (что бывает очень редко), то создаю свой каркас в html, и уже через стили импорчу нужные bootstrap'овские классы
    .catalog-item {
        @include make-col(2);
    }

    т.к. мне лично не нравится засорять html множеством классов. Стили поменять чаще легче, чем разметку. В теории, можно научить сборщик не собирать классы bootstrap, которые не использовались в основных стилях.
    Ответ написан
  • Простая задачка, а ответ неверный?

    Compolomus
    @Compolomus Куратор тега PHP
    Комполом-быдлокодер
    3 комментария
  • Какой выбрать монитор для верстальщика?

    webinar
    @webinar
    Учим yii: https://youtu.be/-WRMlGHLgRg
    Какой выбрать монитор для верстальщика в 2019 году?

    широкоформатный или 2 вместо одного

    Если ли смысл в 4k?

    нет

    Не раздражают ли верстальщиков изогнутые формы?

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

    Как вы считаете?

    программно или в уме
    Ответ написан
    17 комментариев
  • Как изменить стрелки на слайдере?

    romandkoz
    @romandkoz
    В скрипте инициализации плагина укажите свои кнопки с помощью prevArrow и nextArrow.

    $('.your-class').slick({
        prevArrow: '<button>Prev</button>',
        nextArrow: '<button>Next</button>'
      });
    Ответ написан
    Комментировать
  • Что умеет выдающийся Frontend разработчик?

    Как человек, делающий и фронт и бэк говорю - бэк проще. На беке ты не паришься вообще с "особенностями" браузеров - у тебя их нет. У тебя вообще практически нет особенностей. У тебя нет необходимости держать в голове пяток яп и разметку(JS, TS, HTML+CSS, CoffeScript, LESS, SCSS) - у тебя есть твой PHP(PYTHON, JAVA) - только один яп. Отдельно идут инструменты сборки - gulp, grunt, webpack - ничего этого нет да и ненужно. Есть композер, который тянет зависимости и все. Тебе ненужно писать километровые конфиги, что бы собрать твое приложение. Линукс тоже знать совсем необязательно - все отлично можно делать и на винде. Ну или развернуть вагрант(докер). Код можно писать где угодно - а вертеться все будет на линуксе. А вот насчет тестирования бэк уделывает фронт на раз-два. Если ты полностью прогнал тестирование (phpunit, codeception) то ты на 99.999% уверен что все пойдет как надо. А вот со фронтом все не так. Ты физически не можешь протестировать ВСЕ браузеры.
    Но есть одно большое но. это конечно мое ИМХО, но всеже - фронт делать интереснее))
    P.S. Забыл упомянуть фреймворки и либы, которые мастхев знать на фронте - React, Vue, Angular и(только камнями не кидайте) jQuery.
    P.P.S Контрольный в голову. Сделали мы клиенту сайт на vue. Сдали, клиент доволен. А потом приходит и говорит - ребята, а на ie8 не работает. А мне очень надо, у меня крупный клиент(бюджетная организация), а у них у всех xp с ie8... (для справки - vue на ie8 не заведется).
    Ответ написан
    7 комментариев
  • Зачем в параметрах при деструктуризации нужно заворачивать в круглые скобки ({}), ([]), а не прямо {}, []?

    mmmaaak
    @mmmaaak
    синтаксис стрелочной функции: () => {}, если аргумент один - можно упустить скобки, если это не добавит неоднозначности при интерпретации, также и про тело функции, если одна операция, можно упустить фигурные скобки, беря во внимание то, что ее результат будет возвращен как результат работы функции. Допустим уберем скобки у аргумента, он же по сути один, запись будет выглядеть так:
    filter({ name } => ...);
    откуда интерпретатору понять, хотел ли ты передать в качестве аргумента объект { name }, который развернется потом в { name: name }, тогда дальнейший код будет невалидным
    filter(/* передать объект как аргумент можно */{ name: name } /*   а дальнейшее не валидно -> */  => ...)

    , или же это стрелочная функция, чтоб дать понять интерпретатору, что ты имеешь ввиду передаваемый объект как аргумент, будь добр - оберни список аргументов, как это подобает исходному синтаксису стрелочных функций
    Ответ написан
    1 комментарий
  • Зачем передают объект в функцию вот так?

    mannaro
    @mannaro Куратор тега JavaScript
    Умею профессионально гуглить
    Это spread оператор. Такая запись просто создаёт объект, в который копирует все ключи из другого объекта. Это просто синтаксический сахар для Object.assign({}, anyObj);

    Очевидно, так надо делать - когда это нужно. И не надо делать, когда это не нужно. Если надо скопировать объект, скопировать объект и добавить в него новые ключи, объединить 2 объекта. Развитие этих конструкций получило после популяризации философии immutable.
    Ответ написан
    Комментировать
  • Объявится ли переменная внутри функции, если её имя совпадает с параметром?

    Stalker_RED
    @Stalker_RED
    На самом деле вместо
    function trololo(param) {
      console.log(variable);
      var variable = 5;
      console.log(variable);
    }
    trololo(10);

    Получается как-то так:
    function trololo(param) {
      var variable; // undefined
      console.log(variable);
      variable = 5;
      console.log(variable);
    }
    trololo(10);


    То есть все объявления с var выносятся в начало функции движком js. Называется это hoisting.
    Ответ написан
    2 комментария
  • Что лучше Фреймворк или Дримвивер?

    Vlad_IT
    @Vlad_IT Куратор тега Вёрстка
    Front-end разработчик
    Начинающему ни тем ни другим. Берете текстовый редактор на выбор - sublime text, vscode и.т.д., и просто учитесь и верстаете на чистом HTML+CSS.
    Ответ написан
    8 комментариев
  • Что лучше Фреймворк или Дримвивер?

    webinar
    @webinar
    Учим yii: https://youtu.be/-WRMlGHLgRg
    Это разные вещи. Вы спрашиваете "что лучше, макароны или вилкой есть". Вилкой есть удобно, можно и макароны вылкой есть. Не понятно почему у Вас Фреймворк исключает Дримвивер и наоборот. Дримвивер - ПО для разработки, Фреймворк - набор заготовок для разработки.
    Но я считаю что Дримвивер не надо использовать никогда и не кому. Особенно в процессе обучения. Это отвратительно ПО, которое делает за Вас кучу работы мешая Вам учиться, мало того - делая весьма дерьмовый код. Хуже только adobeMuse. Так что Дримвивер в топку, берем бесплатный текстовый редактор типа atom или платную IDE типа webStorm или др.

    Какой Фреймворк лучше?

    на вкус и цвет все фломастеры разные. Выбирать надо под проект и по свои предпочтениям. К тому же надо понимать, что framework-и бывают разные, многие совсем не для верстки. Если Вас интересует css framework с которого проще начать - bootstrap4, потому что популярен и востребован и есть очень подробная документация. Плюс его знает 99% верстальщиков, а как следствие круг людей кто может подсказать и посоветовать будет большой.
    Но для изучения базовых вещей в html и css лучше не использовать никакой framework.
    Ответ написан
    8 комментариев
  • Как сверстать макет, ширина которого больше, чем ширина экрана моего монитора?

    Ankhena
    @Ankhena Куратор тега CSS
    Нежно люблю верстку
    Не скачивала полный макет, а только смотрела превью, но ширина макета у вас не 1920. Это только дизайнер показал, как все должно выглядеть, например, на 1920.
    Посмотрите внимательно: есть фиксированная контентная ширина, а все что выходит за нее должно быть растянуто на всю ширину окна браузера, любую.

    Так что на 1600 (да и на 1200 тоже) у вас не должно быть никакой горизонтальной полосы прокрутки.
    Ответ написан
    3 комментария
  • Для чего тут %?

    boyarskiy_mihail
    @boyarskiy_mihail
    Ответ написан
    Комментировать
  • Как убрать часть бордера, в блоке с бордер радиусом?

    LenovoId
    @LenovoId
    svg, css,js
    https://codepen.io/topicstarter/pen/rPpZoa такие вещи на SVG делаются как в лужу Пукнуть ... что и даёт нам возможность для работы с canvas и анимировать каждую деталь по отдельности
    Ответ написан
    5 комментариев
  • Как деплоить небольшие проекты?

    copist
    @copist
    Empower people to give
    1. Хорошая ли идея стягивать все исключительно по тегам т.е. поставил я на фронте и на беке тег v0.4 и скрипт на сервере стянул и то и другое
    2. Самонаписанный скрипт постоянно чекающий теги гитлаба это вообще идея хорошая? В чем +\- деплоя по тегам?


    Метки ставить можно. Даже полезно релизы метками отмечать. Всегда можно определить, на какой комит надо откатиться, чтобы локально восстановить версию кода как на сервере. И release notice писать по git log между метками, а не в памяти держать.

    Постоянно чекать git не надо. Лишняя нагрузка на проц. Совершенно лишняя. Рекомендую веб-хуки или деплоить по SSH команде.

    3. Как быть с адресами и портами.

    Выносите в конфигурационные файлы или в параметры окружения

    10+ вариантов на странице https://css-tricks.com/deployment/
    Я для разного размера проектов пользовался
    1. deployhq - как только обновляется ветка master - сервис обновляет сервер по SSH
    2. веб-хуками из bitbacket + самописным веб-скриптом на PHP без таймлимита - как только приходит хук об обновлении ветки master, выполняется скрипт типа такого
    cd /var/www/project
    cp web/closed.bak web/closed.html # закрыть приложение
    git pull
    composer update && php yii migrate # как то код бэка обновить
    npm run build # как то код фронта обновить
    rm web/closed.html # открыть приложение

    3. такой же командой, запускаемой через ssh, без веб-хуков. Это когда понадобилось сразу бэк и фронт пересобирать из разных репо и из разных веток. Ну типа демо из ветки develop, а релизы из ветки master на несколько серверов.
    4. настраивали Jenkins для авто-установки

    В принципе устраивает
    Ответ написан
    2 комментария
  • Как вычислять скидку в зависимости от суммы?

    0xD34F
    @0xD34F Куратор тега JavaScript
    Как поправить код?

    Такой код не правят, а переписывают.

    Сделаем табличку со скидками:

    const discounts = [
      { percent: 0, sum: 0 },
      { percent: 2, sum: 4000 },
      { percent: 3, sum: 10000 },
      { percent: 4, sum: 20000 },
      { percent: 5, sum: 50000 },
    ];

    Получим скидку:

    const discount = discounts.reduce((p, c) => c.sum <= pricechange ? c : p);

    Посчитаем цену со скидкой:

    const discountedPrice = pricechange * (100 - discount.percent) / 100;

    UPD. В комментариях было высказано мнение, будто показывать reduce автору вопроса, который вроде как начинающий - типа нехорошо. Слишком сложно? Давайте сделаем проще.

    Вместо суммы, на которой начинается действие скидки, будем работать с суммой, на которой скидка действовать перестаёт:

    const discounts = [
      { percent: 0, sum: 4000 },
      { percent: 2, sum: 10000 },
      { percent: 3, sum: 20000 },
      { percent: 4, sum: 50000 },
      { percent: 5, sum: Infinity },
    ];

    В этом случае нужная скидка - первая, чья граница превышает проверяемую сумму:

    const discount = discounts.find(n => n.sum > pricechange);
    Ответ написан
    1 комментарий
  • Как избавиться от мерцания элементов при переходе между компонентами vuejs?

    @AndrewRusinas
    Если они имеют общие компоненты, значит они должны быть в одном view. Те компоненты, которые меняются, должны быть привязаны к соответствующим роутам, а view должен иметь свой router-view. И навигация должна осуществляться с помощью router-link, тогда мерцания не будет. :)
    Ответ написан
    6 комментариев
  • Что более актуально использовать :Grid или flex?

    webirus
    @webirus
    Тыжверстальщик! Наверстай мне упущенное...
    К слову, флексы и гриды НЕ альтернатива друг другу.
    А скорей важное дополнение. На гридах удобно сделать сетку для проекта, минуя фреймворки. Флексы же используются для внутренней разметки блоков чаще всего.
    На счёт актуальности флексов и гридов, каждый проект уникален.
    И исходить нужно не из собственного «как верстать», а из требований заказчика. Так как выбирается метод вёрстки исходя из желаемой поддержки, кроссбраузерности.
    Ответ написан
    1 комментарий
  • Как добавить слепок текущего состояния?

    0xD34F
    @0xD34F Куратор тега Vue.js
    Проблема в реактивности, при изменении текстов в инпуте, меняются старые записанные обьекты

    Ну да, ну да. Вот так и получается: JS не учи, фреймворки используй.

    Сохраняйте копию вместо оригинала. Типа так:

    state.filter_list.push({ ...state.filter })

    Это если объект плоский. Если есть вложенность, используйте _.cloneDeep, например (или какой-либо иной аналог, или сами можете попробовать реализовать рекурсивную функцию копирования).
    Ответ написан
    3 комментария