Задать вопрос
  • Как правильно прочитать каждую строчку данного кода?

    delphinpro
    @delphinpro Куратор тега JavaScript
    frontend developer
    Это так называемое универсальное определение модуля (UMD - Universal module definition)

    Note. Только это какой-то урезанный umd, здесь нет определения define.amd. Может быть amd и устарел, но тот же webpack при сборке в umd формат пишет полную шапку.

    Здесь определяется каким образом подключен модуль, и соответственно выполняется инициализация.

    Давайте разберем.

    Во-первых, использована анонимная самовызываемая функция. Здесь разжевывал, прочитайте, если не знаете.
    В нашем случае это

    ( function( global, factory ) {
    
    } )(
        typeof window !== "undefined" ? window : this,    // global
        function( window, noGlobal ) { /* код модуля */ } // factory
     );

    Анонимка принимает два параметра — глобальный объект (window) и функцию-фабрику. Фабрика является самим модулем, тот самый полезный код, ради которого написан модуль.

    Во-вторых, в теле анонимки проверяется метод подключения:

    // Если доступен объект module значит используется сборщик CommonJS
      if ( typeof module === "object" && typeof module.exports === "object" ) {
        // Если доступен document
        module.exports = global.document
          // То всё гуд, мы в браузере, нужно выполнить код модуля
          // и вернуть то, что он вернет
          ? factory( global /* это window */ , true )
          // Иначе возвращается функция, которая при необходимости выведет 
          // ошибку если при ее вызове не будет доступен document
          : function( w ) {
            if ( !w.document ) {
              throw new Error( "jQuery requires a window with a document" );
            }
            return factory( w );
          };
      // Модуль просто подключен через тег script
      } else {
        // Выполнить код модуля
        factory( global );
      }


    Это стандартный код. Часто он формируется автоматически (например при сборке модуля webpack'ом для дальнейшей публикации в npm). Вам достаточно в общих чертах понимать что он делает и всё — обеспечивает поддержку различных вариантов использования вашего модуля.
    Ответ написан
    Комментировать
  • Что означает (jQuery) после (function( $ )?

    delphinpro
    @delphinpro Куратор тега JavaScript
    frontend developer
    (function( ) {
    })();

    Вот эта конструкция называется "анонимная самовызываемая функция".

    То есть, тут два действия:
    Объявление анонимной функции
    function( ) {
    }

    и сразу ее вызов
    ()()
    Первые скобки это синтаксический приём для вызова анонимной функции. Есть и другие методы. Например
    +function(){}()
    Вторые скобки - это собственно вызов функции и при необходимости передача параметра (обычный вызов же)

    ()(jQuery) — в параметре передается jQuery

    function($){} — а тут этот параметр объявлен и используется

    (function($){})(jQuery) — итого, объявили анонимную функцию, и вызвали ее, передав параметром объект jQuery

    Например, доллар у вас используется другой библиотекой, пусть MooTools.
    Тогда вы запускаете jQuery в безконфликтном режиме

    jQuery.noConflict();

    Это значит, что доллар использоваться не будет, и объект будет доступен только по ссылке jQuery.

    Но для удобства вы можете использовать анонимную функцию и безопасно использовать внутри неё переменную доллара

    (function($){
      $('.slider').slick();
    })(jQuery);


    Чтобы стало совсем понятно, конструкцию можно переписать без анонимной функции

    var myFunc = function($){
     // some code
    }
    
    myFunc(jQuery);
    Ответ написан
    Комментировать
  • Как запретить айфону выделять цифры как номер телефона(делать их ссылкой)?

    @suhannov
    <meta name="format-detection" content="telephone=no" />

    это отключает ненужное преобразование
    Ответ написан
    Комментировать
  • В чем разница между css-loader vs style-loader?

    @Miozzz
    css-loader - преобразовывает CSS - в модуль JavaScript.
    (Входные данные: CSS, Выходные данные: JavaScript)
    style-loader - внедряет CSS, экспортируемый модулем JavaScript, в тег
    Ответ написан
    Комментировать
  • В чем разница между css-loader vs style-loader?

    rockon404
    @rockon404
    Frontend Developer
    css-loader интерпритирует @import и url() в импортированном в проект css коде как import/require() и разрешает их.
    style-loader помещает css в DOM.
    Ответ написан
    1 комментарий
  • Почему Google ругается сам на себя в Google PageSpeed Insights по поводу шрифтов?

    @TheNYT
    Скажу вам честно, гугловский спидтест иногда такой маразм выдает, что на 100% практически любой сайт невозможно оптимизировать. Главное, чтобы вас устраивало время загрузки. Вспомните принцип Парето 20/80. Проверьте еще другими оптимизаторами, исправьте те ошибки, которые съедают больше всего скорости, это такие как не оптимизированные картинки, не сжатые css и прочее. Когда останутся задания "для перфекционистов", чтобы все было идеально, то знайте, что как-то значительно повысить скорость загрузки не удастся, а вот времени вы убьете на это с лихвой.
    Ответ написан
    1 комментарий
  • В чем практические отличия null от undefined?

    kondrackii
    @kondrackii
    1 + 1 = 11
    Если вкратце, то:
    null - ожидаемая пустота
    undefined - неожиданная пустота
    Ответ написан
    Комментировать
  • Как отработать клик вне блока?

    sharpfellow
    @sharpfellow
    Front
    VanillaJs
    function onClickClose(elem) { // вызвать в момент показа окна, где elem - окно
        function outsideClickListener(event) {
            if (!elem.contains(event.target) && isVisible(elem)) {  // проверяем, что клик не по элементу и элемент виден
                 elem.style.display = 'none'; //скрыть
                 document.removeEventListener('click', outsideClickListener);
            }
        }
        document.addEventListener('click', outsideClickListener)
    }
    function isVisible(elem) { //открыто ли условное окно
       return !!elem && !!( elem.offsetWidth || elem.offsetHeight || elem.getClientRects().length );
    }
    Ответ написан
    Комментировать
  • Что такое такое rest api?

    @eandr_67
    web-программист (*AMP, Go, JavaScript, вёрстка).
    API социальных сетей - это вполне типичные примеры реализации REST API.

    REST (RESTful) - это общие принципы организации взаимодействия приложения/сайта с сервером посредством протокола HTTP. Особенность REST в том, что сервер не запоминает состояние пользователя между запросами - в каждом запросе передаётся информация, идентифицирующая пользователя (например, token, полученный через OAuth-авторизацию) и все параметры, необходимые для выполнения операции.

    Всё взаимодействие с сервером сводится к 4 операциям (4 - это необходимый и достаточный минимум, в конкретной реализации типов операций может быть больше):
    1. получение данных с сервера (обычно в формате JSON, или XML)
    2. добавление новых данных на сервер
    3. модификация существующих данных на сервере
    4. удаление данных на сервере

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

    Для каждого типа операции используется свой метод HTTP-запроса:
    1. получение - GET
    2. добавление - POST
    3. модификация - PUT
    4. удаление - DELETE

    Т.е. :

    GET-запрос /rest/users - получение информации о всех пользователях
    GET-запрос /rest/users/125 - получение информации о пользователе с id=125
    POST-запрос /rest/users - добавление нового пользователя
    PUT-запрос /rest/users/125 - изменение информации о пользователе с id=125
    DELETE-запрос /rest/users/125 - удаление пользователя с id=125
    Ответ написан
    20 комментариев
  • Каковы механизмы защиты платных плагинов в WordPress?

    OtshelnikFm
    @OtshelnikFm Куратор тега WordPress
    Обо мне расскажет yawncato.com
    php не защитить. Припарки типа IonCube уже отмирают т.к. тот еще гемор для клиента. И его использование сразу так значительную долю потенциальных покупателей отсеивает. т.к. не каждый клиент будет париться с ним.

    Вордпресс к защите никакого отношения не имеет. Защищают с помощью js и php. Психи каждый раз сверяют по крону лицензию и срок. Это, скажем так, не лучшим образом отражается на производительности сайта. Хранят части важного кода у себя, а при успешной сверке ключа - подгружают его в память, выполняют и удаляют... Это жесть какая-то.

    Ты когда видишь такое - думаешь - "и я за это деньги заплатил? Чтобы быть под прицелом? А ведь подобное, с загрузкой недостающего кода в мою систему с стороннего домена - дыра в безопасности."

    Лицензия на домен - чисто формальность. Но юридически, обход её - может быть основанием для обращения в надлежащие органы. т.к. могут поймать не на GPL3, а на изображениях, использование товарного знака, pdf и тексте - что не входит в GPL лицензию.

    Безлимит для разработчика - чисто формальность. Но вроде бы как это норма поведения и чести для хороших разрабов делающие массовый продукт. Так они не оскверняют свое имя - просто заплатили за анлим и дальше разрабатывают.
    Хорошая традиция - мы покупаем не текущий продукт, а вкладываемся в долгосрочную перспективу: обновления, закрывающие уязвимости, техподдержку - на случай нештатной ситуации. Это если вы делаете сайт серьезный, с долгой линией жизни.
    Ответ написан
    Комментировать
  • Стоит ли уходить с разработки WordPress?

    OtshelnikFm
    @OtshelnikFm Куратор тега WordPress
    Обо мне расскажет yawncato.com
    Уходите.

    А вообще как один этап развития в фрилансе (в частности в вордпресс) - это уход от фриланса как такового в сторону пассивного дохода: блогеры, курсы, менторство, премиум решения (уход на энвато, кодеселлер в рунете).
    Уход вообще из рунета. Но скиллы вы понимаете какие там должны быть?

    Ну или развитие своей площадки - многие авторы не продают на чужих площадках свои решения, а делают это через свои сайты. Но тут придется решить множество вопросов:
    - это ИП или иное оформление. Но выйти из тени придется.
    - прием платежей на своем сайте
    - создание своей ТП
    - магазина
    - решить вопрос с лецинзированием и ключами для своих премиум решений (защищать придется вам), их обновлением
    - продумать систему продаж. Маркетинг.

    Мне не интересен фриланс как таковой, а вот разрабатывать премиум решения - это удовольствие. Конечно еще работы много предстоит - но я думаю это хорошее направление. Тут ты сам себе заказчик.

    В фрилансе перегорают почему? Потому что надо искать заказ, снова общаться с заказчиками (жрать хочется - поэтому многие за сложных клиентов борются) узнавая т.з. (а иногда выбивая т.з.) - это психологически сложно. Это иногда долго по времени и вот только потом начинаешь работать. Хорошо если проект не стандартный, а если типовой сайт/магазин/элементор (материться нельзя) - это тоска. И ты понимаешь что живешь день за днем как в дне сурка. Дне. Дно... Всё - мотивация ушла, депрессняк.

    Поэтому бросайте заниматься ерундой - и если скиллы есть - ищите уникальную нишу. Рынок переполнен типовыми исполнителями - докажите что вы круче. А для этого вы должны выделяться и в вас должно быть что-то что выделяет вас выгодно от других.
    Ответ написан
    3 комментария
  • Что написать для тренировки на js с нуля?

    shmatuan
    @shmatuan
    8 year of Web, 5 years of Vue
    Из того, что часто может пригодится в вебе

    • Паралакс
    • слайдер
    • генерацию таблиц из js
    • сортировку таблиц
    • общение с сервером
    • Плеер (аудио/видео)
    • Работа со временем (momentjs)
    • Подгрузка постов при скроле
    • Движение блоков при скроле
    • Пагинация
    • Модалка
    • Взаимодействие с изображениями (фильтр, обрезка, ...)
    • Кастомные селекты, датапикеры
    • Табы


    + можешь поискать топ сайтов и попробовать повторить интересные штуки из них
    + jQuery
    + фрейморки, например Vue
    + node js
    Ответ написан
    Комментировать
  • Верстка еще актуальна на фрилансе?

    xmoonlight
    @xmoonlight
    https://sitecoder.blogspot.com
    Вёрстка вёрстке - рознь!
    Чтобы иметь возможность получать хорошие заказы при большой конкуренции, нужно иметь 4-5 валидно свёрстанных и действующих/"живых" шаблонов для разных типов сайтов с достаточно сложными элементами наполнения.
    Верстать - могут все, верстать качественно - единицы!
    Хотите верстать профессионально и за достойную оплату - изучайте и нарабатывайте опыт.
    PS: Проверять можно по этому списку.
    Ответ написан
    Комментировать
  • Откуда берутся мертвые заказы на фрилансе?

    customtema
    @customtema
    arint.ru
    Подавляющее большинство - придурки и фантазеры. Сидят и пузо чешут "вот я щаз сделаю свой фейсбук... $50 у меня есть, надо фрилансера найти", идут дают объявление, а дальше дело редко заходит.

    У нас вчера был случай. Неделю переписываемся с клиентом - девушкой. Вчера прислала мужа на переговоры. Муж посидел минут 10, вообще ничего не понял и спешно убежал. Через полчаса девушка пишет "Извините, в ваших услугах не нуждаемся". Спрашиваю "Почему?", отвечает "Потому что вы ничего внятного не объяснили".

    Хотя с ней план действий согласовали от и до, показали красивое портфолио и (по рекомендации) предложили пакет услуг без предоплаты на условиях "если не сработает - вы не платите".

    То есть ну полный идиотизм. Это часто происходит. И, к сожалению, это нормально.

    Вот им в частности студия не помогла, и сейчас они пойдут фрилансеров искать. Этих фрилансеров заведомо жалко - заказчик не то, чтобы не компетентен, но по сути даже неадекватен.
    Ответ написан
    Комментировать
  • БЭМ: небольшая стилизация без модификатора?

    fruity4pie
    @fruity4pie
    A
    Насколько мне известно, то у элемента не может быть другой элемент:

    navigation__menu - элемент, navigation__menu-item - элемент внутри элемента??
    navigation__menu-item-link - это что ???

    Элемент - это часть блока, но никак не часть другого элемента.
    Из БЭМА:

    Модификатор

    Cущность, определяющая внешний вид, состояние или поведение блока либо элемента.

    Особенности:

    Название модификатора характеризует внешний вид («какой размер?», «какая тема?» и т. п. — «размер»: size_s, «тема»: theme_islands), состояние («чем отличается от прочих?» — «отключен»: disabled, «фокусированный»: focused) и поведение («как ведет себя?», «как взаимодействует с пользователем?» — «направление»: directions_left-top).

    Имя модификатора отделяется от имени блока или элемента одним подчеркиванием (_).

    Тут уже Вам решать, нужен ли Вам модификатор или нет. Как правило, модификаторы нужны для стилизации повторно-использующихся на странице элементов.
    Ответ написан
    5 комментариев
  • Как сделать такую анимацию css?

    sfi0zy
    @sfi0zy Куратор тега CSS
    Creative frontend developer
    На чистом CSS такое делать слишком долго. Проще взять связку SVG+JS. Рисуете для каждой точки path - путь, по которому она двигается, а затем на JS ее двигаете по этому пути. Есть много готовых решений, например вот простое демо на чистом JS, да и в библиотеках вроде anime.js есть такая функция.
    Ответ написан
    Комментировать
  • Пример хорошего ТЗ/гайдлайна для вёрстки?

    xmoonlight
    @xmoonlight
    https://sitecoder.blogspot.com
    Основные требования: здесь
    Примеры стайл-гайдов: здесь

    1. Требования к вёрстке: здесь, здесь, здесь, здесь
    2. Как проверять качество вёрстки: здесь.
    3. Как определять стоимость (трудозатраты) вёрстки одной унифицированной страницы: здесь.
    4. Требования к дизайнеру: здесь и здесь.
    5. Пример документации (генератор шаблона, Helix3 для CMS Joomla!): здесь
    6. Готовые "скелеты" шаблонов HTML5 для начала вёрстки: простой (с поясняющими комментариями), www.initializr.com (ещё 3 простых) и максимально полный html5boilerplate.com.
    7. Вопросы на вакансию верстальщика (front-end developer): здесь

    Бонус по-теме: Turning Design Mockups Into Code With Deep Learning
    Ответ написан
    3 комментария
  • Как в основном используют JavaScript в обычных сайтах?

    razumkov2015
    @razumkov2015
    "Программист" https://vk.com/cgs_game
    Дело в том, что сейчас большинство разработчиков используют готовые библиотеки. Они их скачивают целиком для какой то 1 цели, которую можно сделать и без них. Этих библиотек чаще всего, скачивают много. Людям хочется сделать все быстро и просто, их не волнует объем хлама на сайте. Wordpress для меня, это вообще навозная куча.
    Ответ написан
    6 комментариев