Senior Frontend - javascript, html, css

Living Words Сцена реализована на HTML и CSS. Слова добавляются через JS. 👉 @seniorFront

«Кем Вы видите себя через 5 лет», или HRско-русский разговорник Вас спрашивали «Кем Вы видите себя через 5 лет»? Меня тоже. За двадцать пять лет в IT я понял, зачем они так делают. Понял – это значит, что я «привык и научился пользоваться» (С). Но «неприятно удивлять» они меня не перестали. Публикую свой личный русско-HRский разговорник. Он вряд ли поменяет ваше отношение к HRскому языку, но проходить собеседования вы будете проще и эффективнее. 👉 @seniorFront

🔧Хотите научиться создавать собственные, повторно используемые компоненты для веб-приложений? Откройте для себя мощь веб-компонентов и Shadow DOM! На открытом уроке вы узнаете: ▸ Как создавать изолированные UI-компоненты с помощью чистого JavaScript, ▸ Как использовать их в любых проектах, независимо от фреймворка, ▸ Сравнение веб-компонентов и React-компонентов — плюсы и минусы каждого подхода. 🔹 Узнайте, как быстро разрабатывать универсальные компоненты для интерфейсов, которые легко интегрируются в любые веб-приложения. Вы получите практические знания по созданию UI-kit с нуля и сможете использовать их в реальных проектах. 🎓Урок пройдет в преддверие старта курса «Fullstack Developer» 📅 Встречаемся 28 мая в 20:00 МСК. ➡️ Регистрация открыта: https://vk.cc/cMl6NE Erid 2SDnjcywp3f Реклама. ООО «Отус онлайн-образование», ОГРН 1177746618576, www.otus.ru

​Почему микро-сервисы редко взлетают? Потому, что микро-сервисы часто оказываются не «микро», а «нано» сервисами. «Микро» — это не «нано», микро-сервисы устроены иначе. Не скажу, что знаю рецепт хорошего микро-сервиса. Но я постараюсь показать, каким он точно не должен быть. Давайте дадим определение микро-сервису через аналогию: микро-сервис — как блюдо. Про него можно сказать следующее: - Блюдо изолировано: каждое находится в свой тарелке. Или, если хотите, в контейнере. - Блюда имеют ограниченный контекст. Плов — это плов, его не мешают с фруктами. Потребитель получает то, за что платит по меню. - Блюда слабо связаны между собой. После тарелки любого супа можно взять любой гарнир. А можно и не брать. Бывают, конечно, ограничения: не стоит запивать селедку молоком. Но это — исключение. - Блюда масштабируются. Мало одной котлеты — можно съесть две. - Блюда легко тестируются. Их можно дегустировать по-отдельности. - Блюда индивидуально конфигурируются. Можно взять борщ с пампушкой, можно — без. По описанию получилось вполне съедобно, не так ли? Так почему же внедрение микро-сервисов так редко заканчивается успехом? Я не буду разглагольствовать про неверное разграничение контекста и другие пороки. Про них и так много сказано. Сфокусируюсь на одном. Корень проблемы — неверная область использования микро-сервисов. Микро-сервисы применяются не там и не так. Микро-сервисы задумывались как альтернатива монолиту, который пилят десятки разработчиков. А сейчас все работают по Agile, команды маленькие. Работают или над своим небольшим продуктом, или над частью общего продукта компании. Продукт (часть продукта) уже имеет изолированный контекст и слабые зависимости. С другими продуктами (частями) общается по API. Имеет свой технологический стек. Владеет отдельным хранилищем (базой). Независимо разворачивается. И даже имеет свою команду «на две пиццы». По совокупности признаков, он уже микро-сервис! Продукт является готовым блюдом для потребителей. Но нет! Каждая команда считает свой салатик монолитом. И поэтому берет, и делит на микро-сервисы. Что же у нее получается в итоге? Правильно: нано-сервисы! Вместо того чтобы смешать все ингредиенты и приготовить блюдо, команда любовно расфасовывает ингредиенты по контейнерам. Но все-таки салат — это не то же самое, что запчасти для салата. Если вам вместо трех блюд подадут тридцать ингредиентов в отдельных тарелочках, думаю, вы вряд ли посчитаете это хорошим обслуживанием. Готовьте микро-сервисы правильно. Многие компании целиком поражены болезнью чрезмерной декомпозиции. То и дело говорят: «у нас 30 команд и 1500+ микро-сервисов». И ведь искренне еще гордятся этим! Забывая рассказать про свои затраты на инфраструктуру. Рассказать, что новый разработчик до полугода погружается в эти сервисы. Что локализация обычного бага занимает у него неделю. После всего сказанного позволю себе один совет: Не дробите ваш маленький продукт на нано-сервисы. Это его убьёт. Он хороший. Дайте ему шанс повзрослеть. 👉 @seniorFront

