• Калькулятор покрытия площади плиткой и бардюрами на Vue.js?

    shmatuan
    @shmatuan
    8 year of Web, 5 years of Vue
    1. Можно даже динамисески создавать все списки)
    https://ru.vuejs.org/v2/guide/forms.html#%D0%92%D1...

    2. Смотреть что что-то изменилось и пересчитывать всё
    https://ru.vuejs.org/v2/api/#watch
    p.s. Но лучше записать в computed, тогда будет само всё отслеживать

    Как пример:
    https://codepen.io/andreysh/pen/ZwXPOj
    Ответ написан
    6 комментариев
  • Как сделать, что бы header прогружался без дерганий?

    sfi0zy
    @sfi0zy Куратор тега CSS
    Creative frontend developer
    Скорее всего вам нужно выделить css для первого экрана и вставить его сразу в начале страницы в тег style. Это можно автоматизировать, есть разные инструменты, например вот этот. В любом случае стоит гуглить по запросу critical css.
    Ответ написан
    Комментировать
  • Почему не перерисовывается компонент?

    @dimoff66
    Кратко о себе: Я есть
    Потому что конструктор вызывается только при создании компонента, а не при его перерисовке. Вам не нужно в message переводить props в state, какой в этом смысл, если он все равно приходит от родителя и меняется в другом компоненте?

    При рендеринге просто пишите
    <p className="message__text">{this.props.text}</p>
    Ответ написан
    Комментировать
  • Почему не перерисовывается компонент?

    @curious-101
    Frontend developer
    Дмитрий всё верно написал. Добавлю лишь, что если по какой-то причине вам нужно держать text в state компонента Message, то для того, что бы он ререндерился после изменения пропсов изменяйте state в componentWillRecieveProps или можете добавить ключ этому компоненту:
    <Message 
    key={text}
    text={ text }
     />
    Ответ написан
    1 комментарий
  • Vue-router. Что за магия происходит?

    0xD34F
    @0xD34F Куратор тега Vue.js
    Предполагается, что когда пользователь нажмет на фильтр, у меня вызовется функция setRouter...

    Предположение неверное, вызов происходит в момент рендеринга фильтра - заведомо ДО того как пользователь по нему кликнет. То есть, в качестве роута фильтра устанавливается значение, которое после клика по фильтру окажется устаревшим - это и есть причина "запаздывания", о котором вы говорите.

    Вот так, никакой магии.
    Ответ написан
    3 комментария
  • Как сделать информирование о окончании foreach?

    profesor08
    @profesor08 Куратор тега PHP
    $arr = array(1, 2, 3, 4);
    foreach ($arr as &$value) {
        $value = $value * 2;
    }
    
    echo "end";
    Ответ написан
    Комментировать
  • Стоит ли изучать nuxt.js?

    kleinmaximus
    @kleinmaximus
    Senior Full-stack Javascript Developer
    Лучше использовать vue-cli-3 и плагин @vueneue/ssr.

    В предыдущих проектах использовал Vue Server Renderer, поскольку он более гибкий. В nuxt некоторые вещи сначала жизнь упрощают, а потом реально начинают ее портить. Взять даже тот самый хваленый роутинг на файлах. Я бы понял, если бы он поддерживал все возможности vue-router, но он реально практически все отрезает :( Можно, конечно, отключить это дело или вообще написать свой шаблон формирования роутинга для Nuxt, но зачем же тогда сам Nuxt?

    Дальше планирую пользоваться связкой vue-cli-3 + плагины (в т. ч. указанный выше).
    Ответ написан
    2 комментария
  • Где хранить файлы для работы?

    iiiBird
    @iiiBird Куратор тега Вёрстка
    Пока ты спишь - твой конкурент совершенствуется
    ну тк выведи psd из папки и храни. тогда и мешаться не будет

    project1
    ---->psd
    ---->Dev
    -------->css
    -------->js
    -------->img
    -------->index.html
    Ответ написан
    Комментировать
  • Для чего нужен Docker?

    @spotifi
    Внутри Docker только Linux, и, экспериментально, FreeBSD. Запускается нативно под Linux и, экспериментально, под FreeBSD. Под MacOSX, Windows - через виртуальную машину.

    Докер - это двойная изоляция. Изоляция того, что лежит внутри контейнера Докера от операционной системы и изоляция операционной системы от того, что лежит внутри Докер. Изоляция подразумевает изоляцию всех файлов, портов, приоритетов.

    Это почти виртуальная машина. Почти, да не совсем.


    Есть такое понятие "ад зависимостей". Любое ПО устанавливаемое на компьютер, тянет за собой зависимости (конфигурационные файлы, статические файлы называемые обычно asset, вспомогательные утилиты/сервисы, библиотеки и пр.). Ряд из этих библиотек/утилит/сервисов несовместим друг с другом. А с учетом того, что каждая из этих библиотек/утилит/сервисов имеет и свои зависимости - ситуация еще хуже.

    Например, мы используем Yandex.Cocaine, которая нормально компилируется только на Ubuntu 14.04 (и, вроде, на Debian 7). Но не под CentOS 6, 7, Debian 8, FreeBSD 9, 10, Ubuntu 15, 16 и пр. - скомпилировать его невозможно. Запускаем в этих операционных системах в Докере.

    С другой стороны, и одновременно с этим, вам необходимо установить другое, более современное ПО. И одновременно более старое. Причем речь даже не идет об серьезно отличающихся версиях Linux. Например, одно ПО требует не менее Ubuntu 14.10, а другое не более Linux 14.04.

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

    Таким образом, мы имеем бинарный файл запускаемый как бы в своей операционной системе.

    Вы можете сказать - ба, да это же давно известная виртуальная машина. Но нет, это не так. Это так называемые контейнера. Никакой виртуальной машиной там и не пахнет. За исключением Windows и MacOSX, где работа без виртуальном машины пока экспериментально возможно только, а нормой в этих ОС является использование Докера внутри полноценной виртуальной машины.

    Но виртуальные машины с Докером используются только для разработки. Для запуска в production виртуальные машины с Докер не используются.

    Докер использует контейнеры операционной системы. LXC в Linux, Jails в FreeBSD. Контейнер - это область операционной системы, изолированная от основной части операционной системы. В контейнере свое дерево каталогов (включая системные /dev, /bin, /sbin и пр.), свои сетевые порты и пр. и пр.

    Но при этом не используется полная виртуализация. Что существенно экономит ресурсы. Запустить 100 полноценных виртуальных машин вряд ли получится даже на мощном сервере. А вот запустить 100 контейнеров Docker даже на слабом домашнем компьютере - возможно.

    Правда использование не полной виртуализации ограничивает использование операционных систем внутри контейнеров. Как правило, это специально подготовленные версии Linux или FreeBSD. Именно специально подготовленные. Windows - в принципе в контейнере запустить невозможно.

    Контейнеры существовали и до Docker. Докер, строго говоря, это всего лишь очень удобный набор инструментов, собранных воедино, для управления контейнерной виртуализацией. Но очень удобный.

    Зачем это используется?

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

    Вплоть до того, что идеально написанная и оттестированная программа на реальном сервере начинает себя вести непредсказуемо.

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

    Более того - изначально разработчик программного обеспечения тестирует программу в контейнере Докер, с определенными настроками. И в этом же (или с такими же настройками) контейнере Докера программа уезжает на сервер.

    Это позволяет гарантировать гораздо большую идентичность среды разработки и среды исполнения.

    До этого люди мучались, придумывали хитрые инсталяторы...

    Потом плюнули на попытки упорядочить окружение в ОС - и сейчас концепция такова - устанавливать программы на сервера вместе со своими индивидуально настроенными под них операционными системами - то есть внутри контейнеров. 1 контейнер = 1 настройка ОС = 1 программа внутри.

    Другими словами:
    • Докер-контейнер нужно использовать для отладки.
    • Тот же Докер-контейнер нужно использовать и на сервере.


    Это позволяет не трудиться с настройками "под сервер" локально на машине разработчика. Это позволяет разрабатывать на машине разработчика совершенно разные программы одновременно, которые требует несовместимых настроек операционной системы. Это позволяет давать гораздо больше гарантий, что программа на сервере будет вести себя также как и на машине разработчика. Это позволяет разрабатывать под Windows/MacOSX с удобным "прозрачным" тестированием под Linux.

    Докер применим к созданию/настройке только серверного программного обеспечения под Linux (экспериментально под FreeBSD). Не для смартфонов. А если десктопов - то только программное обеспечение без GUI.

    Посколько Докер позволил одним махом упростить работу разработчикам и админам и повысить качество результата - сейчас бум на Докер. Придумано огромная гора инструментов для управления развертыванием приложений созданных с Докером. Если раньше чтобы запустить 10 000 программ на 1000 серверах нужно было как минимум 3 высококвалифицированнейших девопса, которые писали кучу описаний как это сделать на Puppet, Salt, Chef, Ansible, да и то не было гарантий, это все тестилось месяцами. То сейчас с Докер даже один квалифицированных девопс может рулить миллионами программ на десятках тысяч серверов. С куда как большей гарантией, что все это заведется нормально.

    UPD:

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

    Разработчик отдает весь свой результат в систему CI (обычно через git)
    CI на каждый новый коммит делает с помощью Docker образ для тестирования.
    Если тесты проходят успешно, то этот же самый Docker образ, отправляется на развертывание в production.
    Или, чуть иначе в компилируемых системах, где исходники не нужны в production: в Docker производится развертывание среды для компиляции, а для тестирования разворачивается второй образ с уже откомпилированным добром, который уже отправляется в production.

    То есть при правильной огранизации дела разработчик не может/не должен влиять на то, какой будет образ.
    А вот в тестовой среде (запускаемом на сервер, недоступном разработчику в больших командах) и в production как раз используется один и тот же образ.

    Основная идея - что тестировали, ровно то и запускаем на боевом сервере. Один-в-один, включая те же самые файлы (не такие же, а именно те же самые).
    Ответ написан
    18 комментариев
  • Для чего нужен Docker?

    @viiy
    Linux сисадмин \ DevOps
    Представьте что нет никакой ложки докера.

    1) Есть одна физическая машина. Вы устанвливаете софт, разные приложухи, базы, web сервера, заходят тестовые юзеры, что-то запускают. Первая проблема - вы не понимаете кому что надо, кто владелец файлов, приложух, зачем висят демоны и кто за это ответственнен. Как выход, вы решаете это разделить на виртуалки.

    2) У вас есть физическая машина + на ней виртуалки. Вы выделяете под каждую задачу свою виртуалку, там сидят отдельные пользователи, вы навели какой то порядок. Появляется задача - пользователи хотят php 6, а его нет, хотят python3, а его нет, хотят Mongo, а она старой версии. Вы обновляете репозитарии, качаете новые пакеты, ставите, часть пользователей довольны, часть нет - им нужна старая версия какая была. Упс!

    3) Одна физическая машина + еще больше виртуальных машин. Вы разделили всех пользователей так, чтобы никто не дрался за версии софта, если нужен php6 - иди на эту машину, нужен php5 - вот на эту. Все счастливы, но появляются разработчики, которые говорят буквально так - "а у меня на рабочей машине все работает, я перенес все как было на виртуалку, а у меня появляется ошибка missing library libXXX.so.X". И вы понимаете что вам остается только создать полную копию машины разработчика, чтобы софт поехал на этой виртуалке без ошибок... И тут появляется Docker! :)

    4) Docker решает именно эту проблему. Вам не нужно заботится о софте который установлен на сервере/виртуалке. Вы просто берете и переносите софт со всеми "кишками" на другой сервер и он просто работает. Работает за счет того, что все "кишки" это слои файловой системы нанизанные как бисер друг на друга. Дополнительно решается проблема свободного места, т.к слои многократно переиспользуются контейнерами, если вам нужен php + одна библиотека, а другому php + другая библиотека, вы используете (грубо говоря) слой php, а для дополнительной библиотеки делаете отдельный слой, одновременно другой человек делает над php другой слой и вы не деретесь между собой и не видите чужих библиотек. Это грубо и скорее всего ради одной библиотеки никто новый слой не делает, делают слой пожирнее.

    Все запущенные процессы Docker помещает в изолированную среду процессов, файловой системы и сетевого стека. Есть много особенностей по работе с Docker, т.к он предполагает, что в одном контейнере вы запускаете один процесс. Если вам нужно запустить целый набор демоном, тут появляются проблемы, нужно писать шелл-скрипт, который все это поднимет в контейнере. Так же есть особенности по сети, файловой системе. Для кого то Docker спасение и решение всех проблем, но я как сисадмин от этого всего не в восторге.
    Ответ написан
    15 комментариев
  • Проблема с путями при сборке фронта (Gulp.js): как решить?

    @ChickenGrinder
    1. Паттерн в src делится на две части base + relative (base - это все что до звездочек, relative - остальное)
    2. Итоговый путь в dest записывается как relative
    3. base можно изменить указавать опцию base в src() (gulp.src('a/**/b', {base: '.'}))
    Исходя из этих пунктов - установить правильный паттерн или установите нужную опцию base.

    Если у вас проблема в путях к шрифтам (картинкам) в итоговом css вместо url('images/etc') надо url('../images/etc), то здесь нужно искать gulp плагин по запросу "rebase" (либо postcss plugin)
    Ответ написан
    1 комментарий
  • Адаптивный Резиновый Кроссбраузерный CSS дизайн на FLEX. Почему Chrome отображает не правильно?

    dom1n1k
    @dom1n1k
    Вообще всё неправильно сверстано. Странно скорее, что оно работает нормально в FF, чем то, что оно глючит в Chrome. По мне, оно не должно работать нигде.

    Почему все блоки .flexColumnBlock имеют height: 100%? Высота там нужна только для самого внешнего контейнера. Дальше про width и height нужно забыть и пользоваться только flex-basis, flex-grow, flex-shrink.

    В чем вообще смысл использования флекса при таком подходе, ну кроме того, что это модное словечко? Зачем там 2 попеременно показываемых сайдбара вместо манипуляций со свойством order? Если уже переходить на flex-верстку, то нужно принимать и использовать её идеологию, а не усердно грести против течения. Мне кажется, вы её (идеологию) пока не понимаете - почитайте теорию. Либо используйте абсолютное позиционирование, оно проще (я серьезно).
    Ответ написан
    Комментировать
  • Как вы создаёте адаптивный дизайн и всегда ли это нужно?

    @esvlad
    Веб-разработчик
    Лично я считаю, что поскольку аудитория пользователей мобильного интернета чуть ли не больше чем десктопного, то адаптировать нужно.

    Сам на своём одном проекте использую 2 метода, сначала скриптом Mobile_Direct узнаю устройство, затем заношу переменную в сессию, далее подключаю css для мобильной версии.

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

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

    xmoonlight
    @xmoonlight
    https://sitecoder.blogspot.com
    В 3 этапа.
    1. Ближайшие цифровые характеристики у имеющихся товаров относительно отсутствующему: каждая по-отдельности вверх и вниз, формирование списка с весами релевантности.
    2. Подстановка текстовых переменных и поиск по списку (из п.1) с использованием алгоритма расстояния Левенштейна с формированием СВОЕГО списка весов релевантности.
    3. Объединение этих двух списков с суммированием весовых показателей и последующей сортировкой по весовым значениям: самый максимальный вес - будет самым похожим товарозаменителем.
    PS: если у Вас в БД: "желтый", "yellow", "песочный", "sand", "светло-жёлтый", "светлый песок" - то тут Вы должны использовать синонимайзер, написанный вручную для использования до п.2.
    Ответ написан
    Комментировать
  • Что все-таки должен уметь делать frond-end-разработчик?

    @xfg
    Бекендер предоставляет api для манипулирования данными, а ваша задача эти данные отобразить конечному пользователю. Взаимодействие с сервером ваша задача. Вы делаете полностью клиент. На каком фреймворке или без, вам решать. Но в подавляющем большинстве случаев пишут classic websites, где клиентская часть генерится на сервере и клиент соответственно писать не нужно, поэтому весь сайт делает бекендер, отдать можно только верстку верстальщику, а фронтендер в таком проекте не нужен.

    Фронтендер такой же программист. Скажем у фейсбука есть API, вас просят написать веб клиент к этому api. И вы должны это сделать. На выходе должен быть готовый продукт, которым уже может пользоваться конечный потребитель. Это фронтендер. Это его отличает от верстальщика, задача которого картинку напилить в html.
    Ответ написан
    Комментировать
  • Как сделать слой с прозрачной "дыркой" внутри?

    IonDen
    @IonDen
    JavaScript developer. IonDen.com
    1. Открываем фотошоп
    2. Создаем квадратную/прямоугольную белую картинку (размером с видео)
    3. Вырезаем в ней дырку в центре нужной формы
    4. Сохраняем как пнг с прозрачностью
    5. В HTML вставляем div слоем выше видео.
    6. Фоном для этого дива используем эту картинку
    7. Profit!
    Ответ написан
    Комментировать
  • Что в себя должна включать поддержка ПО и сколько за это брать денег?

    @Joysi75
    Не зная софта тяжело сказать что и как требуется. Но обычно:
    1. Гарантийные обязательства обычно включают в себя:
    - Указание срока его предоставления.
    - Исправление критических ошибок
    - Консультирование клиента в рамках функционирования ПО (отдельно можно описать круг тем).
    - Обновлении версий
    - Функционирование ПО в рамках обязательств заключенных в договоре (или приложении ТЗ к нему) или указанных в акте (или иных договоренностей) на момент сдачи ПО.
    - Иное обслуживание ранее указанное в договоре/акте/... на момент сдачи ПО. Например, Вы договорились что у клиента ориентировочно через 3 мес откроется пару филиалов и Вы настроете ПО на работу с ним.

    2. Поддержка может включать в себя обычно: техническое обслуживание, аварийное обслуживание, обучение.

    2.1 Аварийное обслуживание. Заранее прописывают 2 вещи: категорию аварии и время реагирования/время устранения + штрафы(не обязательно финансовые, может быть разрыв договора) в случаи нарушения. Например,
    1я категория - не запускается софт (например из-за установки service pack на ОС) время реагирования=30 минут, время устранения=3 часа.
    3я категория - криво сформировался ежегодный отчет (в следствие нарушения данных и т.п.) . Время реагирования=1 час, время устранения=5 раб. дней.

    2.2 Техническое обслуживание. Обычно тут "хотелки" (написать небольшой дополнительный функционал, например, добавить ИТОГО,графики + доп колонки в какой-либо отчет) либо доп. требования (например, выгрузка каких-либо данных для налоговой из инет-магазина при изменении законодательства). В договоре опять-же категоризируют такие работы (например: установка дополнительного АРМ, экспорт-импорт данных в XML/JSON/TXT в стороннее ПО ...) и устанавливают доп цены на них принципу:
    N штук таких работ выставляют в виде периодической абонплаты, а выше N - по отдельной цене (например, за фиксированную почасовую оплату). Будет хорошо, если вы приложите расценки с указаниям кол-ва часов для решения наиболее возникающих проблем. Также указывают штрафы при нарушении сроков и т.п.

    2.3. Обучение. Обычно после сдачи софта разработчик берется:
    - Обучить N сотрудников работе с ним в течении X дней.
    - При изменении версии (или критическом обновлении) произвести обучении M сотрудникам в течении Y дней.
    - Периодически проводить семинары для Z сотрудников не реже S дней в квартал
    Все что за пределами этого (и не входит в гарантийные обязательства) - прописывается и категоризируется. Отдельно прописываются права третьих лиц за отдельные виды работ (например, возможность нанимать внештатных инженеров).

    Также совет - попросите у знакомых (лучше работающих в иностранных конторах) анонимайзированные (персональные и юр/фин данные забиты ИВан Иванычами и *) договоров продажи ПО с прописанными SLA, приложениями (категории и виды доп работа, бланки-заказов, актов и т.п. - сразу станет понятнее.
    Ответ написан
    1 комментарий
  • Когда ооп быстрее процедурного?

    EvilsInterrupt
    @EvilsInterrupt
    System programming, Reversing Engineering, C++
    Все зависит от Вас самих, т.е. от Вашего способа мыслить. Ваших способностей.
    Возможно Вам вообще в Вашу голову будет легче ложиться "функциональщина" чем ООП и это не страшно и не плохо. Просто Ваша особенность.

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