• Почему каталог с React-приложением не загружается на GitHub?

    sergey-kuznetsov
    @sergey-kuznetsov Куратор тега Git
    Автоматизатор
    Как так получилось, что вы обнаружили проблему только при отправке на гитхаб? Вы вообще не используете гит в локальной разработке?

    Ваша проблема в том, что при изначальном создании приложения командой create-react-app сразу инициализируется Git-репозиторий внутри каталога с приложением. Если вы решили не работать в этом репозитории, а отслеживать изменения client и server в другом общем репозитории, то вам нужно удалить тот вложенный репозиторий из папки client. Иначе гит будет игнорировать изменения там и подумает что это вы подключили подмодуль (submodule).
    # удалите папку .git, которая внутри каталога client
    rm -rf "client/.git"
    # скажите гиту, чтобы он забыл, что перед этим видел там вложенный репозиторий 
    git rm --cached "client/"
    # теперь получится добавить приложение в ваш основной проект
    git add "client/"
    Ответ написан
    Комментировать
  • Почему Facebook и Vk написаны на PHP, если большие базы данных предполагаются делать на Java и C#?

    ipatiev
    @ipatiev Куратор тега PHP
    Потомок старинного рода Ипатьевых-Колотитьевых
    Потому что ни один успешный проект не начинается как "большая база данных". И дело тут не в том, что ни Java, ни C#, ни даже РНР не имеют никакого отношения к базам данных.
    А в том, что успешные проекты начинаются не с "давайте сделаем большой проект", а с "давайте сделаем крутую штуку!"
    Учитывая, что крутая штука делалась в вебе, а РНР был синонимом веб-разработки в то время, то выбор совершенно очевиден.
    Ну и ещё потому, что рядом не случилось самозваного "гуру", который бы объяснил, что "большие базы данных надо делать на Java и C#"
    Ответ написан
    Комментировать
  • Как выводить несколько значений подряд при клике?

    neuotq
    @neuotq
    Прокрастинация
    Ваш код грязный конечно, даже стили немного.
    Вот я тоже набросал грязное решение. Вам я бы рекомендовал немного переверстать, но в целом(обратите внимание я добавил pointer-events none на .types-select__option-text в css на кодпене это видно)
    Саму идею я думаю вы поймёте и под себя переделаете. Ниже код и кодпен.

    //Данные по содержанию меню
    const furnTypes = [
      {
        'id' : 1,
        'title' : 'Офисная&nbsp;<span>меб</span>ель'
      },
      {
        'id' : 2,
        'title' : 'Техника / сантехника'
      },
      {
        'id' : 3,
        'title' : 'Сборка кухни'
      },
    ];
    
    //Каждое активно может быть только один раз
    const activeMenuItems =   new Set();
    
    const clickHandler = e => {
      if(activeMenuItems.add(parseInt(e.target.getAttribute("furn-id"))) ) {
        //Если поменялся перестроим меню
        updateActiveMenuItems(activeMenuItems);
      }  
    };
    
    //Строим меню на основе данных items, вставляем в target
    //на элементы вешаем событие clickHandler
    buildSelectMenu = (target, items, clickHandler) => 
    {
      //создаем родителя
      const parentUl = document.createElement("ul");
      parentUl.classList.add('types-select__options');
      //Каждый из пунктов
      items.forEach(
        item => {
          const childLi = document.createElement("li");
          childLi.classList.add('types-select__option');
          childLi.setAttribute('furn-id', item['id']);
          childLi.addEventListener("click",clickHandler);
          const childTextBlock = document.createElement("div");
          childTextBlock.classList.add('types-select__option-text');
          // Лучше потом на setHtml заменить, но пока нет поддержки
          childTextBlock.innerHTML = item['title'];
          childLi.appendChild(childTextBlock);
          parentUl.appendChild(childLi);
        }
      )
      //Запихиваем туда куда нужно
      target.appendChild(parentUl);  
      return parentUl; 
    }
    
    const updateActiveMenuItems = ids => {
      
      const parent = document.querySelector('.types-select__active-items');
      parent.innerHTML = '';
      ids.forEach( id => {
        const curItem = furnTypes.find( el => el['id'] === id)
        const activeMenuItemEl = document.createElement("div");
        const activeMenuItemTitleEl = document.createElement("span");
        activeMenuItemTitleEl.innerHTML = curItem['title'];
        const activeMenuItemdeleteButtonEl = document.createElement("button");
        //Лучше через текстовую ноду
        activeMenuItemdeleteButtonEl.innerHTML = 'x';
        activeMenuItemdeleteButtonEl.setAttribute('active-furn-id', curItem['id']);
        
        activeMenuItemdeleteButtonEl.addEventListener("click", e => {
          //Чтобы кликалась не взирая на клик событие родителя
          if(e && e.stopPropagation) e.stopPropagation();
          
          if(activeMenuItems.delete(parseInt(e.target.getAttribute("active-furn-id"))) ) {
            //Если поменялся перестроим меню
             updateActiveMenuItems(activeMenuItems);
          } 
        }); 
        
        activeMenuItemEl.appendChild(activeMenuItemTitleEl);
        activeMenuItemEl.appendChild(activeMenuItemdeleteButtonEl);
        parent.appendChild(activeMenuItemEl);
        
      })
      
    }
    
    // Строим меню
    const furnitureMenu = buildSelectMenu(
      document.querySelector('#furnitureMenu'), 
      furnTypes, 
      clickHandler
    );
    
    document.querySelector('.types-select__btn')
      .addEventListener("click", e => {
        // Странное имя класса, наверное должн быть types-select__menu_active
        document.querySelector('.types-select__menu').classList.toggle("_active");
    } )


    Ответ написан
    1 комментарий
  • Можно ли сделать бота chatGPT, отвечающего в одной из тем форума телеграмм?

    ZERGeich
    @ZERGeich
    Можно.
    Ответ написан
    Комментировать
  • Как стилизовать react функцию с помощью styled-components?

    Посмотрел их документацию. Там приводят пример именно с обёрткой в заготовленный стилизованные тег.

    Т.е. «сам» компонент не стилизуют.

    const Main = styled.main`
      background-color: black;
      height: 100vh;
    `
    
    function App(props) {
      const { message } = props;
      return (
        <Main>
          <div className="App">
            {message}
          </div>
        </Main>
      );
    }
    Ответ написан
    1 комментарий
  • В чем "вкус" react?

    krdpsr
    @krdpsr
    loading...
    реакт как и другие фреймворки создан для облегчения работы
    но облегчение происходит через преодоление чудовищной дополнительной сложности
    просто тебе надо пострадать и привыкнуть

    если ты хочешь работать в индустрии то придется привыкнуть
    если ты инди-разработчик то делай свою архитектуру и пиши код как тебе удобно
    я такой разраб - и я не понимаю в чем смысл этих фреймворков

    сайты действительно очень тормозные на фреймворках - но всем наплевать
    главное в капиталистической индустрии - стандартный фреймворк
    чтобы не зависеть от разработчика - чтобы можно было уволить любого и взять нового
    в этом секрет
    Ответ написан
    3 комментария
  • В чем "вкус" react?

    firedragon
    @firedragon
    Не джун-мидл-сеньор, а трус-балбес-бывалый.
    Вкус любого фреймворка в том что бы не делать лишнюю работу.
    В реакте есть реативность, виртуальный виртуальный DOM, роутинг , состояния

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

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

    UPD
    вот сравните https://qna.habr.com/q/1229430
    сложность оригинального кода автора и мое решение, видно что в моем случае включается "магия"
    Ответ написан
    Комментировать
  • В чем "вкус" react?

    @12rbah
    В связи с этим у меня вопрос, чем же обоснована такая популярность этой библиотеки у работодателей?
    Если вы программируете 3 месяца то скорее всего не поймете. React или другой фреймворк изначально подразуевает то, что код хорошо делится по модулям и компонентам, что очень удобно, в обычном js нужно принимать больше усилий чтобы добиться этого. Также есть много готовых решений из коробки, которые уже были отлажены другими более опытными людьми.
    а модульность со мной сыграла злую шутку (прочитал, что хорошим тоном считается разбивать проект на мельчайшие модули, разбил свой, через пару недель я просто почти забыл, что от чего у меня зависит и какой модуль у меня что тянет за собой и главное куда тянет!
    Видимо вы попробовали выучить реакт за неделю, потом потом на 2-3 недели ушли заниматься своими делами и не трогали его и "внезапно" всё забыли. В целом можно писать комментарии для пояснения. Модульность как раз наоборот упрощает чтение кода и если правильно всё называть и прописывать, то в небольших проектах до 5-10к строк можно будет без проблем разобраться за пару дней тому кто не писал это код.
    P.S. Возможно вам лучше выложить вопрос с сылкой на ваш проект и вам подскажут что не так вы сделали, будет полезнее.
    Ответ написан
    Комментировать
  • В чем "вкус" react?

    vfreelancer
    @vfreelancer
    php
    представьте форму из 5 табов, в каждой по 15-20 полей. при изменении некоторых селектов часть полей пропадает, другие появляются, плюс какие-то селекты заполняются с сервера. плюс часть полей зависят от того, кто именно заполняет, плюс локализация, плюс валидация онлайн с проверками в бд на сервере. с реактом решение в разы легче и быстрее должно быть
    Ответ написан
    Комментировать
  • Проблема в setInterval или руках?

    Fragster
    @Fragster
    помогло? отметь решением!
    С каждой итерацией навешиваешь обработчик клика снова и снова. Зачем?
    Ответ написан
    1 комментарий
  • Не включается анимация gif до завершения скрипта. Можно ли пофиксить?

    SagePtr
    @SagePtr
    Еда - это святое
    Данная проблема это из-за того, что при width < 350 картинка постоянно меняется на саму себя. Нужно менять один раз, например, поменять условие на width == 350, или добавить проверку на src картинки, или флаг.
    Ответ написан
    Комментировать
  • Возможно ли получить данные со второй html странички с помощью одного js скрипта?

    @zkrvndm
    Софт для автоматизации
    Используй fetch либо iframe.
    Ответ написан
    Комментировать
  • Возможно ли получить данные со второй html странички с помощью одного js скрипта?

    delphinpro
    @delphinpro Куратор тега JavaScript
    frontend developer
    HTML предназначен для отображения данных, не для хранения.

    Хранить данные можно, например в json формате. Структуру можно прописать прямо на странице в теге script, или подгружать аяксом внешний json файл.
    Ответ написан
    2 комментария
  • Почему метод "хочет стать" функцией?

    Lynn
    @Lynn
    nginx, js, css
    Потому что точки с запятой нужно ставить.
    const greeting = {
    ...
    }; // <-- вот тут!!!
    
    (username) ? ...

    или убрать ненужные скобки
    const greeting = {
    ...
    }
    
    username ? ...
    Ответ написан
    1 комментарий
  • Какой код выглядит грамотнее?

    alexey-m-ukolov
    @alexey-m-ukolov Куратор тега PHP
    Второй, конечно. Потом у вас ещё одно условие появится и оно перестанет помещаться в одну строку.
    Ответ написан
  • HTML/css меню. Как можно реализовать такое подменю?

    Ankhena
    @Ankhena Куратор тега CSS
    Нежно люблю верстку


    Вам остается только модифицировать и применить к своему случаю.
    У вас этот "кусочек" должен быть псевдоэлементом.
    Ответ написан
    Комментировать
  • Bootstrap 5 Отступы блоков, как правильно?

    iiiBird
    @iiiBird Куратор тега CSS
    Пока ты спишь - твой конкурент совершенствуется
    в bootstrap 5 есть css переменные для этого
    .row {
    	--bs-gutter-x: 60px;
    }
    Ответ написан
    8 комментариев
  • Bootstrap шпаргалка,есть ли такая?

    @Vlad_Svetlov
    Ответ написан
    Комментировать