Задать вопрос
  • Как связать Nuxt и CMS?

    delphinpro
    @delphinpro Куратор тега PHP
    frontend developer
    Совет простой — учитесь.
    Всё очень сумбурно, ничего непонятно. Как устроено, как настроено...
    Можно включить режим гадалки. Кто-то так и сделает и будет давать советы. Может они вас наведут в нужное русло...

    Давайте сначала.
    Что такое "headless-cms"? по сути это cms в режиме API. Получает запрос, отдает голые данные. Чаще всего в формате json.

    Что из этого следует?
    Это значит у вас два приложения. Серверная часть на cms. И клиентская на vue.
    Первая работает на php, вторая на nodejs.

    Значит вы на своем сервере (машине) должны поднять два сервера (программных). Один будет обрабатывать запросы к данным (API/cms), другой висеть на 80 дефолтном порту (ваш фронт на VUE) и брать данные из первого.

    Что касается nuxt, то он может работать в режимах SSR и без него. Если без, то все сводится к тому, чтобы скопировать ваш index.html из билда в основной шаблон CMS. Если с SSR, то придется поднимать доп. nodejs сервер и разруливать запросы nginx'oм. 80-й порт на nodejs, кастомный - на php cms.
    Ответ написан
    3 комментария
  • Select option стилизация?

    delphinpro
    @delphinpro Куратор тега CSS
    frontend developer
    Ответ написан
    Комментировать
  • Как прописать правильно namespase относительно папки?

    delphinpro
    @delphinpro Куратор тега PHP
    frontend developer
    PSR-0 или PSR-4, и как правильно построить структуру проекта?

    Если я правильно понял, вы хотите убрать app из нейспейса.
    Тогда в вашем случае, полагаю, так

    "psr-4": {
          "core\\": "app/core"
    }


    И phpStrom указать для папки app/core что она является Source root. Может и другие IDE так умеют.
    Ответ написан
  • Как не переборщить с тяжёлыми css правилами?

    delphinpro
    @delphinpro Куратор тега CSS
    frontend developer
    Вы заморачиваетесь конкретной ерундой. Забудьте, и не думайте об этом. Просто верстайте с применением современных технологий.
    Ответ написан
    1 комментарий
  • Товар, умножаем цену на кол-во товара и выводим цену, как сделать?

    delphinpro
    @delphinpro Куратор тега JavaScript
    frontend developer
    Что-то вы слишком заморочились с идентификаторами. Всё проще.



    Я сделал поле видимым, просто для отладки. Также отсутствуют проверки на NaN и вывод цены без отделения копеек. Это все к сути не относится.
    Ответ написан
  • Как называется такой стиль кода (где весь код в одну строку)?

    delphinpro
    @delphinpro Куратор тега Sass
    frontend developer
    Если речь идет о выходном файле после компиляции sass, то вот: https://sass-scss.ru/documentation/stili_vihodnogo...

    Если речь идет о подобном форматировании в исходниках, то тут я согласен с 0xD34F .
    Ответ написан
    Комментировать
  • Идеальный алгоритм вёрстки сайта?

    delphinpro
    @delphinpro Куратор тега Вёрстка
    frontend developer
    В целом согласен. До пункта №7.

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

    1. Базовые элементы. Общая типографика, кнопки, ссылки и т.п.
    2. Общие блоки. То что повторяется на нескольких страницах и/или может быть переиспользовано, какие-то виджеты, менюшки, и т.п.

    Все это занимает основную часть времени работы. И к окончанию этих этапов я имею своего рода набор, или конструктор, из готовых блоков. Остается только написать лейауты для разных страниц и раскидать по ним имеющиеся блоки.

    Для этого всё закидываю на гитхаб-пейдж, чтобы по ссылке я мог открыть с телефона или попросить знакомого проверить на другой ОС c телефона


    Это лишняя трата времени. Пусть небольшая, но все же. Плюс, отслеживать качество верстки все-таки удобнее в процессе, а не по окончании подкручивать.
    Поэтому используем browser-sync. Поднимается сайт, доступный по IP в домашней локалке с любого устройства. Совет: использовать всегда один порт в browser-sync, а на устройствах сделать закладки на этот адрес. Любой сайт, который в данное время разрабатывается, открывается одним тапом по закладке.
    Кроме того BS дает бонус в виде синхронизации действий сразу на всех устройствах: клики, прокрутка, ввод. Это мега-удобно — кликаешь на компе, краем глаза смотришь в планшет и телефоны, сразу видишь там все изменения и поведение.

    Всё готово, сжимаю CSS, JS. через веб-сервисы.


    Опять тратите время. Настроенный Gulp в одну команду проделает все оптимизации (на больших проектах даже кофе можно успеть сделать, пока собирается билд=).

    Еще обратите внимание на инструмент lighthouse в инструментах разработчика.

    скриншот
    608fcaa260f31153020142.png


    Не нужно никуда сайт заливать, чтобы проверить на доступность, производительность и т.п.

    Про CMS ничего не скажу. Клиенту удобнее кнопочки тыкать в условном вордпрессе.

    Я не упомянул SASS-фигас и т. д, так как не увидел практической пользы для проектов на 1-15 страниц.


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

    Ну вот зачем PUG? Как конкретно он помогает на небольших проектах 1-15 шаблонов страниц.


    Помогает. Нет, конкретно Pug я очень не люблю. Но другой, более "хэтээмэльный" шаблонизатор бывает полезен. Я уже упомянул выше о верстке независимыми блоками. Шаблонизатор позволит не копипастить эти блоки, а использовать их как компоненты.

    Префиксы? В кодовом редакторе они и так есть.


    Я считаю, что исходный код должен быть чистым, без префиксов. Это лишний визуальный мусор. Пусть лучше автопрефиксер этим занимается. К тому же этот плагин использует актуальную базу caniuse на основе вашего .browserlist. Пусть профит и не большой, но все же поменьше на выходе неактуальных свойств.
    Ответ написан
    2 комментария
  • Как сделать такую сетку Grid?

    delphinpro
    @delphinpro Куратор тега CSS
    frontend developer
    Делаете примерно такую сетку (в grid-template-columns)

    608ea9f4badb8744275269.png

    Первый, второй, пятый и шестой элементы растягиваем на две колонки
    .item:nth-child(6n + 1),
    .item:nth-child(6n + 2),
    .item:nth-child(6n + 5),
    .item:nth-child(6n + 6) {
      grid-cloumn: span 2;
    }
    Ответ написан
    6 комментариев
  • Когда использовать button?

    delphinpro
    @delphinpro Куратор тега CSS
    frontend developer
    Button - переводится как "Кнопка".
    Отсюда простой вывод — используем везде, где нужна кнопка.
    Если вы используете вместо кнопки div или span — это всегда неправильно.
    Так же и ссылки. Если ссылка в макете выглядит как кнопка, то она все же остается ссылкой и верстается тегом а.
    Ответ написан
    Комментировать
  • Что правильнее использовать?

    delphinpro
    @delphinpro Куратор тега Вёрстка
    frontend developer
    Вопрос: как правильнее?

    Никак.
    Оба подхода имеют право на жизнь.

    Плейсхолдеры, при правильном использовании, немного сокращают выходной css код.

    Такое ваше использование очень смахивает на atomicCSS.
    Может так и стоит поступить?

    Сделать кучу классов

    .d-flex { display: flex; }
    .justify-content-between { justify-content: space-between; }
    .direction-column { flex-direction: column; }


    И потом использовать либо классы в разметке, либо расширяться прямо от них

    <div class="d-flex justify-content-between"></div>

    .some-class {
      @extends .d-flex;
      @extends .justify-content-between;
    }


    Ой! Мы, кажется, переизобретаем bootstrap...
    Ответ написан
    3 комментария
  • Как передать имена инпутов в массив?

    delphinpro
    @delphinpro Куратор тега Laravel
    frontend developer
    public function store(Request $request) {
      $validator = Validator::make($request->all(), [
        'title' => 'required|string',
        'source' => 'required|string',
        'category_id' => 'required|integer|exists:categories,id',
      ]);
    
      try {
        $input = $validator->validate();
      } catch (ValidationException $e) {
        return redirect()->back()->withErrors($validator)->withInput();
      }
    
      $input['id'] = Auth::user()->id;
      $input['private'] = $request->has('private') ? 0 : 1;
    
      Pass::create($input);
    
      return redirect()->route('home');
    }
    Ответ написан
    Комментировать
  • Как попросить Браузер клиент перезагрузить JavaScript?

    delphinpro
    @delphinpro Куратор тега JavaScript
    frontend developer
    Я знаю пока только 1 способ эту проблему обойти, изменить название скрипта

    Не название, а URL, по которому этот скрипт загружается.
    И это единственный вариант.
    Для изменения URL достаточно поменять любой get-параметр.
    <script src="/js/main.js?v=любая_хрень"></script>

    "Любая_хрень" может быть, например, временем последней модификации файла, или хешем этого файла, или вручную прописываться.
    Ответ написан
    Комментировать
  • Есть Сайт где можно вложить ссылку Сайта а он тебе отправить макет данново сайта?

    delphinpro
    @delphinpro Куратор тега CSS
    frontend developer
    У вас целых четыре варианта решения проблемы.

    1. Сесть и самому отрисовать (срисовать). Дизайн довольно простой, справиться можно.

    2. Обратиться напрямую к владельцам сайта https://inovatik.com/index.html и договориться с ними о приобретении шаблона. Если шаблон вообще существует. Просто выглядит как набор клипартов. Могли тупо сверстать из ассетов, без макета.

    3. Поискать в поисковике по картинкам. По имени сайта, по текстам из шаблона, по скриншоту страницы.

    4. Сидеть и ждать, что сюда случайно заглянет кто-то, кто имел дело именно с этим шаблоном.

    Первый самый простой и дешевый. Картинки, параметры цвета и шрифтов можно подсмотреть прямо в live-preview.

    Второй несколько замороченнее, и не даст 100-процентного положительного результата.

    Третий и четвертый имеют все шансы потратить огромную кучу времени без какого-либо результата.
    Ответ написан
    1 комментарий
  • Почему не видно главной ветки из github локально?

    delphinpro
    @delphinpro
    frontend developer
    git pull origin main - стянуть ветку main с удаленного репозитория
    Ответ написан
  • Как передать массив методом Post?

    delphinpro
    @delphinpro Куратор тега Laravel
    frontend developer
    $data = [
      'category' => [
        '1' => ['1' => '1'],
        '2' => ['1' => '1'],
      ],
    ];
    Ответ написан
    2 комментария
  • Как реализовать голосование с огроничением на единоразовый голос от каждого пользователя?

    delphinpro
    @delphinpro
    frontend developer
    Авторизованный пользователь или гость?
    В первом случае довольно просто. Просто заводим таблицу связей пользователь-голосование.
    Во втором практически нельзя однозначно определить. В простейшем случае писать метку в локалсторадж и/или куки (но их легко очистить и проголосовать еще раз). В более сложных вариантах использовать фингерпринтинг для идентификации. Тоже не даст 100% гарантии, но уже сложнее обойти.
    Ответ написан
    Комментировать
  • Ошибка при переносе joomla на open server, что делать?

    delphinpro
    @delphinpro
    frontend developer
    Частые ошибки:
    имя пользователя копируется с прода, но такой пользователь не создан локально.
    подключаетесь через рута без пароля.

    Правильный вариант:
    Использовать для подключения пользователя mysql с паролем mysql
    Ответ написан