Логово верстальщика

Офер в Яндекс для опытных фронтендеров за два дня 24–25 августа приглашаем фронтендеров с опытом работы от четырёх лет получить офер в Яндекс через multitrack за 2 дня. Достаточно решить задачи онлайн до 20 августа и пройти несколько технических секций 24 августа, чтобы уже 25-го получить офер и выбрать три команды, к которым вам было бы интересно присоединиться. Как правило, за несколько собеседований сложно понять, подходит ли вам команда и наоборот. Multitrack позволит вам поработать в трёх разных командах Яндекса и выбрать подходящую. Вы сможете погрузиться в рабочие процессы, познакомиться с будущими коллегами и понять, с какими задачами и технологиями хотите работать. Узнать подробности и зарегистрироваться. Реклама. ООО "Яндекс". ИНН 7736207543

🔝 Самые интересные статьи за последние дни: • TypeScript + React: путь к идеально типизированному коду • Магия CSS на практике: советы по вёрстке от гика. Часть 2 • Простые приёмы, которые сделают ваш код нагляднее • Собеседование в энтерпрайз • Получаем белый IP с помощью VDS за копейки

👩‍💻 Convert string to camel case Завершите метод/функцию таким образом, чтобы она преобразовала слова, разделенные тире или подчеркиванием, в camel casing. Первое слово в выходных данных должно быть заглавным только в том случае, если исходное слово было заглавным. Следующие слова всегда должны быть написаны с заглавной буквы. Пример кода:

"the-stealth-warrior" gets converted to "theStealthWarrior"
"The_Stealth_Warrior" gets converted to "TheStealthWarrior"

Решение задачи🔽

function toCamelCase(str) { return str.replace(/[-_](.)/g, (_, char) => char.toUpperCase()); } // Примеры использования console.log(toCamelCase("the-stealth-warrior")); // "theStealthWarrior" console.log(toCamelCase("The_Stealth_Warrior")); // "TheStealthWarrior"

👩‍💻 Неожиданные особенности JavaScript JavaScript — сложный язык со множеством неожиданных вывертов. В этой статье мы рассмотрим особенности JavaScript, способные по-настоящему озадачить. Читать...

👩‍💻 Как оптимизировать дорогостоящие CSS-свойства Некоторые свойства CSS более затратны, чем другие, с точки зрения производительности. При неправильном использовании они могут замедлить работу вашей веб-страницы и сделать ее менее отзывчивой для пользователей. Читать...

👩‍💻 Основные различия между React.js и React Native Раскройте для себя уникальные аспекты двух мощных технологий - React.js и React Native. Это позволит вам в полной мере оценить потенциал универсальной React-библиотеки. Кроме того, вы узнаете, легко ли веб-разработчику React освоить разработку React Native. Читать...

👩‍💻 Download the Matrix Крайне стильная кнопка скачивания с анимацией при нажатии. Сделана на SVG, CSS и JavaScript. Открыть код...

👩‍💻 Доступный автокомплит с нуля на JavaScript Руководство по созданию компонента автодополнения с учетом всех требований доступности. Читать...

💥 17 убийственных сайтов для веб-разработчиков Хранение под рукой полезных сайтов – хороший способ повышения производительности труда для дизайнера или веб-разработчика. Разберем некоторые из лучших инструментов, способных уменьшить объем вашей повседневной рутины. Читать...

Псс… свободы н-н-нада? Освойте профессию разработчика на Java — и можете работать хоть с вершины Эвереста. Лишь бы интернет ловил ツ А если не уверены, что именно язык Java «ваш», то добро пожаловать на подготовительный курс «Java-разработчик» от онлайн-школы Хекслет. Здесь вам и 62 онлайн-урока, и 4 живых вебинара, и море практики (пока только практики, теплое Средиземное будет позже). На все это вам будет отведено 2 недели и 1 наставник-эксперт, который поможет справиться с трудностями. Цена вопроса — 990 рублей. ⏰ Cтарт уже 6 августа!

