• Почему Input выходит за края формы?

    natojezlo
    @natojezlo
    можно проще
    form{box-sizing:border-box;}
    form input{width:100%;}
    Ответ написан
    Комментировать
  • Упростить js скрипт?

    ProgrammerForever
    @ProgrammerForever
    Учитель, автоэлектрик, программист, музыкант
    Отделите данные от скрипта, будет компактнее. Да и много повторений
    const tags = ['screen', 'goods', 'gallery', 'reviews', 'contacts'];
    function enableBlock(blockTag) {
        document.querySelector('.blocks__phone-bg').classList.add(`blocks__phone-bg--${blockTag}`);
        document.querySelector('.blocks__phone-bg').className = `blocks__phone-bg blocks__phone-bg--${blockTag}`;
        tags.forEach(tag=>{
          let elem = document.querySelector(`.blocks__item[data-item="${tag}"]`);
          if (!elem){
             return;
          };
          if (blockTag===tag){
            elem.classList.add('blocks__item--active');
          }else{
            elem.className = 'blocks__item';
          };
        });
    }
    Ответ написан
    4 комментария
  • Как привести словесный пример полиморфизма?

    @kttotto
    пофиг на чем писать
    Когда Вам нужно что-то записать, обычно берут листочек и ручку. А можно не ручку, можно карандаш, можно фломастер или перьевую ручку. Полиморфизм будет заключаться в том, что Вам нужен объект, которым можно что-то записать, а какой конкретно и как он реализует саму запись Вас не сильно беспокоит. Т.е. когда Вы скажите: "дай мне объект для записи", Вам можно будет подсунуть любой объект, который как абстракция будет является "перо".

    Когда Вы хотите спать, Вы говорите: "дай мне на что можно лечь". И можно будет лечь хоть на диван, хоть на кровать, хоть на кресло-кровать. Абстрактно это все будет "кровать", но реализацию будет иметь разную.

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

    azerphoenix
    @azerphoenix Куратор тега Spring
    Java Software Engineer
    Доброго дня.
    Соглашусь с коллегой. Вам необходимо константы хранить в properties || yml файле.
    Далее ознакомьтесь с такими аннотациями, как @Value и @ConfigurationProperties
    Ответ написан
    Комментировать
  • Куда и как лучше перенести константу, из сервиса чтобы Spring находил её и подставлял в запрос?

    xez
    @xez
    TL Junior Roo
    Почему бы вам не спросить как это сделать вашего миддла?
    Про проперти можно почитать тут: https://www.baeldung.com/properties-with-spring
    Ответ написан
    Комментировать
  • Как предотвратить закрытие Popup при изменении состояния?

    Alexandroppolus
    @Alexandroppolus
    кодир
    key={uuidv4()}

    Из-за этого все LocationMarker перемонтируются вместо обновления. Попробуй заменить на key={elem}
    Ответ написан
    1 комментарий
  • Какие must have библиотеки для frontend разработчика?

    @Kafkae
    Наверное ты про которые можно назвать утилитарными.
    1) Lodash для работы с данными. Для того чтобы сделать что то сложнее map/foEach. Есть еще ramda.
    2) Moment для работы со в временем. Еще есть более легкий аналог date-fns, просто момент старше.
    3) Numeral для работы с числами.
    4) Bluebird для работы с промисами на стеройдах)
    5) jQuery для работы с DOM. Вообще он не актуален из-за развития нативного js и SPA. Но количество легаси написанного на нём просто запредельное. Огромный плюс также в том, что на нем написано огромное количество плагинов. И если вам нужно быстро запилить лендос со слайдером и еще парочками пердо-свистелками, то jQuery отлично поможет. Ну и он очень быстро учится, так что ради ознакомления по доке можно пробежаться.

    Так-же по по верстке тоже много разных библиотек:
    1) CSS-пре/пост/процессоры (Sass/Less, PostCSS)
    2) CSS-фреймворки (Bootstrap, Materialize, Material UI, Material Design Lite)
    3) Pug - препроцессор для html, будешь набирать html код гораздо быстрее
    4)Ну и куда без BEM, это не библиотека, но сильно упрощает верстку.

    И если сложить Pug + Sass + BEM, то уже можно дробить верстку на компоненты! А это очень важно и ускоряет работу особенно в больших проектах, например для переиспользования в этом проекте или вообще в другом.

    И чтобы все это быстро варилось само по себе можно выучить какой-нибудь сборщик webpack или parcel. Ну или найти готовую сборку!
    Ответ написан
    Комментировать
  • Нормально ли это, что в режиме Strict-mode в React-приложении делается 2 запроса?

    black1277
    @black1277
    Вольный стрелок
    Реакт придерживается концепции "чистых" функций. Т.е. таких функций, которые всегда дают одинаковый, предсказуемый результат при одинаковых входных параметрах. В режиме разработки, с включенным strict-mode реакт помогает выявить непредвиденные эффекты и состояния, возникающие в результате нарушения концепции, вызывая дважды все функции, которые он считает "чистыми". Как это работает?
    Предположим, вы написали функцию, которая по сигналу "свет" - включает свет. Но если свет уже включен - функция его выключает. Вы довольны и счастливы - послали сигнал "свет" - свет включился, послали еще один сигнал "свет" - выключился. Но в режиме strict-mode - вы обнаружите, что свет не включается, потому что реакт шлет второй сигнал "свет", который выключает после первого сигнала! И опять, возникает вопрос - да зачем это нужно? А затем, что вы не можете предсказать результат действия сигнала "свет", не зная текущего состояния! Возникнет острая необходимость - включить свет, а вы не знаете - включен он сейчас или нет... Пошлете сигнал "свет", когда он включен - получите выключение.
    Примерно такие варианты поведения выявляет strict-mode.
    Ответ написан
    Комментировать
  • Люди которые делегируют работу на фрилансе, как вы выбираете исполнителя?

    opium
    @opium
    Просто люблю качественно работать
    плачут колятся со временем формируется команда адекватных исполнителей
    Ответ написан
    Комментировать
  • Люди которые делегируют работу на фрилансе, как вы выбираете исполнителя?

    nki
    @nki
    bezkart.ru готовая система лояльности
    Делегирую бывшим коллегам.
    Ответ написан
    Комментировать
  • Почему inputRef.current=null?

    @wonderingpeanut
    Реф нужно передавать с помощью forwardRef. // upd. я не прав

    useEffect не следит за изменением ref объектов, поэтому он будет вызван один рез при первичном рендере

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

    const [state, setState] = useState(undefined);
    const handleChangeState = (newState) => {
      setState(newState);
    }
    
    return (
      <Component handler={handleChangeState} /> 
    );
    ...
    function Component({handler}) {
      return (
        <input onChange={(e) => handler(e.target.files)} />
    );
    Ответ написан
    Комментировать
  • Как загрузить видео по url у input[type="file"]?

    @zkrvndm
    Софт для автоматизации
    Набросал вам небольшую функцию для вставки файла в поле по ссылке:
    // Функция для вставки файла в поле input:
    
    async function setFile(input, name, url) {
    	try {
    		var blob = await (await fetch(url)).blob();
    		var dt  = new DataTransfer();
    		dt.items.add(new File([blob], name, {type: blob.type}));
    		input.files = dt.files;
    		console.log('Файл успешно вставлен:');
    		console.dir(input.files);
    		return true;
    	}
    	catch(err) {
    		console.log('Ошибка при вставке файла:');
    		console.dir(err);
    		return false;
    	}
    }

    Первым параметром в функцию передаёте ссылку на само поле, вторым параметром желаемое название для файла, а третьим параметром ссылку на файл. Например:
    // Входные параметры:
    var input_element = document.querySelector('input[type="file"]');
    var file_name = 'Мое музло.mp3';
    var file_link = 'https://ваш-сайт.рф/music.mp3';
    
    // Вызовем функцию для вставки файла:
    setFile(input_element, file_name, file_link);

    Работать это будет при условии, что файл находится на том же домене, что и форма с полем. Иными словами, бесполезно вставлять ссылки на сторонние сайты! Поэтому прежде чем вставлять видео, озаботьтесь тем, что загрузить это видео на свой сайт.

    Дополнительная информация
    Также вместе третьего параметра можно передавать не ссылку на файл, а уже сам файл в представлении base64 - это когда файл конвертируется в длинный-длинный зашифрованный текст. Чтобы перегнать какой-нибудь файл в base64, вы можете использовать онлайн сервисы, вам наверное так будет проще всего.

    Только зачем так заморачиваться, если можно просто положить файл внутри своего сайта и при вставке банально указывать ссылку на него?
    Ответ написан
    8 комментариев
  • Как проверить строку на сбалансированность скобок?

    SHVV
    @SHVV
    Ололошки уже три ответа и ни одного правильного.
    function isBalanced(str) {
        // пары открывающих-закрывающих скобок
        var br = "(){}[]";
        // стек открытых скобок
        var st = [];
        // бежим по всей строке
        for (var i = 0; i < str.length; ++i) {
            // текущий символ
            var ch = str[i];
            // ищем символ в скобках
            var ind = br.indexOf(ch);
            // если скобка найдена
            if (ind >= 0) {
                // проверяем, какая это скобка
                if (ind & 1) {
                    // если закрывающая скобка, проверяем стек
                    // стек пуст - плохо
                    if (!st.length) return false;
                    // извлекаем последнюю открытую скобку из стека
                    var last_br = st.pop();
                    // если она не соответствует закрывающей скобке - тоже плохо
                    if (last_br != br[ind - 1]) return false;
                } else { 
                    // открывающую скобку просто пихаем в стек
                    st.push(ch);
                }
            }
        }
        // если после обхода всей строки стек пуст - всё ок
        return !st.length;
    }

    Проверять тут.
    Ответ написан
    2 комментария
  • Применение техник запоминания (мнемотехник) для освоения языков/фреймворков/библиотек/документации?

    @IskanderD
    Послушал подкаст, его автор программист и как я понимаю обучался с помощью мнемотехники - подкаст
    Ответ написан
    Комментировать
  • Как отобразить php файл в ответ на get-запрос в NodeJS?

    @hello_my_name_is_dany
    Backend Developer (Node.js, PHP, C#)
    Если вам очень надо именно рендерить PHP, то можете запускать процесс php about.php и перехватывать стандартный вывод. У вас не будет доступа к информации запроса, но вы можете через аргументы передать нужную вам информацию php about.php firstname lastname

    P.S. Всё же не надо так делать, вы создаёте себе много проблем, а PHP вам ну никак тут не нужен. В конце концов вы можете использовать EJS, если вам нужна супер-пупер логика в темплейте.
    Ответ написан
    Комментировать
  • Неравномерное распределение свободного места между flex-элементами?

    Ankhena
    @Ankhena Куратор тега CSS
    Нежно люблю верстку
    margin-left: auto для мужика
    Ответ написан
    Комментировать
  • Как настроить Webstorm для NodeJS Express?

    @bromzh
    Drugs-driven development
    Можно упростить жизнь

    Да. Можно писать jsdoc, webstorm умеет их анализировать и извлекать типы. Или можно использовать https://flowtype.org/
    Однако, это поможет только для своего кода. Чтобы нормальный автокомплит был и для сторонних либ, можно на вкладке libraries подключить для каждой из библиотек файлы с типами (.d.ts). Вот видео

    Самый лучший вариант - писать всё на TypeScript. А файлы с типами для подключаемых библиотек легко подключаются через npm-модуль typings. При правильной настройке, вебшторм будет подсказывать очень точно.
    Ответ написан
    Комментировать
  • Как в Gimp автоматически выделить целевой слой?

    Попробуйте
    Правка - Параметры - Параметры инструментов
    Поставить галочку "Делать слой или контур активным"

    Это то?
    Ответ написан
    Комментировать
  • Как сделать линии между элементами?

    @plovislov
    Стараюсь стать front-end разработчиком
    Вам нужно, чтобы блоки были по ширине родительского контейнера. Устанавливаете им width: 100% и border-top вместо псевдоэлемента, должно сработать. Я правильно понял проблему?
    Ответ написан
    1 комментарий