Задать вопрос
  • Можно ли a вкладывать в button?

    pm_wanderer
    @pm_wanderer
    junior-HTML
    Можно, но проще сделать ссылку в виде кнопки или присвоить button role=link и через js указать путь для перехода.
    Ответ написан
  • Какой из вариантов правильнее для функционального программирования JS?

    pm_wanderer
    @pm_wanderer
    junior-HTML
    Чтобы увидеть преимущества функционального подхода, лучше написать пример немного другим образом. Сейчас у Вас в общем ничего функционального там и нет (наличие функций !== ФП):

    function formatter(item) {
        return "0" + item.toString();
    }
    
    function validator(number) {
        if (typeof number !== "number") {
            throw new Error("invalid argument: Number expected");
        }
        return number;
    }
    
    function formatData(array, formatter, validator) {
        return array.map(item => formatter(validator(item)));
    }
    
    alert(formatData([1, 2, 3], formatter, validator));


    PS: можно заморочиться и спроектировать более универсальные функции, но в качестве примера и так сойдет)
    Ответ написан
    6 комментариев
  • Часто ли вы делаете прототипы?

    pm_wanderer
    @pm_wanderer
    junior-HTML
    То что Вы описали называется wireframe (условный набросок с квадратиками вместо картинок).
    Прототип - это по сути интерактивный макет. Он выглядит и ощущается как конечный продукт, но только весь функционал эмулируется специальной программой (типа Axure)

    Если Вам повезет и сможете найти клиента, который согласится оплатить расходы на создание всех этих вещей, то почему бы не сделать). В большинстве случаев проще согласовывать статичный макет.
    Ответ написан
    4 комментария
  • Как обстоят сейчас дела с вебом?

    pm_wanderer
    @pm_wanderer
    junior-HTML
    1) Вот многие ругают велосипеды, а я хочу выступить в их защиту)
    Чем плох свой велосипед?
    Даже дети знают, что иметь свой велосипед намного лучше, чем кататься на чужом)
    Ответ написан
    9 комментариев
  • Как сортировать по индексу другого массива в js?

    pm_wanderer
    @pm_wanderer
    junior-HTML
    Думаю вот так будет правильней и быстрей:
    function sortData(data, sortingOrder) {
      var result = [];
    
      for (var i = 0; i < data.length; i++) {
        result[sortingOrder.indexOf(data[i].ID)] = data[i];
      }
      
      return result;
    }
    Ответ написан
    Комментировать
  • Какие знания нужны хакеру?

    pm_wanderer
    @pm_wanderer
    junior-HTML
    c2a95da463494feca883ee81ab1cc89d.JPG
    Ответ написан
    Комментировать
  • Заголовок H6 может быть меньше текста параграфа?

    pm_wanderer
    @pm_wanderer
    junior-HTML
    Можно сделать 6 типов заголовка в дизайне, но в html они будут присваиваться к элементам h1-h3 через классы, типа:
    <h1 class="header-size-small">Заголовок маленького размера, но главный по структуре документа</h1>
    Ответ написан
  • Как найти работу в сфере IT?

    pm_wanderer
    @pm_wanderer
    junior-HTML
    Запилил короткий тест, чтобы можно было примерно оценить насколько эффективно будет проходить ваше обучение программированию и сколько это займет по времени:

    # ваш возраст менее 25 лет? (1 балл)
    # можете ли вы читать техническую литературу на английском языке? (2 балла)
    # знаете ли вы, что такое наследование, полиморфизм и инкапсуляция? (4 балла)
    # есть ли среди ваших друзей программисты, которых можно часто просить разжевать непонятные вещи или взять вас интерном к ним на работу? (8 баллов)

    Если вы набрали 0-1 баллов: обучение может занять до пяти лет, чтобы дорасти до уровня джуниора, но скорее всего терпения не хватит и забросите это дело через некоторое время. Возможно даже не стоит и начинать.

    Если вы набрали 2-4 балла: обучение может занять до 3 лет, чтобы дорасти до уровня джуниора. Есть немалый шанс что забросите на половине пути, но и небольшая вероятность успеха тоже присутствует.

    Если вы набрали 5-10 баллов: обучение может занять около 2 лет, чтобы дорасти до уровня джуниора. Шансы на успешное вхождение в айти есть, но потребуется много кропотливой работы.

    Если вы набрали 11-14 баллов: обучение может занять около года, чтобы дорасти до уровня джуниора. Шансы на успех достаточно неплохие. Дерзайте)

    Если вы набрали 15 баллов: обучение может занять около полугода, чтобы дорасти до уровня джуниора. Шансы на успех очень высокие. Идеальный билд чара)
    Ответ написан
  • Как менять размер текста при изменении ширины экрана?

    pm_wanderer
    @pm_wanderer
    junior-HTML
    Если брать "классическую" систему респонсивной типографики, то там обычно адаптируют лишь размер заголовков. Вот по ссылке можно ознакомиться: typecast.com/blog/a-more-modern-scale-for-web-typo...
    Подход спорный, но общие принципы в целом адекватные, на мой взгляд. Менять размер параграфов особого смысла не имеет. Если им поставить font-size около 16-20 пикселей с высотой линии в 1.5, то на мобилах они будут выглядеть нормально без адаптивности.
    Ответ написан
    Комментировать
  • На сколько экранов делать media-запросы?

    pm_wanderer
    @pm_wanderer
    junior-HTML
    3 брейкпоинта вполне достаточно:
    600, 900, 1200

    Дизайн обычно рисуют в 3 вариантах: телефон, планшет и десктоп, поэтому увеличивая количество брейкпоинтов мы увеличиваем объем работы для дизайнера и затраты на разработку у заказчика. Ну либо придется самому додумывать как оно будет перестраиваться на брейепоинтах не прорисованных дизайнером.

    PS: у Гугла кстати используется около 8 брейкпоинтов)
    Если интересен их подход, то можно найти рекоммендуемые ими значения в руководстве по Material Design
    Ответ написан
    Комментировать
  • Что можно считать глубокими знаниями в js?

    pm_wanderer
    @pm_wanderer
    junior-HTML
    Немного дополню, чтобы новички не пугались. А то страшилок много о том, что надо знать все, хотя в реальности, тех кто действительно "знает все" можно пересчитать по пальцам:

    Как работает браузер - можно знать лишь в общих чертах, для общего развития. В повседневной жизни это в 99% случаев не нужно. Браузер предоставляет нам API и мы его используем. То как оно устроено внутри пусть остается инкапсулировано внутри.

    Как работает V8 - опять же, достаточно общего представлени об event loop. Все остальное пусть остается скрыто и используется через API.

    Оптимизация кода под браузерные движки - в большинстве случаев вообще не надо.

    Утечки памяти - если умышленно не стрелять себе в ногу, то тоже никаких проблем с этим не будет.

    Написание быстрого кода - практически не нужно (он и так будет достаточно быстрый). Лучше сосредоточиться над написанием читаемого, тестируемого и поддерживаемого кода.

    К общему списку еще можно добавить паттерны проектирования. Это будет намного полезней, чем всякие техники спичечной оптимизации)
    Ответ написан
    40 комментариев
  • Так сколько изображений надо готовить для адаптивного сайта (+ retina)?

    pm_wanderer
    @pm_wanderer
    junior-HTML
    Бери одну картинку, размером "требуемая максимальная ширина экрана помноженная на два" и делай ее. Это самый простой вариант. Если хочется немного пооптимизировать, то бери две картинки - одна большая как в первом случае, а вторая - в два раза меньше. Оптимизировать отдельно для каждого устройства не обязательно - на скорость загрузки это особо не влияет. Картинки только не забудь сжать оптимизатором)

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

    pm_wanderer
    @pm_wanderer
    junior-HTML
    Сафари теперь не позволяет отключать зум, однако строка user-scalable=no в meta по прежнему полезна для запрета зума при нажатии на input
    Ответ написан
    Комментировать
  • Как увеличивать div с середины?

    pm_wanderer
    @pm_wanderer
    junior-HTML
    Увеличение DIVa на пять сантиметров за неделю. Дедовский способ без химикатов. ЖМИ!
    Ответ написан
    Комментировать
  • Использование Bower?

    pm_wanderer
    @pm_wanderer
    junior-HTML
    Лучше npm. Он давно существует и уже проверен временем.
    Bower всегда был пятым колесом для телеги, который активно пиарили, пиарили, да не выпиарили ))
    Ответ написан
    4 комментария
  • Только локальный gulp?

    pm_wanderer
    @pm_wanderer
    junior-HTML
    Вроде как нет.
    Глобальный нужен чтобы в консоли его запустить, типа gulp watch, run или build
    Ответ написан
    Комментировать
  • Что значит эта функция?

    pm_wanderer
    @pm_wanderer
    junior-HTML
    Это анонимная самоисполняющаяся функция. Сначала мы описываем аргумент, который она принимает (может быть любое имя, например context, global или window как тут), а внизу уже передается сам объект, который можно затем использовать внутри функции под тем именем, что мы указали в первых скобках.
    Ответ написан
    Комментировать
  • Как лучше решить задачу на поиск ближайшего числа?

    pm_wanderer
    @pm_wanderer Автор вопроса
    junior-HTML
    Вот решение, которое я нашел (если кому понадобится в будущем):

    /**
         * @param {Array} settings.arr
         * @param {Number} settings.valueToFind
         * @param {Function} settings.comparator
         *
         * @returns {Number|undefined}
         */
        function findClosest(settings) {
    
          var lo                 = -Infinity,
                hi                 = Infinity,
                arr                = settings.arr,
                valueToFind = settings.valueToFind,
                comparator  = settings.comparator,
                result;
    
            for (var i = 0; i < arr.length; i++) {
    
                if (arr[i] <= valueToFind && arr[i] >= lo) {
                    lo = arr[i];
                    continue;
                }
    
                if (arr[i] >= valueToFind && arr[i] <= hi) {
                    hi = arr[i];
                }
            }
    
            result = comparator(lo, hi, valueToFind);
    
            return isFinite(result) ? result : undefined; // or false
        }


    Вот так выглядит объект settings c четырьмя возможными компараторами:

    var comparator1 = function(lo, hi, valueToFind) {
            return lo; // or hi
    };
    
    var comparator2 = function(lo, hi, valueToFind) {
            var result = lo; // or hi
    
            switch (true) {
                case valueToFind - lo < hi - valueToFind:
                    result = lo;
                    break;
                case valueToFind - lo > hi - valueToFind:
                    result = hi;
                    break;
            }
    
            return result;
    };
     
    var settings = {
            arr: [1, 5, 10, 8, 5, 13],
            valueToFind: 7,
            comparator: comparator2
    };


    И сам вызов функции:

    alert(findClosest(settings));

    PS:
    Вместо false, в случае когда результат не определен, я решил возвращать undefined, так как это значение ближе по семантике.
    Ответ написан
    Комментировать
  • Как вызвать не анонимную функцию из аргумента?

    pm_wanderer
    @pm_wanderer
    junior-HTML
    Можно функциональным подходом решить:

    var fn = (function(arg){
        return function() {
            console.log(arg);
        }
    }('hello'));
    
    function queue(){
        arguments[0]();
    }
    
    queue(fn);


    Примерно то же самое можно сделать и через стандартный метод bind (почитать про него можно в сети)
    Ответ написан
    Комментировать
  • Возможно ли открыть Вк в iframe?

    pm_wanderer
    @pm_wanderer
    junior-HTML
    Насколько я помню, в заголовках http можно установить разрешение на открытие своего сайта через iframe. Многие ресурсы запрещают это, чтобы пресечь разнообразные мошеннические схемы.
    Ответ написан
    Комментировать