• Gulp - как подключить bootstrap и jquery плагины?

    юзай бутстрап 4, он использует sass
    в нем есть файл bootstrap.sass в который импортируются компоненты, коментиш не нужные, оставляешь сетку.
    У меня для каждого блока свой sass файл и они импортируются в style.sass(структура как в bootstrap.sass), туда же импортируется сам бутстрап и стили библиотек. В галп sass подключается один главный файл, а watch отслеживает все.

    /*!
     * Bootstrap v4.0.0-alpha.2 (http://getbootstrap.com)
     * Copyright 2011-2015 Twitter, Inc.
     * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
     */
    
    // Core variables and mixins
    @import "scss/variables";
    @import "scss/mixins";
    
    // Reset and dependencies
    @import "scss/normalize";
    @import "scss/print";
    
    // Core CSS
    @import "scss/reboot";
    @import "scss/type";
    @import "scss/images";
    @import "scss/grid";
    @import "scss/tables";
    @import "scss/forms";
    @import "scss/buttons";
    
    // Components
    @import "scss/animation";
    @import "scss/nav";
    @import "scss/navbar";
    @import "scss/dropdown";
    @import "scss/breadcrumb";
    @import "scss/pagination";
    @import "scss/pager";
    @import "scss/alert";
    @import "scss/progress";
    @import "scss/responsive-embed";
    @import "scss/close";
    @import "scss/list-group";
    
    // Components w/ JavaScript
    @import "scss/modal";
    @import "scss/tooltip";
    
    // Utility classes
    @import "scss/utilities";
    @import "scss/utilities-background";
    @import "scss/utilities-spacing";
    @import "scss/utilities-responsive";


    js-ки сначала углифицируются, потом конкатятся в 1 файл.
    Ответ написан
    4 комментария
  • Правильный frontend?

    webdisigner
    @webdisigner
    Сначала поработай с нативным css,html,js - 1 годик так точно
    Потом поработай с bootstrap, сначала научись переопределять стили, потом изменять стили в исходном файле bootstrap.css. После этого научись пользоваться файлами bootstrap.js ну и конечно тут не обойтись без фундаментальных знаний Jquery - 15-30 дней и ты уже в теме
    Потом установи sass, и поработай с ним через командную строку
    Потом попробуй расширить sass, например установи susy, breakpoint-sass
    Опять поработай с командной строкой - 14-30 дней
    Потом установи интерпритатор sass, например compass
    Разузнай все тут, поработай с командной строкой, установи config для compass`a
    7-10 дней на это все, многое узнаешь.. - 2 дня макс.
    ->
    Потом чтобы это все говно сжать у себя в мозгу как раз придумали gulp
    Вот с этих пор, ты познаешь истинное удовольствие с gulp`ом
    Тут то и понадобятся навыки работы с консолькой
    Понимание глобального и локального нахождения плагинов и не только
    Установишь node.js, выберешь себе консольку по-красивее и по-краше, прочитаешь туториалы, просмотрешь видосы и ты уже спец по gulp - 12-15 дней макс

    материал:
    1) sass - sass-lang.com
    2) sass-playground: www.sassmeister.com (поддерживает susy,breakpoint-sass)
    3) susy - susy.oddbird.net (любые сетки, полный контроль)
    4) bootstrap - dedushka.org (неплохие уроки по css), www.w3schools.com/bootstrap/default.asp (неплохие уроки по css и js бутстрапа)
    5) gulp - https://www.youtube.com/watch?v=9zwwmjGz1Vs&list=P... (неплохие уроки по gulp)

    Ты все еще хочешь стать фронтенщиком? :)
    Ответ написан
    5 комментариев
  • Правильный frontend?

    zualex
    @zualex
    Senior Software Engineer
    Вот есть мой репозиторий - это готовый шаблон для адаптивной верстки. Как раз там все прелести используются (git, gulp, sass, autoprefixer)
    Имеется пример.
    Так же рекомендую к прочтению Руководство по написанию Sass
    Ответ написан
    3 комментария
  • Почему сетка bootstrap в процентах?

    cyber-jet
    @cyber-jet
    % для "резинки", очевидно же, что вас смущает?
    Ответ написан
    6 комментариев
  • $$$ что значит в php?

    alexey-m-ukolov
    @alexey-m-ukolov Куратор тега PHP
    Это называется переменная с переменным именем (variable variable).

    class Foo {
      public $deepest = 'Limbo';
      
      public function __toString()
      {
        return 'deep';
      }
    }
    
    $deeper = 'deepest';
    $deep = 'deeper';
    $b = new Foo();
    
    echo $b->$$$b;


    Выражение выполняется справа налево:
    1. $b->$$($b) превращается в $b->$$($b->__toString()), поскольку именно так ведут себя объекты, когда на них пытаются натравить echo;
    2. $b->$$($b->__toString()) превращается в $b->$(${'deep'}), именно это значение возвращает метод __toString класса Foo, инстансом которого является $b;
    3. $b->$(${'deep'}) превращается в $b->$($deep), это как раз вызов переменной при помощи значения из другой переменной;
    4. $b->$($deep) превращается в $b->${'deeper'}, поскольку именно такое значение находится в переменной $deep;
    5. $b->${'deeper'} превращается в $b->($deeper);
    6. $b->($deeper) превращается в $b->deepest;
    7. наконец, получается значение свойства 'deepest' из $b, а там как раз хранится 'Limbo', оно и выводится в echo.

    dd178a12658f41679b71884846669132.jpg
    Ответ написан
    8 комментариев
  • Как в запросе AJAX делать подзапрос?

    alexey-m-ukolov
    @alexey-m-ukolov Куратор тега JavaScript
    Вам нужно прочитать про то, что ajax-запросы выполняются асинхронно.
    В вашем случае, на момент формирования переменной info ни один запрос еще скорее всего не выполнился.
    Конкретно в вашем случае есть два пути:
    1. Плохой: Сделать запросы синхронными
    2. Великолепный: Использовать промисы, они именно для таких вещей и предназначены.

    Вот пример, скорее всего в нем есть какие-то ошибки, поскольку без бэкенда его сложно дебажить и я совсем этим не занимался, но, надеюсь, вы разберетесь.
    P.S. Я упростил ваш html и не разбирался с this, который там используется.
    Ответ написан
    3 комментария
  • Почему последнее свойство CSS перекрывается :nth-child?

    andykov
    @andykov
    Shit happens
    Последнее правило не самое главное, есть еще понятие специфичности селекторов, почитайте.
    border none сработает только если специфичность одинаковая.

    Если убрать nth-child(1) - то border:none заработает.

    Обманываете.
    Ответ написан
    1 комментарий
  • Синтаксис шрифта?

    agmegadeth
    @agmegadeth
    Веб-разработчик в дизайн студии
    300 - жирность
    35px/52px - размер шрифта / line-height(высота строки)
    Ответ написан
    Комментировать
  • Как правильно расположить данные в базе данных mysql?

    @djay
    Почитай про нормализацию данных. В текущей задаче - это One-to-Many Relationships
    Сериализация в данном случае не верный подход, потому что:

    1. Сводит возможность поиска практически к нулю.
    2. Ухудшает производеленость, поскольку если понадобится хотя бы одна запись (цена например), то тогда придется парсить весь сериализованный текст.

    А так в целом, если у одного товара может быть несколько цен (теоритически - да хоть тысяча цен - не важно), то всё это должно хранится в отдельной таблице. И выбиратся джоином как One-to-Many Relationship.
    Ответ написан
    Комментировать
  • Как правильно расположить данные в базе данных mysql?

    @skvot
    Если я Вас правильно понял, то у вас обычная связь многие-ко-многим?

    product
    --------
    id | name

    price
    ------
    id | value

    product_to_price
    -------------------------
    product_id | price_id


    Хотя я бы просто сделал таблицу цен

    price
    ---------------
    id | product_id | value
    Ответ написан
    2 комментария
  • Как написать условие?

    if(time() + (3600*3) >= $altt['time']){
      // passed 3 and more hours
    }
    Ответ написан
    5 комментариев
  • Как убрать непонятный отступ сверху изображения?

    к #photo-wrap поставьте font-size: 0;
    у вас картинка имеет некоторые характеристики строчного элемента ( display: inline-block;)
    Поэтому нужно их "обнулить"
    Ответ написан
    6 комментариев
  • Mail.ru + php форма обратной связи. Почему не приходят письма?

    rizhenkov
    @rizhenkov
    Веб-программист
    Почта Mail.ru считает, что у них настолько крутой антиспам фильтр, что может позволить себе "выкидывать" некоторые письма мимо папки "Спам" и мимо "Корзины".
    Вы можете попробовать побороться с их саппортом, а когда надоест, подключите pdd.yandex.ru и отправляйте письма через smtp. (Вот отличный класс: PhpMailer - берите оттуда 2 файлика class.phpmailer.php и class.smtp.php).
    Можете сделать удобную обёртку для него, типа:
    class Mail {
        public static function send($email, $subject, $html, $text)
        {
            $mail = new PHPMailer;
    
            $mail->isSMTP();
            $mail->Host = 'smtp.yandex.ru';
            $mail->SMTPAuth = true;
            $mail->Username = 'user@domain.tld';                 // SMTP username
            $mail->Password = 'myBestP4ssw0rd';  // SMTP password
            $mail->SMTPSecure = 'ssl';                            // Enable TLS encryption, `ssl` also accepted
            $mail->Port = 465;                                      // TCP port to connect to
    
            $mail->CharSet = "UTF-8";
    
            $mail->From = 'user@domain.tld';
            $mail->FromName = 'My Project';
            $mail->addAddress($email);     // Add a recipient
            $mail->addReplyTo('support@domain.tld', 'My Project Support');
    
            $mail->isHTML(true);                                  // Set email format to HTML
    
            $mail->Subject = $subject;
            $mail->Body    = $html;
            $mail->AltBody = strip_tags($text);
    
            if(!$mail->send()) {
                return false;
                // $mail->ErrorInfo;
            } else {
                return true;
            }
        }
    }


    Ну и не забудьте подключить для вашего домена DKIM и SPF записи.
    Теперь ваши письма никогда не попадут в спам!

    P.s. Да, в соседнем ответе посоветовали mandrill.
    Объясняю, чем он хуже.
    Например, на gmail через яндекс.smtp письма приходят почти моментально. Через smtp mandrill они идут секунд 20-30, а иногда и минуту.
    Кроме того, mandrill преобразовывает все ссылки в письме и переадресовывает через свой трекер. В то время, как яндекс - это просто почта без всяких понтов и параноидального слежения.
    В общем, уведомления - яндекс.
    Массовые рассылки - mandrill.

    Upd (спустя 3 года):
    Вижу, что мой ответ отметили решением, поэтому хочу пояснить, что ответ устарел.

    В настоящий момент smtp от Яндекса вижу как не самое лучшее решение по двум причинам:
    1. У Яндекс PDD есть ограничение (и оно очень маленькое) на отправку писем в час и в сутки. Причём подробности этих ограничений вы не найдёте (публичная информация о лимитах не соответствует действительности; я сталкивался с ошибками отправки уже после 50 писем в час). Поэтому для нормальных массовых проектов эта почта не подходит. Только для хобби-проектов с невысокой активностью.
    2. В целом у SMTP-протокола есть ограничения (он медленный).

    Для себя лучший вариант я нашёл в виде Amazon SES. Это такой шлюз отправки писем именно для уведомлений. Отправлять можно как через SMTP, так и через API. Причём у вас будут очень высокие пределы прежде чем с вас Amazon начнёт брать деньги (или это будут копейки). Недостаток SES в том, что для вывода домена в продакшен нужно будет написать в поддержку, объясняя зачем и как ты собираешься его использовать.
    Ответ написан
    Комментировать
  • Проблемы с версткой в webkit-браузерах: нестандартное наложение блоков. Как исправить?

    IonDen
    @IonDen
    JavaScript developer. IonDen.com
    Поставьте z-index не подсказке, а блоку share-block.
    Поймите, z-index работает только, когда элементы находятся на одном уровне.
    Ответ написан
    1 комментарий
  • Как правильно понять этот сложный код?

    PretorDH
    @PretorDH
    HTML5, CSS3, PHP, JS - люблю в чистом виде.
    Учи матчасть...

    /* Функция асинхронной загрузки хеадера */
    function getHeader() {
      $.post('modules/constructor.php',     /* Аппелируем к серверному скрипту по указаному адресу */
          { 'action': "header", 'lang': lang },   /* Передаем параметры на сервер */
           function(data) {                            /* Callback - параметр анонимня функция. Вызывается при удачном запросе */
              $('div#header')                          /* Выбираем #header - но правильнее $('#header'), ибо 2 блока с одним id не правильно */
                 .empty().append(data);           /* Очищает выбраный блок и дописывает к нему полученные данные */
           	}
          ).done(function() {                         /* Событие выполняется после удачного выполнения запроса */
            getFooter()                                 /* Вызов запроса Fotter */
          })
    }
    
    /* далее аналогично но для footer */
     
    function getFooter() {
      $.post('modules/constructor.php',    
          { 'action': "footer", 'lang': lang },    
           function(data) {                            
              $('#footer').empty().append(data); 
           	}
          ).done(function() {
            getScriptHandF();              /* Здесь была синтаксическая ошибка: отсутствие замыкающего ";" */
            getContent(content)
          })
    }
    function getContent(cont) {
      $.post('modules/constructor.php', 
          { 'content': cont, 'lang': lang, 'device': devi },
           function(data) { 
              $('#content-wrapper').empty().append(data); 
           	}
          ).done(function() {
    
    /* Далее человек питался сделать прелоадинг картинок. НО! */
    /* Картинки уже начались загружатся после  выполнения
     колбеков из загрузок getContent, getHeader, getFoоter */
            var paths  = [];                  /* Готовим массив для прелоадинга картинок */
            var images = $('body').find('img');    /* Выбираем все картинки */
            images.each(function() {                  /* Пробегаемся по всем картинкам */
              paths.push($(this).attr('src'));          /* Записываем ссылку на картинку в масив */
            });
             
            preloadImages(paths, function () {   /* Вызывает preloadImages Описания процедуры нет */
              $("html,body").animate({"scrollTop":0},200);  /* Анимирует скроллинг если страница прокручена на верх страницы */
              $('#preload').fadeOut(1000);   /* Анимирует прозрачность кроющего блока #preload */
              getScript();                              /* Вызывает getScript */
              if (cont=="home") getSlider(); /* Вызывает getSlider если страница домашняя */
            });
          })
    }
    Ответ написан
    2 комментария
  • Как выполнить код, в зависимости от открытой вкладки в браузере?

    viktorvsk
    @viktorvsk
    В разных "вкладках" нужно генерировать разные формы.
    Или action формы менять, например, добавляя параметр action="register.php?action=new_user"
    Или добавить поле с type=hidden и туда дописывать определенный параметр
    Ответ написан
    Комментировать
  • API Yandex Maps 2.1 как получить координаты Placemark?

    Petroveg
    @Petroveg
    Миром правят маленькие с#@&ки
    mark.events.add('drag', function (e) {
    	console.log(mark.geometry.getCoordinates());
    });
    Ответ написан
    Комментировать
  • API Yandex Maps 2.1 как получить координаты Placemark?

    forgotten
    @forgotten
    Руководитель разработки API Яндекс.Карт
    mark.geometry.getCoordinates()
    Ответ написан
    5 комментариев
  • Яндекс карты как получить все точки маршрута?

    MAXOPKA
    @MAXOPKA Автор вопроса
    Разобрался.
    Маршрут -> Пути -> Сегменты -> Точки
    var all_points=[];
                    var paths=route.getPaths();
                    var i=0;
                    while(paths.get(i)!==null){
                        var p=paths.get(i);
                        var segments=p.getSegments();
                        $(segments).each(function(){
                            var pc=this.getCoordinates();
                            $(pc).each(function(){
                                all_points.push(this);
                            });
                        });
                        i++;
                    }
    Ответ написан
    Комментировать