👉 @frontendInterview

Читать полностью…

На эти IT-стажировки берут без опыта

В канале собраны самые свежие предложения от крупнейших российских компаний: VK, Сбера, Яндекса и многих других.

Теперь можно не откладывать начало карьеры в IT, ведь здесь вы найдете:
— стажировки для молодых специалистов;
— анонсы хакатонов, которые будут выгодно смотреться в резюме;
— карьерные и образовательные ивенты для прокачки hard и soft skills.

Подписаться

#реклама
О рекламодателе

Читать полностью…

COFFEE

Вам дана строка, которая может содержать слово coffee. Некоторые буквы слова могут быть заглавными. Сделайте все буквы этого слова заглавными и верните строку.

Пример:
Input: "Coffee! Buy me a COFFEE!"
Output: "COFFEE! Buy me a COFFEE!"

👉 @frontendInterview

Читать полностью…

Грокаем функциональное программирование

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

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

👉 @frontendInterview

Читать полностью…

toSpliced()

Метод toSpliced() возвращает новый массив, удаляя определённое количество элементов и/или добавляя новые элементы, начиная с указанного индекса в исходном массиве.

Пример
Создадим массив, удаляя из исходного массива 2 элемента, начиная с элемента с индексом 3:
const months = [
'Май', 'Июнь', 'Июль', 'Август', 'Сентябрь', 'Октябрь'
]
const newMonths = months.toSpliced(3, 2)

console.log(newMonths)
// ['Май', 'Июнь', 'Июль', 'Октябрь']

В отличие от метода splice(), toSpliced() не меняет исходный массив и не возвращает удаляемые элементы:
const numbers = [10, 20, 30, 40]
const newNumbers = numbers.toSpliced(1, 2)
console.log(newNumbers, numbers)
// [10, 40] [10, 20, 30, 40]

// А вот как работает splice()
const deletedNumbers = numbers.splice(1, 2)
console.log(deletedNumbers, numbers)
// [20, 30] [10, 40]

👉 @frontendInterview

Читать полностью…

Запустите рекламу в телеграм-каналах с Яндекс Директом

Перфоманс-реклама теперь в телеграм-каналах ⚡

Яндекс Директ знает, как привлечь целевую аудиторию 💰👌

Попробовать

#реклама
yandex.ru
О рекламодателе

Читать полностью…

Как размыть текст?

Для размытия содержимого элемента, включая текст, применяется стилевое свойство filter с функцией blur(). Внутри функции указываем степень размытия (например, 5px) — чем больше значение, тем сильнее будет размытие.
div { filter: blur(5px); }