Получи грант до 1,2 млн руб. на обучение в магистратуре Хочешь развиваться в сфере ИТ и получить фундаментальные знания с практикой? Поступай в магистратуру Центрального университета! - 4 офлайн программы по востребованным направлениям ИТ - Онлайн-программа по машинному обучению - 300 мест с грантами до 1,2 млн руб. - Вечерние занятия и учеба по выходным — удобно совмещать с работой - Обучение по модели STEM-образования: на стыке науки, технологий и бизнеса - Возможность стажировок и трудоустройства в ведущих компаниях - Государственный диплом за 2 года Магистратура в Центральном университете — это современный подход к образованию, сильный преподавательский состав и актуальные кейсы от индустрии. Оставляй заявку на грант уже сейчас! Подать заявку #реклама 16+ apply.centraluniversity.ru О рекламодателе

Additive fireflies Частицы генерируются и анимируются в JS. 👉 @seniorFront

​Что такое прототипное наследование? Это механизм, с помощью которого объекты могут наследовать свойства и методы от других объектов. Это одна из основных особенностей языка JavaScript, отличающая его от классических моделей наследования, используемых во многих других языках программирования. Как это работает Каждый объект имеет специальное скрытое свойство [[Prototype]] (как правило, доступное как proto или через Object.getPrototypeOf()), которое ссылается на другой объект — его прототип. Когда вы пытаетесь получить доступ к свойству или методу объекта, и это свойство/метод не найдено в самом объекте, поиск продолжается по цепочке прототипов, пока свойство/метод не будет найден или не будет достигнут конец цепочки прототипов (прототип null). Пример:

let animal = {
  eats: true,
  walk() {
    console.log("Animal walk");
  }
};

let rabbit = {
  jumps: true,
  proto: animal
};

rabbit.walk(); // Animal walk
console.log(rabbit.eats); // true

В этом примере объект rabbit наследует свойство eats и метод walk от объекта animal через прототипную цепочку. Основные принципы - Прототипная цепочка: Когда вы обращаетесь к свойству объекта, автоматически ищет это свойство в объекте, а затем — в его прототипах, пока не достигнет конца цепочки прототипов. - Object.prototype: В вершине прототипной цепочки находится Object.prototype. Он не имеет прототипа и содержит методы, доступные всем объектам, такие как toString(), hasOwnProperty() и другие. - Создание объектов с определённым прототипом: Для создания объектов с указанием прототипа можно использовать Object.create(proto), где proto — объект, который должен стать прототипом для нового объекта. Отличия от классического наследования В отличие от него, прототипное наследование не использует классы как таковые (до введения class в ES6, которые являются "синтаксическим сахаром" над прототипным наследованием). Вместо этого объекты напрямую наследуют свойства и методы от других объектов. 👉 @seniorFront

Высшее образование дистанционно от 6700 ₽/мес. Поступи в Московский технологический институт в мае! — Высшее образование в московском вузе без выезда на сессии. — Полностью дистанционный онлайн-формат. — Обучайся дома, на работе, в путешествии. — Диплом государственного образца. — 73 направления и программы обучения. — Программа колледж + вуз без ЕГЭ. Скидка 10% на платное обучение при оплате за год. Подать заявку #реклама 16+ mti-vuz.ru О рекламодателе