🔝 Самые интересные статьи за последние дни: • JavaScript в гугл-таблицах: скрипты для расчета мультивалютной корзины • Реализация доступности веб-приложений с помощью Flutter • Мой ТОП-5 лучших CSS-in-JS решений • Лучшие открытые курсы для изучения PHP с нуля • Как создать бесшовную текстуру на angular без инструкций и примеров

👩‍💻 Крестики-нолики В этом задании наша цель — написать функцию, которая проверяет игру крестики-нолики на выирыш. Предположим, что поле для игры представлено в виде массива 3x3, где значение равно 0, если ячейка пуста, 1, если это «X», и 2, если это «O», Пример кода:

isSolved([[0,0,1],
          [0,1,2],
          [2,1,0]]) => -1

Мы хотим, чтобы наша функция возвращала: -1, если есть пустые места, 1, если "X" выиграли, 2, если "О" выиграли, 0, если это ничья. Решение задачи🔽

function isSolved(board) { const checkLine = (a, b, c) => { if (a === b && b === c) { return a; } return 0; }; // Проверка всех строк for (let i = 0; i < 3; i++) { const result = checkLine(board[i][0], board[i][1], board[i][2]); if (result !== 0) return result; } // Проверка всех столбцов for (let i = 0; i < 3; i++) { const result = checkLine(board[0][i], board[1][i], board[2][i]); if (result !== 0) return result; } // Проверка диагоналей let result = checkLine(board[0][0], board[1][1], board[2][2]); if (result !== 0) return result; result = checkLine(board[0][2], board[1][1], board[2][0]); if (result !== 0) return result; // Проверка на наличие пустых клеток for (let i = 0; i < 3; i++) { for (let j = 0; j < 3; j++) { if (board[i][j] === 0) return -1; } } // Если нет выигрыша и нет пустых клеток, то это ничья return 0; } // Примеры использования: console.log(isSolved([[0,0,1], [0,1,2], [2,1,0]])); // -1 console.log(isSolved([[1,1,1], [0,1,2], [2,1,0]])); // 1 console.log(isSolved([[2,2,2], [0,1,2], [2,1,0]])); // 2 console.log(isSolved([[1,2,1], [2,1,2], [2,1,1]])); // 0

🆚 6 фич, которые реализованы во Vue лучше, чем в React Рассказываем, почему Vue не только не уступает самому популярному инструменту для разработки фронтенда, но и во многом его превосходит. Читать...

👩‍💻 Fancy Glowing Button Крутая кнопка с RGB подсветкой и эффектом при наведении. Сделана на чистом CSS. Открыть код...

AvitoTech выпустили бесплатный видеокурс по JavaScript, и четвёртый эпизод уже доступен к просмотру. В новом выпуске вы узнаете про устройство и размер памяти программы, стек и кучу, Oddball и иммутабельные примитивы. Это поможет создавать эффективные программы, которые оптимально используют память. Не забудьте подписаться на канал, чтобы не пропустить следующие выпуски.

🚀 17 незаменимых веб-приложений для ускорения работы над проектом Собрали лучшие веб-приложения для работы с изображениями, логотипами, анимацией, шрифтами, README-файлами и многим другим. Читать...

👩‍💻 6 ключевых шаблонов проектирования в React Применение правильных паттернов проектирования – это залог создания надежных, эффективных и масштабируемых React-приложений. Вот шаблоны, которые необходимо освоить в первую очередь. Читать...

🔝 Самые интересные статьи за последние дни: • CSS-классы вредны • Как узнать количество перерисовок? React Custom Hook: useRenderCount • Как добавить кэширование в ваше React приложение • Как компилировать json или история оптимизации python сервиса • Web components как альтернатива iframe на примере Angular-компонентов

⚙️ Чистая архитектура фронтенда Принципы и методы, такие как SOLID, KISS, DRY и DDD, помогут разработать более чистую архитектуру фронтенда. Следование правилам создания компонентов с учетом бизнес-логики обеспечит предсказуемую поддержку кода. Читать...

🖥 15 сайтов для экономии времени разработчика Хотите больше времени на новые интересные задачи, решение сложных проблем или просто уходить с работы вовремя? Эти 15 сайтов помогут вам существенно ускорить процесс разработки. Читать...