Frontender's notes. Страница 10

​​🤔Микрофронтенды — универсальное решение всех проблем или просто удобный подход В этой статье автор расскажет, зачем нам микрофронтенды, если есть микросервисы или монолит, и стоит ли тащить микрофронтенды в свой проект только потому, что это модно, а также вы узнаете о трёх способах организации микрофронтендов: Podium, Single-SPA и Module Federation. Читать...

​​Микросервисы — популярный способ создания и поддержки современных веб-сервисов. Развиваетесь в веб-разработке? Узнайте, как создавать микросервисы при помощи NodeJS и GRPC 18 мая в 20:00 состоится вебинар «NodeJS + Microservices». За 1,5 часа вы узнаете, как создавать микросервисы с использованием протокола gRPC. На занятии мы разберем: — Плюсы и минусы микросервисного подхода — Как мигрировать монолит на микросервисы — Решение на базе NodeJS + протокола GRPC. В результате у вас будет база для создания своего микросервиса на NodeJS. Открытый урок бесплатный и состоится в рамках онлайн-курса «Node.js Developer» в OTUS. Продолжить обучение вы сможете уже на курсе, на него действуют разные способы оплаты.  Для участия пройдите вступительный тест https://otus.pw/VDUh/ Нативная интеграция. Информация о продукте www.otus.ru

​​⚡️Кешируем API ответы для frontend приложения с помощью Yakbak В этой статье автор расскажет, почему для создания кеширующей прослойки можно воспользоваться библиотекой yakbak, слегка обогатив её новой хеширующей функцией, и почему если немного попользоваться таким решением, то приходит понимание, что лучше использовать читабельные названия файлов, а также вы узнаете почему API запросы идут на локальный прокси, расположенный по адресу localhost:4200, а оттуда уже на гитхаб. Читать...

​​👨‍💻Архитектура frontend приложений — react, react native, angular В этой статье автор расскажет, почему структура и правила не должны зависеть от бизнес логики проекта, и как сделать так, чтобы при разделении на модули все компоненты и логика находилися рядом друг с другом, а также вы узнаете почему основой для разделения проекта на компоненты является не их техническое происхождение, а бизнес логика. Читать...

​​🧐Устраняем недостаток микрофронтендов: четыре способа коммуникации между frontend-приложениями В этой статье автор расскажет, как для коммуникации между абсолютно не несвязанными приложениями можно использовать iFrame, и почему при передаче данных между frontend-приложениями, которые находятся на разных доменах, у iFrame практически нет альтернатив, а также вы узнаете как CustomEvent API позволяет разработчикам не только создавать кастомные события, но и инициировать их на элементах DOM, передавая данные по цепочке. Читать...

​​🚀Путь во Frontend 2023: проблемы и ловушки В этой статье автор расскажет, почему зная JavaScript, вы легко сможете освоить многие другие языки, намного легче, чем вам пришлось изучать JS, и как можно найти более популярный язык и за полгода переучиться на него, а также вы узнаете почему опыт работы на фрилансе в резюме значит меньше, чем опыт работы в команде. Читать...

​​Это — Антон Резник, у него более 12 лет опыта во фронтенд-разработке. Кто, если не он, научит вас делать серьёзный фронтенд?  Антон с нуля создал веб-версию Telegram на базе собственной реализации реактивного UI-фреймворка. А ещё однажды он написал систему «Умный дом» для своей квартиры на чистом JavaScript! Сейчас Антон тимлид в команде рекламы ВКонтакте, где создаётся frontend нового рекламного кабинета. Его работа состоит из сложных архитектурных решений, задач производительности и интеграций с другими командами. Вместе со своими коллегами с не менее классным опытом, Антон собрал весь свой опыт воедино на курсе Frontend. По секрету расскажем, что там действительно много практики и инсайтов индустрии.   Так что если вы junior+ или middle фронтендер и хотите научиться работать над масштабными проектами, вам сюда!  Новый поток стартует 18 мая, а по промокоду FNOTES20 вы получите скидку 5%.  Советуем начать учиться сейчас, так как с 15 мая цена поднимется. [Начать обучение]

​​🖥После блокнота: освой инструменты frontend разработчика В этой статье автор расскажет, почему любая серьёзная экосистема ПО рано или поздно обзаводится пакетными менеджером и репозиторием, и почему владение одним из современных front-end фреймворков лишает вас необходимости разбираться в архитектуре CSS, а также вы узнаете насколько CSS фреймворки, несмотря на свои недостатки, подходят в качестве следующей ступени развития front-end разработчика. Читать...