Чистый код — красивая архитектура. А работает ли это? Вы пишете код не для компилятора — он съест любую абракадабру, если синтаксис верен. Вы пишете для людей, для того парня из соседнего отдела, который будет разбирать ваш код через полгода. Для себя, когда забудете, о чём думали в момент написания. Для тимлида, у которого нет времени расшифровывать ваши «фичи», замаскированные под техдолг. Грязный код — это про непонятные переменные, запутанные модули и решения «на скорую руку». Вас ждёт после такого потеря во времени и в лучшем случае косые взгляды коллег. К сожалению, непонятный код часто пишут не только из-за спешки, но и из-за неопытности и чрезмерного энтузиазма тех, кто хочет всё переделать. Давайте разберём, как превратить кошмар в конфетку — детали внутри. 👉 @seniorFront

Is a number prime? Создайте функцию, которая принимает целочисленный аргумент и возвращает логическое значение true или false в зависимости от того, является ли это целое число простым. Согласно Википедии, простое число (или прайм) - это натуральное число больше 1, которое не имеет положительных делителей, кроме 1 и самого себя. Требования - Вы можете предположить, что вам будет задано целое число. - Вы не можете предполагать, что это целое число будет только положительным. Вам могут быть даны и отрицательные числа ( или 0 ). - Замечание по производительности: Не требуется никаких причудливых оптимизаций, но все же самые тривиальные решения могут выходить из строя. Числа доходят до 2^31 ( или аналогично, в зависимости от языка ). Циклы до n или n/2 будут слишком медленными. Пример

is_prime(1) /* false */
is_prime(2) /* true */
is_prime(-1) /* false */

👉 @seniorFront

CSS 3D Bending Effect Реализовано и анимировано на чистом CSS. 👉 @seniorFront

Stunning CSS SVG Animation Effects В этом видео создается SVG картинка, которая затем анимируется в CSS. 👉 @seniorFront

Card Carousel Создано на HTML и CSS. Логика работы слайдера создана библиотекой Swiper. 👉 @seniorFront

LetterMorph Вся сцена - это SVG картинка, анимированная библиотекой gsap. 👉 @seniorFront

Курсы JAVA-разработки Гарантия ЗП от 120 000р в договоре Jаvа — это язык, на котором строятся банковские системы, мобильные приложения, крупные веб-сервисы и многое другое, а спрос на Jаvа-разработчиков стабильно высок. Благодаря кроссплатформенности и надежности, ты сможешь работать в любой сфере IТ — от финансов до Коммерческой отрасли.📊💰 Почему это работает?✨ - Минимальные вложения. - Тысячи человек уже в IТ. Наши выпускники работают в крутых компаниях: от стартапов до международных корпораций. - Наши менторы — это опытные разработчики, которые ежедневно работают в IТ и готовы делиться актуальными знаниями. P.S. Если всё ещё сомневаешься и думаешь что будет сложно — просто попробуй.😊 Мы берем на себя все риски: ты оплачиваешь основную стоимость обучения только после успешного трудоустройства — это закреплено в договоре. Подать заявку #реклама 16+ kata.academy О рекламодателе

Встречаемся 3 июня на Frontend meetup! Пойдём в московский офис Авито, чтоб послушать спикеров, понетворкать и обсудить, как: ☑️ внедрять Suspense SSR Architecture в проекты на React; ☑️ генерировать реактивные модели из GraphQL-схем; ☑️ интегрировать зависимости (DI) через библиотеку tsyringe. Кстати, обещают ещё секретный и максимально крутой доклад! Регистрация тут.

Microsoft: наши передовые ИИ-компьютеры изменят мир Microsoft Word: 👉 @seniorFront

Amazing Pixel Button Effects В этом видео создается пиксельный фон на кнопке при наведении на CSS и JS. 👉 @seniorFront

Ошибка при строительстве — может стоить 1 000 000 рублей! Неудачный проект, скрытые недоработки подрядчика и другое — всё это легко избежать, если знать про строительство чуть больше. В @systemhouse показываем наши реальные объекты(некоторые на этапе строительства), делимся пошаговыми инструкциями по взаимодействию с недобросовестной компанией и примерами домов, в которых уже живут семьи. ✅ Учим отличать надежного подрядчика от недобросовестного. ✅ Рассказываем, как выбрать проект дома под нужды семьи. ✅ Даём советы по ипотеке, если вы на старте. ➡️ Подпишитесь и получите доступ к материалам от экспертов с 18-летним опытом строительства загородных домов!