• Как подключить разные файлы js к разным html файлам?

    smilingcheater
    @smilingcheater
    Объявите в вебпаке по отдельному entry для каждой страницы
    https://webpack.js.org/concepts/entry-points/
    Вебпак будет собирать несколько бандлов. Подключайте в страницах соответствующие им бандлы.
    Так же рекомендую настроить генерацию общего чанка, чтобы общие части JS не дублировались в бандлах, а попадали в один общий.
    https://webpack.js.org/configuration/optimization/...
    https://webpack.js.org/plugins/split-chunks-plugin/
    Ответ написан
    1 комментарий
  • Как в gulp выбрать файлы по вхождению символов в имени файла?

    @yakupov112
    gulp.task('watch',  function() {
    	gulp.watch('folder/**/prefix__*.js', browserSync.reload);
    });
    Ответ написан
    Комментировать
  • Смена языка на странице?

    AlekseyNemiro
    @AlekseyNemiro
    full-stack developer
    А что, хорошая идея, локализовать сайты одними только HTML и CSS!

    Зачем нужны все эти JavaScript, PHP, ASP .NET, Perl, Python, Ruby и прочая непонятная белиберда. Это все прошлый век, будущее за HTML и CSS!

    Скоро не только сайты будут делаться одними только HTML и CSS, но и приложения для компьютеров, телефонов и даже холодильников. Популярные операционные системы в будущем будут переписаны на HTML и CSS. Детям в школах вместо русского языка и литературы будут преподавать HTML и CSS. Да что там, нефть будут обменивать на код HTML и CSS!

    Бред конечно, но это все возможно, вот пример (кликать по толстому тексту):
    jsfiddle.net/alekseynemiro/fzxLz35p

    Хотя почему бред? (не про нефть, конечно) Думаю, для мелких статичных проектов, вкупе с LESS или SCSS (для удобства) вполне можно использовать такой странный способ. Можно еще проще - скрывать блоки, но объем данных на странице будет больше. Псевдоклассу :target может быть найдется применение для решения проблемы передачи языка через адресную строку. Нужно подумать, но идея безумная :-) Применение, как минимум, JavaScript существенно упростит решение.
    Ответ написан
    Комментировать
  • Не могу запустить сборку через webpack. Что не так?

    @SiegfriedDelap
    Привет! Попробуй в файле package.json в строке "browserslist" оставить только ">1%". В моей ситуации помогло)
    Ответ написан
    2 комментария
  • Программирования учат или применяют?

    Newto
    @Newto
    Добрый день. Я перечитал все ответы выше, а так же комментарии к ним. Решил прокомментировать, с точки зрения своего опыта(я занимаюсь разработкой уже более 15-ти лет). Для удобства чтения я буду писать по пунктам.

    1) Зубрёжка. Каждого из нас, кто ходил в школу, заставляли зубрить таблицу умножения. И, в конце-концов, это помогало в последующем обучении математики, не правда ли? В программировании есть такие же вещи, которые называются "стандарты". Вот эти стандарты и нужно, для начала, зазубрить. А позже и вникнуть, зачем они придуманы.

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

    3) Платные курсы. Курсы ныне очень разные. Кто-то просто, простите, гребёт бабло на этом всём. А кто-то преподаёт с душой, хорошо и понятно рассказывая. Поэтому платный курс -- это хорошо, но только тогда, простите за тавтологию, когда это хороший курс. Читайте отзывы о курсе, советуйтесь с теми кто его уже прошёл(в идеале) и тогда уже решайте, тот ли этот курс, что даст вам необходимые знания.

    4) ВУЗ. Более 10-ти лет назад, у меня в подчинении, в вебстудии, работал PHP джун. Он доучивался в МГТУ имени Баумана. И он не знал ничего. Совсем. Мне приходилось объяснять ему простейшие вещи, типа что значит иструкция "$a += $b;". Сам же я учился в ВУЗе малоизвестном, на факультете "прикладная информатика в экономике" и наш преподаватель информатики, на первом курсе, на вопрос что значит в коде программы на языке C++ инструкция "с++" ответил, что это "так язык называется". Однако, вскоре ко мне начали ходить сокурсники, с просьбами "а напиши программку". И происходило это потому что я сам загорелся программированием, купил книжки, установил всё что нужно было установить на компьютер и начал "творить волшебство", как это мне тогда виделось, с горящими глазами. Короче говоря не нас учат ВУЗы, а мы учимся в ВУЗах или учимся без них. Тут уж как пойдёт.

    5) Ну и последний, самый важный, с моей точки зрения, пункт. Это Интерес. Если вам интересно программирование, вам нравится разбираться, что-то делать самостоятельно, а не только тогда когда кто-то поставил задачу, то у вас все получится. И как именно это всё учить у вас вопроса, в конце концов, не возникнет. Разбирайтесь, ковыряйте, вникайте и всё будет. Единственное что -- очень желательно, что бы перед вашими глазами были хорошие примеры. Потому что я, в свое время, тоже разбирался, учился и вникал, "гладили по голове", как писали выше в комментариях к одному из ответов, меня уже мои наниматели, потому что я все делал быстро и без ошибок, т.е. работало все так, как было нужно клиентам веб-студии, собеседование в которую я тогда прошел без каких-то проблем. Но вот мой код тогда был, откровенно говоря, тем, что сейчас называется "говнокодом". Потому что некому было мне показать как писать есть хорошо, а как есть плохо.

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

    @ProgerMir
    Согласен с Геннадий Геннадий , вы не подключили файл стилей в head <link rel="stylesheet" href="style.css">
    У автора того видео он подключен.

    Дополнил бы еще, что удобнее, по-моему мнению, писать общий font-size в процентах, который равен 62.5%. И далее прописывать его в rem. Удобно тем, что браузер приведет значение font-size к 10 пикселям, а в ремы переводить будет легче. Пример - понадобится посчитать размер шрифта для определенного абзаца в 16px - это 1.6rem.
    Ответ написан
    Комментировать
  • Как настроить автоширину слайдов с Swiper Js?

    @Anonimmus
    Юзай slidesPerView: 'auto', и в css задавай ширину блоков, слайдер автоматически подстроится под размеры
    <!-- Swiper -->
            <div class="swiper-container">
                <div class="swiper-wrapper">
    
                    <div class="swiper-slide infoPost">
                        <div class="infoText">
                            <h2>Коллекция авторских коробок</h2>
                            <p>Бесплатная доставка по городу Воронеж от 2000 рублей</p>
                            <a href="">Купить</a>
                        </div>
                    </div>
    
                    <div class="swiper-slide imgPost1"> </div>
    
    
    
                    <div class="swiper-slide infoPost">
                     <div class="infoText">
                        <h2>Коллекция авторских коробок</h2>
                        <p>Бесплатная доставка за город от 3999 рублей</p>
                        <a href="">Купить</a>
                    </div>
                </div>
    
                <div class="swiper-slide imgPost2"> </div>
    
    
    
    
                
            <div class="swiper-slide infoPost">
                 <div class="infoText">
                    <h2>Коллекция авторских коробок</h2>
                    <p>Бесплатная доставка по городу от 1700 рублей</p>
                    <a href="">Купить</a>
                </div>
            </div>
    
            <div class="swiper-slide imgPost3"> </div>
    
    
        </div>
        <!-- Add Arrows -->
        <div class="btns">
            <div class="swiper-button-next"></div>
            <div class="swiper-button-prev"></div>
        </div>
        <!-- Add Pagination -->
        <div class="swiper-pagination"></div>
    </div>
    
    <script src="js/slider.js"></script>

    var swiper = new Swiper('.swiper-container', {
          slidesPerView: 2,
          spaceBetween: 0,
          // init: false,
         loop: true,
         slidesPerGroup: 2,
      
        autoplay: {
            delay: 7000,
            disableOnInteraction: false
        },
          navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev',
          },
           pagination: {
            el: '.swiper-pagination',
            clickable: true,
          },
          breakpoints: {
            300: {
       <b>       slidesPerView: 'auto',</b> 
              spaceBetween: 0,
            },
            768: {
              slidesPerView: 'auto',
              spaceBetween: 0,
            },
            1024: {
              slidesPerView: 'auto',
              spaceBetween: 0,
            },
    
          }
        });


    .infoPost {
      width: 1165px;
      height: auto;
      margin-left: -150px;
      background: url("../img/bac-slider.png") no-repeat;
      mix-blend-mode: multiply;
      background-position: top center;
    }
    
    .imgPost1 {
      width: 750px;
    }
    
    .imgPost2 {
      width: 750px;
    }
    
    .imgPost3 {
      width: 750px;
    }
    Ответ написан
    2 комментария
  • В чём отличие & nbsp от обычного пробела?

    DirecTwiX
    @DirecTwiX
    "display: flex;" уже предлагали?
    Основное предназначение неразрывного пробела - запрет переноса следующего за ним слова/символа на новую строку.
    Т.е. при выводе, например, "Товар& nbsp#1" не получится такого, что "Товар" окажется на одной строке, а "#1" - на следующей.
    Ответ написан
    Комментировать
  • Как используя addEventListener передать параметр в функцию?

    @uroot
    Немного дополню спустя 3 года... В ES6 можно так:

    element.addEventListener('click', () => someFunk(param))
    Ответ написан
    7 комментариев