​​⚡️8 задач для практики Frontend-разработчика В этой статье автор расскажет, как написать веб-приложение, которое показывает гифки на странице, с использованием пользовательского ввода для поиска и API Giphy, и как создать уникальный проект с использованием Punk Beer API и отображением информации на странице с помощью шаблонизации, а также вы узнаете почему карты Google для увеличения местоположения или изменения режима просмотра, применяли функции, добавленные с помощью JavaScript. Читать...

​​👨‍💻Как стать фронтенд-разработчиком В этой статье автор расскажет, почему в начале пути некоторых пугает список технологий, названий и аббревиатур во фронтенде, и почему даже опытный разработчик не знает, да и не должен знать абсолютно все технологии и библиотеки, которые только существуют, а также вы узнаете как с помощью платформы Node.js можно написать консольную программу или серверную часть приложения. Читать...

​​👤Фронтенд-разработка: ключевые технологии и понятия В этой статье автор расскажет, как CSS-фреймворки значительно ускоряют рабочий процесс разработки, и почему дизайнеров, создающих пользовательские интерфейсы, тоже можно в какой-то смысле назвать фронтенд-разработчиками, а также вы узнаете как с помощью JavaScript веб-сайт можно наделить разными функциональностями, что не достижимо только с помощью HTML и CSS. Читать...

​​🤖 MoscowJS #52 уже 18 мая в 19:00 в гостях у Авито! В программе темы, связанные с фронтенд-разработкой: от доступности и перформанса веб-приложений до pet-проектов. С докладами выступят ребята из крупнейших компаний России. Присоединяйтесь к прямой трансляции митапа на ютуб-канале AvitoTech. Подписываемся на канал и жмём колокольчик под видео, чтобы не пропустить. Ещё можно добавить встречу себе в календарь. Реклама. ООО «Авито Тех». LdtCKhVTz

​​🧠Улучшаем производительность сайта с помощью CSS В статье автор расскажет о том, как можно улучшить производительность сайта с помощью обычных CSS свойств и на что стоит обращать внимание.  Читать...

​​Алгоритмы поиска подстроки на JavaScript Недавно я столкнулся с одной не очень сложной задачей на leetcode. В рамках задачи нужно было реализовать алгоритм поиска подстроки в строке. Пока я пытался сделать задачу, я понял, что я очень мало знаю про то как можно искать подстроку и решил изучить эту тему подробнее, и рассказать результат вам. Как говорит Википедия “Поиск подстроки в строке — одна из простейших задач поиска информации”, но это не совсем так, ниже я расскажу про разные алгоритмы решения и покажу примеры их реализации. Начнем! Читать...

​​Учиться у опытного разработчика бесплатно Крутой способ учиться фронтэнду - следить за работой опытных разработчиков и перенимать фишки. Для этого и нужны стажировки Но можно и без стажировки - в канале @ViktorRyabkovIT ▪️Я - senior fullstack разработчик в международной компании с 5+летним опытом разработки В своем канале я планирую создавать бесплатный сайт с тестами для изучения фронтэнда И сделать процесс его создания - полезным контентом  В чем польза? 👉🏻в канале я буду 30 дней показывать вам свою работу над проектом с нуля: обзоры кода, статьи с техническими фишками, видеоразборы - контент, как на платных курсах📚 Кстати, в канале уже есть полный список сервисов, которые я использую для изучения фронтэнда Зачем мне это? Меняю вашу подписку на реально полезный и уникальный контент. Это честно. Подпишись, следи и обучайся 👉 https://t.me/+1JAIiV99n6YwOTI6

Паттерн Singletone с примером на JavaScript Алоха товарищи фронты! Несмотря на то что в последнее время все больше задач мы обычно решаем в функциональном стиле я хотел бы сегодня вам рассказать о одном из самых распространенных классовых паттернов - синглтон. И так что это: Паттерн Singleton означает создание только одного экземпляра класса и доступ к нему через методы-геттеры. Пример использования: class Singleton {  constructor() {   if (!Singleton.instance) {    Singleton.instance = this;   }   return Singleton.instance;  }  someMethod() {   console.log('Hello from Singleton!');  } } const instance1 = new Singleton(); const instance2 = new Singleton(); instance1.someMethod(); // "Hello from Singleton!" console.log(instance1 === instance2); // true В данном примере класс Singleton будет создавать только один экземпляр и все вызовы конструктора будут возвращать ссылку на этот экземпляр. Таким образом, мы можем быть уверены, что где бы ни встретились вызовы методов класса Singleton, они всегда будут работать с одним и тем же экземпляром.

​​Node, Nest, Next, Express🤯 - пора бы всё объединить! Для этого мы создали отдельный уголок - Серверный JavaScript. Собрали всё, проверяй🔥

​​✅Фронтендерская история Автор расскажет про свой опыт 8 лет разработки во фронтенде и порассуждает, что сейчас происходит с фронтендом. Читать...