• Когда нужен MVC, а когда API?

    ipatiev
    @ipatiev
    Потомок старинного рода Ипатьевых-Колотитьевых
    Понятно же, что человек просто использует термины не по назначению. А имеет в виду способ взаимодействия с клиентом.
    Словом "mvc" он называет классический способ, при котором сервер отдает клиенту HTML (а не JSON).
    А словом "api" - REST сервис, при котором сервер отдает клиенту как раз JSON.

    И суть вопроса сводится именно к различию между этими двумя способами:
    - когда сервер генерирует HTML на основе полученных из БД данных, и отдает его браузеру
    - или когда в браузере выполняется программа на JS, которая запрашивает с сервера только данные, а потом на их основе генерирует HTML

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

    При этом с точки зрения бэкенд программиста разницы принципиальной между этими способами нет.
    Главное в программе - это её бизнес-логика. И уметь надо в первую очередь писать её.
    А в каком формате отдавать данные в браузер - дело десятое. И выбирать между "mvc HTML" и "api REST" нет смысла - уметь надо и то и то.

    Ну и, как уже объяснили, MVC - это совсем другое. Архитектура приложения. Причем она используется для любых приложений, независимо от типа отдаваемых данных. M и C в "api" приложениях используются в полный рост. Только V немного упрощается. при этом поскольку MVC подразумевается по умолчанию, то и писать её в вакансиях тоже особого смысла нет.
    Ответ написан
    4 комментария
  • В какой программе лучше делать верстку сайта?

    miraage
    @miraage
    Старый прогер
    vscode или webstorm, другие варианты выкиньте.

    vscode - как vim, текстовый редактор, простой. Может превратиться в мощную машину через плагины. Кажется идеальным вариантом в Вашем случае.

    webstorm - мощная машина, "громоздкий" инструмент для профессиональных разработчиков. Умеет почти все, если не все, однако для простой верстки это как стрелять с пушки по воробьям.
    Ответ написан
    1 комментарий
  • Как правильно реализовать вертикальный степпер через список?

    MrDecoy
    @MrDecoy Куратор тега CSS
    Верставший фронтендер
    sirenko, Для первого раза не плохо.
    Но есть ряд нюансов:
    1) Дивы нельзя вкладывать в списки. Это не валидно
    2) Вы хардкодите значения для каждого элемента. Это лишнее.
    3) Если текста будет другое количество, то всё поплывёт.
    4) Не нужно два псевдоэлемента, чтобы нарисовать 2 линии. Достаточно одного для длинной линии и другого для цифры поверх.

    Переписал на скорую руку (какие то стили для Вас могут оказаться лишними. Прописаны исключительно для демки):
    Ответ написан
    1 комментарий
  • В каких случаях использовать Vue, а в каких React?

    alexey-m-ukolov
    @alexey-m-ukolov Куратор тега React
    Те, кто знают Vue, могут написать проекты любой сложности на Vue.
    Те, кто знают React, могут написать проекты любой сложности на React.
    Использовать нужно то, что вы знаете или хотите изучить.
    Ответ написан
    2 комментария
  • Как добавить анимацию появления блоков?

    MrDecoy
    @MrDecoy Куратор тега CSS
    Верставший фронтендер
    pogugli.com/?384653 --> https://www.impressivewebs.com/animate-display-blo...

    https://qna.habr.com/search?q=%D0%BA%D0%B0%D0%BA+%...

    Правила сервиса
    2.2 Убедиться в том, что в сети Интернет, и на страницах Сервиса в частности, отсутствуют ответы на данный вопрос. Специально для этого талантливые IT-специалисты создали и развивают поисковые системы Яндекс и Google.
    Ответ написан
    9 комментариев
  • Как написать функцию, которая вычисляет сумму чисел отрезка от -5 до 5?

    Rsa97
    @Rsa97
    Для правильного вопроса надо знать половину ответа
    const sumNumbers = (from, to) =>
      (from + to) * (Math.abs(to - from) + 1) / 2;
    Ответ написан
    Комментировать
  • Как получить текст тега?

    MrDecoy
    @MrDecoy Куратор тега JavaScript
    Верставший фронтендер
    Вы были близки.
    .closest() ищет исключительно вверх по дереву, начиная с самого элемента. А .text не является родительским элементом для картинки.

    Таким образом, нужно сначала найти общего родителя между картинкой и .text, и в этом общем родителе найти .text:
    -const message = event.target.closest('.text').textContent;
    + const message = event.target.closest('.message_container').querySelector('.text').textContent;
    Ответ написан
    Комментировать
  • Как элементы массива сделать значениями объекта?

    MrDecoy
    @MrDecoy Куратор тега JavaScript
    Верставший фронтендер
    Мое решение:

    let arr = ['a', 'b', 'c', 'd', 'e'];
    let obj = {};
    for (let i = 0; i <= arr.length; i++) {
    obj[i + 1] += arr;
    }
    console.log(obj);


    Ну Вы были относительно близко.
    1. Зачем Вы делаете += ? Вы же не плюсуете к чему то, а назначаете значение. То есть
    - obj[i + 1] += arr;
    + obj[i + 1] = arr;

    2. Зачем Вы прибавляете весь arr, когда Вам нужен элемент массива, а не весь массив. То есть:
    - obj[i + 1] = arr;
    + obj[i + 1] = arr[i];

    3. Цикл выполнится 6 раз, так как у Вас от нуля до длины массива - 5. То есть, 0,1,2,3,4,5. Вместо этого можно начать с 1, и в итоге тогда:
    let arr = ['a', 'b', 'c', 'd', 'e'];
    let obj = {};
    for (let i = 1; i <= arr.length; i++) {
    obj[i] = arr[i-1];
    }
    console.log(obj);


    Ну и как уже сказали выше, можно через reduce. Тогда будет значительно короче:
    let arr = ['a', 'b', 'c', 'd', 'e'];
    let obj = arr.reduce((a, c, i) =>  (a[i+1] = c, a), {});
    console.log(obj);
    Ответ написан
    Комментировать
  • Где найти курс по созданию telegram-бота?

    rozhnev
    @rozhnev
    Fullstack programmer, DBA, медленно, дорого
    Ответ написан
    Комментировать
  • При обновлении страницы сразу вызывается alert, хотя должен по нажатию на кнопку (onClick)?

    kawabanga
    @kawabanga
    clickOnButton() -> clickOnButton

    Вы должны передавать функцию, а не ее выполнение.
    Ответ написан
    Комментировать
  • Как в PhpStorm перенести каретку на следующую строку с помощью горячих клавиш, но не стрелкой?

    Откройте раздел Keymap в настройках и там в Editor Actions настройте дополнительно для Down любое удобное вам сочетание клавиш.
    Например, можете забиндить перемещение курсора на Shift + (W,A,S,D), по крайней мере в моих настройках эти сочетания ни с чем не пересекаются. Заодно левый мизинец раскачаете.

    P.S. Насчёт Shift+WASD, я, конечно, фигню сморозил - как заглавные-то писать :)
    Ответ написан
    3 комментария
  • Как добавить еще один Transform?

    Ankhena
    @Ankhena
    Нежно люблю верстку
    transform: scale(1.1) rotate(90deg);

    Можете старое записывать в кастомное свойство. Тогда оно автоматом поменяется всюду.

    .item {
      --transform: scale(1.1);
      transform: var(--transform);
      
      &--mod {
        transform: var(--transform) rotate(90deg);
      }
    }
    Ответ написан
    3 комментария
  • Как удалять элемент по id из массива обьектов в localstorage?

    Rsa97
    @Rsa97
    Для правильного вопроса надо знать половину ответа
    const removeTodoFromStorage = (id) =>
      localStorage.setItem(
        'todoList',
        JSON.stringify(
          JSON
            .parse(localStorage.getItem('todoList') ?? '[]')
            .filter((item) => item.id !== id),
        )
      );
    Ответ написан
    2 комментария
  • Задачка на циклы в JavaScript?

    Rsa97
    @Rsa97
    Для правильного вопроса надо знать половину ответа
    const chars = [' ', '#'];
    const size = 8;
    str = '';
    for (let i = 0; i < size; i++) {
      for (let j = 0; j < size; j++) {
        str += chars[(i + j) % 2];
      }
      str += '\n';
    }
    console.log(str);
    Ответ написан
    7 комментариев
  • Как понять, что ты middle front-end developer?

    @Lord_Dantes
    Как понять, что ты уже middle front-end developer?

    Когда просыпаешься от лучиков солнца, а не от заказчика который говорит что твоя верстка поплыла
    Чем junior отличается от middle front-end?

    Джуниора контролят на каждом этапе и дают небольшую волю, мидла могут отпустить на вольные хлеба
    Что такого знает middle, чего не знает junior front-end developer?

    JS, какой-то фреймворк возможно на базовом уровне немного бэка
    Как происходит процесс повышения до middle front-end developer в компаниях?

    Как и процесс повышения зарплат
    Чем отличаются обязанности junior и middle front-end developer?

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

    Умение находить ответы на вопросы и я больше не знаю прям таковых важных
    Набор скилов для middle front-end developer?

    Своя чашка кофе, аккаунт на тостере с достаточным вкладом, и свой ноутбук.
    Как стать middle front-end developer?

    Если читать постоянно читать советы и указания то никак. Если действовать то скоро.
    Ответ написан
    1 комментарий
  • Как сделать чтобы два блока были одинаковой высоты?

    Seasle
    @Seasle Куратор тега CSS
    Ответ написан
    Комментировать
  • Как сделать список с буквами и со скобками?

    0xD34F
    @0xD34F Куратор тега CSS
    ul {
      counter-reset: item;
    }
    
    ul li {
      counter-increment: item;
    }
    
    ul li::marker {
      content: counter(item, lower-alpha) ") ";
    }
    Ответ написан
    Комментировать
  • Как удалить объект из массива?

    0xD34F
    @0xD34F Куратор тега JavaScript
    const index = arr.findIndex(n => n.id === id);
    if (index !== -1) {
      arr.splice(index, 1);
    }

    или, если нужен новый массив:

    const newArr = arr.filter(n => n.id !== id);

    Если же id имеют не уникальные значения, то создание нового массива остаётся без изменений, а модификация существующего может выглядеть так:

    for (let i = arr.length; i--; ) {
      if (arr[i].id === id) {
        arr.splice(i, 1);
      }
    }

    или так (да, reduceRight используется не совсем по назначения, как и оператор &&):

    arr.reduceRight((_, n, i, a) => n.id === id && a.splice(i, 1), null);

    или так:

    let countDeleted = 0;
    
    for (let i = 0; i < arr.length; i++) {
      arr[i - countDeleted] = arr[i];
      countDeleted += arr[i].id === id;
    }
    
    arr.length -= countDeleted;

    или так:

    arr.splice(0, arr.length, ...arr.filter(n => n.id !== id));
    Ответ написан
    Комментировать
  • При клике не с десктопа появляется неземная вещь, как можно обойти?

    YavaDev
    @YavaDev
    Если я правильно понял, то это должно помочь, правда не всеми браузерами поддерживается
    .class {
      -webkit-tap-highlight-color: transparent;
    }
    Ответ написан
    Комментировать
  • Как float для img заменить во flex?

    neuotq
    @neuotq
    Прокрастинация
    Для чего заменять?
    Флекс у вас должен использоваться для построения самих карточек, а внутри карточки уже отдельная история. Пусть завголовок будет блочным, параграф инланй, а картинку во float left. И будет вам обтекание. Только clearfix не забудьте.
    Тыц
    Ответ написан
    Комментировать