Ещё один способ размытия текста — это использование свойства text-shadow, добавляющее к тексту тень. В параметрах свойства можно регулировать степень размытия тени (здесь это третий параметр), добиваясь нужного эффекта.
div { text-shadow: 0 0 5px #000; color: transparent; }
Поскольку тень располагается за текстом, сам текст не меняется при наложении тени и сохраняет свою читаемость. Поэтому текст следует спрятать, задав ему прозрачный цвет через значение transparent.

👉 @frontendInterview

Читать полностью…

Курс «Разработчик 1С» от Яндекса.

За 6 месяцев освоите один из самых простых языков программирования и пройдёте стажировку


Зарегистрироваться

#реклама 16+
practicum.yandex.ru
О рекламодателе

Читать полностью…

Как найти работу за рубежом?

Международные стартапы с русскоговорящими командами – один из эффективных способов получить оффер.

Вакансии именно в таких компаниях собирают ребята в канале Dev & ML Connectable Jobs.
Как результат – уже десятки читателей получили офферы в Neon, InDrive, 1inch, Wheely и в PLATA.

Несколько актуальных вакансий:
– Senior Frontend Engineer в Activeloop (remote)
– Senior Frontend Developer в JetBrains (Германия, Кипр, Армения, Чехия, Сербия)
– Senior Frontend Developer в Playkot (remote или помогают с релокацией в Сербию / на Кипр)
– Frontend Engineer в BostonGene (Ереван, помогают с релокацией)

Подписывайтесь и развивайте карьеру в будущем единороге!💙

Читать полностью…

Блистательный Agile. Гибкое управление проектами с помощью Agile, Scrum и Kanban

Что такое гибкое управление проектами? Нужно ли оно вашему проекту? Будет ли от этого выгода? Хотите разобраться, как работает гибкое управление проектами и воспользоваться этим мощным подходом? Тогда вы выбрали правильную книгу. «Блистательный Agile» – это не очередной рассказ о методах и процессах, основное внимание уделено реальным примерам использования Agile в бизнес-средах.

👉 @frontendInterview

Читать полностью…

Реклама для бизнеса любого уровня в Яндекс Директе

Создайте эффективную рекламную кампанию с алгоритмами Яндекс Директа 👌

Начните прямо сейчас ⚡

Зарегистрироваться

#реклама
direct.yandex.ru
О рекламодателе

Читать полностью…

Наглядное пособие по горячим клавишам

👉 @frontendInterview

Читать полностью…

📚 Здесь собраны все вопросы, которые могут спросить на собеседовании. Теперь можно легко получить оффер, подготовившись к самым популярным вопросам. Просто выбери своё направление:

1. Frontend / JavaScript
2. Python
3. Java
4. Тестировщик QA
5. Data Science
6. DevOps
7. C#
8. С/C++
9. Golang
10. PHP
11. Kotlin
12. Swift

Читать полностью…

Запустите рекламу в телеграм-каналах с Яндекс Директом

Перфоманс-реклама теперь в телеграм-каналах ⚡

Яндекс Директ знает, как привлечь целевую аудиторию 💰👌

Попробовать

#реклама
yandex.ru
О рекламодателе

Читать полностью…

🔥Тесты для подготовки к собеседованию🔥
Выбери своё направление:

1. Frontend
2. Python
3. Java
4. Тестировщик QA
5. Data Science
6. DevOps
7. C#
8. С/C++
9. Golang
10. PHP
11. Kotlin
12. Swift

Читать полностью…

☄️ Горячая акция для IT-специалистов на дизайн и ремонт квартиры!

RE Design Buro создаем дизайн-проекты и реализуем их в жизнь более 15 лет ⭐️

За это время сделали уже 450+ проектов и ремонтов в Москве и области 🏆

Коротко о компании:

⭐️ работают не бригады, а узкие специалисты: плиточники, электрики, сантехники т.д.
⭐️ 6 месяцев средний срок ремонта.
⭐️ рейтинг выполненных ремонтов - 4.9.
⭐️ все цены и сроки фиксируем в договоре.
⭐️ оплата разбивается частями по факту сдачи работ.

💥 Только для специалистов IT-индустрии - скидка 10% на дизайн и ремонт от компании RE Design Buro

‼️ Важное условие — вы работаете в IT-компании, которая получила аккредитацию Минцифры РФ

👉 Наши работы
👉 Мы в Телеграм
👉 Связаться с нами
👉 Консультация дизайнера БЕСПЛАТНО
👉 Получить сметный расчёт стоимости ремонта

Читать полностью…

​Для чего используется WebSocket? В чем принцип его работы?

Протокол WebSocket («веб-сокет»), описанный в спецификации RFC 6455, обеспечивает возможность обмена данными между браузером и сервером через постоянное соединение. Данные передаются по нему в обоих направлениях в виде «пакетов», без разрыва соединения и дополнительных HTTP-запросов.

Чтобы открыть веб-сокет-соединение, нам нужно создать объект new WebSocket, указав в url-адресе специальный протокол ws:
let socket = new WebSocket("ws://javascript.info");


Как только объект WebSocket создан, мы должны слушать его события. Их всего 4:
- open – соединение установлено,
- message – получены данные,
- error – ошибка,
- close – соединение закрыто.

Вот пример:

  let socket = new WebSocket("wss://javascript.info/article/websocket/demo/hello");
  
  socket.onopen = function(e) {
    alert("[open] Соединение установлено");
    alert("Отправляем данные на сервер");
    socket.send("Меня зовут Джон");
  };
  
  socket.onmessage = function(event) {
    alert(`[message] Данные получены с сервера: ${event.data}`);
  };
  
  socket.onclose = function(event) {
    if (event.wasClean) {
      alert(`[close] Соединение закрыто чисто, код=${event.code} причина=${event.reason}`);
    } else {
      // например, сервер убил процесс или сеть недоступна
      // обычно в этом случае event.code 1006
      alert('[close] Соединение прервано');
    }
  };
  
  socket.onerror = function(error) {
    alert(`[error] ${error.message}`);
  };

Вызов socket.send(body) принимает body в виде строки или любом бинарном формате включая Blob, ArrayBuffer и другие. Дополнительных настроек не требуется, просто отправляем в любом формате. При получении данных, текст всегда поступает в виде строки. А для бинарных данных мы можем выбрать один из двух форматов: Blob или ArrayBuffer.

👉 @frontendInterview

Читать полностью…

👩‍💻 Программирование теперь в телеграм!

Вот обширная база материалов, которая ежедневно обновляется, выбирай своё направление:

Обучение JavaScript с нуля
Обучение Python с нуля
Обучение Java с нуля
Обучение HTML/CSS с нуля
Обучение C/С++ с нуля
Обучение С# с нуля
Обучение SQL/GO/PHP с нуля
Обучение Kotlin/Swift с нуля

⛓ Курсы, книги, шпаргалки, статьи, видео ресурсы — всё собрано в одном месте: @roadmap_ready

Читать полностью…

ТОП-4 Курса по веб-дизайну по версии Tutortop

Tutortop — маркетплейс курсов №1 по количеству школ-партнеров, курсов и реальных отзывов студентов.

Освойте востребованную профессию с нуля за 4-5 месяцев.
Соберите портфолио из 10+ проектов.
Выйдите на заработок 100 000₽+ и работайте удаленно в гибком графике.


Выбрать

#реклама 16+
tutortop.ru
О рекламодателе

Читать полностью…

А потом он все доделал и закрыл таск, но это уже совсем другая история...

👉 @frontendInterview

Читать полностью…

Почему умение дебажить один из самых важных навыков для разработчика

Навык отладки — один из самых важных для разработчика. Мы каждый день сталкиваемся с проблемами в ходе разработки и не всегда решение проблемы можно найти на StackOverflow или в открытых источниках. Но опция, которую мы имеем всегда — это возможность отладить наше приложение, найти корень проблемы и решить её системно. Конечно, бывают случаи когда мы находим корень проблемы, но понимаем, что текущими ресурсами и средствами решить её не можем. В таком случае мы хотя бы имеем возможность осознанно выбрать обходные пути.

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

👉 @frontendInterview

Читать полностью…

👉 @frontendInterview

Читать полностью…

​Делегирование событий

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

На примере меню
Делегирование событий позволяет удобно организовывать деревья и вложенные меню.

 <ul id="menu">
   <li><a href="/php">PHP</a></li>
   <li><a href="/html">HTML</a></li>
   <li><a href="/javascript">JavaScript</a></li>
   <li><a href="/flash">Flash</a></li>
 </ul>

Клики по пунктам меню будем обрабатывать при помощи JavaScript. Пунктов меню в примере всего несколько, но может быть и много. Конечно, можно назначить каждому пункту свой персональный onclick-обработчик, но что если пунктов 50, 100, или больше? Неужели нужно создавать столько обработчиков? Конечно же, нет!

Применим делегирование: назначим один обработчик для всего меню, а в нём уже разберёмся, где именно был клик и обработаем его:
// 1. вешаем обработчик
document.getElementById('menu').onclick = function(e) {

// 2. получаем event.target
var event = e || window.event;
var target = event.target || event.srcElement;

// 3. проверим, интересует ли нас этот клик?
// если клик был не на ссылке, то нет
if (target.tagName != 'A') return;

// обработать клик по ссылке
var href = target.getAttribute('href');
alert(href); // в данном примере просто выводим
return false;
};

👉 @frontendInterview

Читать полностью…

Calculate age in years

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

Примеры:
getAge(new Date('1913/01/01'), new Date('2013/01/01') === 100
getAge(new Date('2008/02/29'), new Date('2032/03/01')) === 24
getAge(new Date('2008/01/01'), new Date('2000/01/01')) === -8

👉 @frontendInterview

Читать полностью…

🤘 Пройди хардкорный тест по JavaScript+Angular

✔️ Ответь на 20 вопросов и проверь свои знания. Сможешь сдать — пройдёшь на продвинутый курс "Angular Developer".

⛔️ТЕСТ СМОГЛИ ПРОЙТИ ТОЛЬКО 40% УЧАСТНИКОВ

⏰ Время прохождения теста ограничено 25 минут

✍️ПРОЙТИ ТЕСТ: https://otus.pw/9kw1/

💣 Пройдете тест и получите:
✔️ Живое общение с экспертами
✔️ Лучшие открытые уроки прошлых наборов курса
✔️ Продвинутые темы и практика на «боевых» задачах уровня Middle+
✔️ Скидку на прохождение онлайн курса «Angular Developer»

Реклама. ООО «Отус онлайн-образование», ОГРН 1177746618576, www.otus.ru erid 2SDnjc2k5Hk

Читать полностью…

Почему вместо кириллического текста выводятся ромбики?

Иногда при отображении в браузере веб-страницы вместо текста можно наблюдать ромбики или другие символы. Но совсем не тот текст, который мы ожидаем

Такое происходит при сохранении файла в неверной кодировке, например, в ANSI. Недостаточно добавить <meta charset="utf-8"> в код, нужно чтобы и сам HTML-файл был сохранён в кодировке UTF-8. Для этого следует использовать редакторы, которые поддерживают разные кодировки и могут преобразовать текст из одной кодировки в другую. К примеру, в популярном редакторе Notepad++ под Windows для нужной кодировки следует выбрать меню Кодировки > Преобразовать в UTF-8

👉 @frontendInterview

Читать полностью…

Очная онлайн-магистратура ИТМО: станьте DevOps-инженером

Онлайн-магистратура «DevOps-инженер облачных сервисов» от Яндекс Практикум

Вы сможете работать DevOps-инженером или SRE в крупных IT-компаниях
В магистратуре вы глубоко погрузитесь в программирование и научитесь создавать стабильную облачную инфраструктуру.

А ещё будете заниматься английским, чтобы было проще устроиться в международную компанию.

Фундаментальные знания, льготы очного студента и практический опыт Яндекса

Подать заявку

#реклама 16+
practicum.yandex.ru
О рекламодателе

Читать полностью…

Чем заменить JetBrains: решение для российских разработчиков от СберТеха

СберТех представил среду разработки GIGA IDE со встроенным AI-ассистентом*, что особенно актуально для российских разработчиков в свете последних новостей. GIGA IDE может стать альтернативой IntelliJ IDEA от JetBrains, которая оказалась заблокирована для российских пользователей. Среда позволяет вести разработку на популярных языках программирования, обеспечивает совместимость с востребованными плагинами и привычный пользовательский опыт.

· GIGA IDE Desktop пользователи уже могут скачать на платформе GitVerse. Это интегрированная среда разработки, которая включает 70 инструментов для облегчения задач разработки, автоматизации тестирования и администрирования приложений.

· GIGA IDE Cloud позволит вести разработку в облаке, расширив возможности устройства дополнительными облачными ресурсами. Записаться на раннее тестирование GIGA IDE Cloud.

*AI (Artificial Intelligence) - искусственный интеллект

Читать полностью…

Перед тем, как выбрать оффер, пойми себя

Представьте, что вам нужно решить, сменить работу или остаться. Какую компанию выберете? Ту, где платят больше?

Если бы только оклад решал, все бы хотели в компанию А, а в компанию Б никто бы не шёл. Но кто-то выбирает крипту, а кто-то госорганизацию. Как не оказаться случайно в стартапе, если вы хотите стабильности на годы — попробуем ответить в статье. Обойдусь без коучинга, мы научимся определять, что важно для нас, любимых.

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

👉 @frontendInterview

Читать полностью…

​Как увеличить картинку при наведении?

За изменение масштаба изображения отвечает свойство transform с функцией scale(). В качестве её значения указывается число больше 1 для увеличения масштаба и меньше 1 — для уменьшения масштаба. К примеру, число 1.2 увеличивает масштаб на 20%.
Чтобы картинка увеличивалась при наведении на неё курсора мыши, свойство transform следует привязать к псевдоклассу :hover
.scale {
transition: 1s; /* Время эффекта */
}
.scale:hover {
transform: scale(1.2); /* Увеличиваем масштаб */
}

Если требуется масштабировать картинку, не увеличивая при этом её размеры, то каждое изображение надо поместить в <div>. Для него задать свойство display со значением inline-block, чтобы <div> стал размером с изображение; а также overflow со значением hidden, чтобы пряталось всё за пределами <div>
.scale {
display: inline-block; /* Строчно-блочный элемент */
overflow: hidden; /* Скрываем всё за контуром */
}
.scale img {
transition: 1s; /* Время эффекта */
display: block; /* Убираем небольшой отступ снизу */
}
.scale img:hover {
transform: scale(1.2); /* Увеличиваем масштаб */
}

👉 @frontendInterview

Читать полностью…