Frontender Libs - обзор библиотек JS / CSS

React vs Vue.js: что лучше для разработки мобильных и веб-приложений? Когда дело доходит до создания мобильного или веб-приложения, то наступает время выбора нужной JavaScript библиотеки. Как правильно выбрать исходя из ваших целей и задач узнаем в статье. Рассмотрим моменты, которые стоит учитывать при выборе нужного фреймворка. 👉 @sWebDev

Представляем refine — open-source headless React-фреймворк (6.1K ⭐️ на GitHub) для CRUD-приложений. С ним вы можете быстро создать админку или дашбоард, при этом код останется гибким для изменений.✨ refine бесшовно связывается с UI-фреймворками и поставляется с готовыми интеграциями для Ant Design System, Material UI, Mantine и Chakra UI 🚀

Beat Burger Проект барабанной установки, выполненный в виде бургера. Вы можете управлять установкой, используя клавиатуру или мышь. Реализовано с использованием библиотеки GSAP. 👉 @sWebDev

❓ Хотите выучить html с нуля? Тогда этот бесплатный справочник по html то, что вам нужно. 🎁 Оставьте заявку на тест-драйв курса специализация «Fullstack developer» и получите: - справочник по html; - приглашение на бесплатные уроки курса по html, css, javascript 📌 Не упустите свой шанс освоить профессию «Fullstack Developer» со скидкой 36800₽ Для получения подарка нужно быть авторизованным в Вк. 👉 https://vk.cc/cjC8ec

useContext React Рассмотрим хук React useContext, который принимает объект контекста (значение, возвращённое из React.createContext) и возвращает текущее значение контекста. Текущее значение контекста определяется значением ближайшего <MyContext.Provider> над вызывающим компонентом в дереве. Когда ближайший <MyContext.Provider> над компонентом обновляется, этот хук вызовет повторный рендер с последним значением контекста, переданным этому провайдеру MyContext. Запомните, аргумент для useContext должен быть непосредственно сам объект контекста: Правильно: useContext(MyContext) Неправильно: useContext(MyContext.Consumer) Неправильно: useContext(MyContext.Provider) 👉 @sWebDev

Настройка экземпляра компонента Vue У вас есть компонент, который вы хотите повторно использовать. Например, для создания списка покупок, но каждый экземпляр компонента ссылается на один и тот же объект с данными. Какой вариант правильный для решения данной задачи? Если забыли, то вернитесь к посту за 05.12. Вариант 1:

      Vue.component('some-comp', {
                data: {
                foo: 'bar'
                }
            })
            export default {
                data: {
                foo: 'bar'
                }
            }

Вариант 2:

  Vue.component('some-comp', {
                data: function() {
                  return {
                    foo: 'bar'
                  }
                }
              })
              export default {
                data() {
                  return {
                    foo: 'bar'
                  }
                }
              }

👉 @sWebDev

RamBear Анимированный проект, напоминающий "Рэмбо", выполненный на GSAP.js. 👉 @sWebDev

React приложение и DALL-E API DALL-E - это нейросеть, которая генерирует изображения по описанию. В статье подробное руководство по созданию собственного приложения React с использованием DALL-E API. 👉 @sWebDev

Handsontable Библиотека Handsontable позволяет создавать сетки данных, которые выглядят и воспринимаются как электронные таблицы. Handsontable не зависит от конкретного фреймворка или библиотеки и отлично работает с простым JavaScript. Использование Handsontable предоставляет возможности замораживания, перемещения и изменения размера строк и столбцов в сетке данных, а узнать все возможности библиотеки можно в репозитории по ссылке. 👉 @sWebDev

Pig Minecraft Проект одного из NPC из вселенной Minecraft. 👉 @sWebDev

Тест по JavaScript от OTUS Ответьте на 20 вопросов и проверьте, насколько вы готовы к обучению на курсе «JavaScript Developer. Professional». Сможете сдать — пройдёте на продвинутый курс по специальной цене, а также получите видео-курс по Git в подарок ПРОЙТИ ТЕСТ https://otus.pw/UmCM/

Оптимизация Vue приложения Приоритет производительности при создании веб-приложений улучшает взаимодействие с пользователем и помогает обеспечить их использование большим количеством людей. В статье Мишель Баркер — старший frontend разработчик в Ada Mode поделиться некоторыми советами по оптимизации внешнего интерфейса веб-приложений на Vue. 👉 @sWebDev

Стать сотрудником Яндекса быстрее и проще, чем кажется. Участвуйте в днях быстрого найма: решите тестовое, пройдите несколько секций собеседования и получите офер за несколько дней. Теперь дни быстрого найма будут проходить регулярно. Чтобы вам было удобно следить за расписанием, собрали все мероприятия на отдельной странице. Ближайшие мероприятия: • 10 декабря - Fast Track для ML-аналитиков в Маркет • 19–25 декабря — Week Offer для backend, frontend, mobile-разработчиков и аналитиков в команду Рекламы Узнать подробнее и зарегистрироваться

AG Grid AG Grid одна из лучших библиотек JavaScript для создания таблиц с данными. Особенности: производительность, отсутствие зависимости от сторонних библиотек и плавную интеграцию со всеми основными средами JavaScript, такими как Angular, React и VueJS. Полный обзор в репозитории по ссылке. 👉 @sWebDev

Face Button Анимированная эмодзи-кнопка, выполненная с использованием Gsap.js. 👉 @sWebDev

Предварительный рендеринг в Angular с помощью Angular Universal: стоит ли это учитывать? Мы часто говорим о рендеринге на стороне клиента и рендеринге на стороне сервера, но есть еще один вариант, называемый предварительным рендерингом. При правильном использовании предварительный рендеринг может повысить производительность вашего сайта и рейтинг SEO, особенно если вы не можете позволить себе затраты на рендеринг вашего приложения на стороне сервера. Все особенности данного процесса в статье по ссылке. 👉 @sWebDev

Данные компонента Vue При использовании свойства data в компоненте (везде, за исключением new Vue), значением всегда должна быть функция, возвращающая объект. Можно повторно пользоваться компонентом. Но, нужно помнить, что каждый экземпляр компонента ссылается на один и тот же объект данных. Нужно чтобы экземпляр компонента управлял только своими данными. Для этого каждый экземпляр должен создать уникальный объект данных. В коде это выглядит так:

    Vue.component('some-comp', {
      data: function() {
        return {
          foo: 'bar'
        }
      }
    })
    // В .vue-файле
        export default {
      data() {
        return {
          foo: 'bar'
        }
      }
    }
    // Допускается использовать объект напрямую
    // в корневом экземпляре Vue, поскольку только
    // один экземпляр будет существовать.
    new Vue({
      data: {
        foo: 'bar'
      }
    })

👉 @sWebDev

Что такое GRPC и как его использовать в среде Node.js? 21 декабря в 20:00 мск состоится вебинар «GRPC Микросервисы в Node.js». На открытом уроке онлайн-курса «Node.js Developer» мы рассмотрим протокол GRPC, технические характеристики и области применения. В ходе обучения мы научимся создавать простейшие GRPC клиенты и серверы на Node.js, а также микросервисы с NestJS. Это занятие будет полезно тем, кто хочет познакомиться со стандартом GRPC, сравнить этот подход с традиционным REST API и использовать его в среде Node.js. Для участия пройдите вступительный тест https://otus.pw/u7bE/

Frontend! Frontend! Frontend! Много FRONTEND’a! Зачем платить за курсы, если они есть в открытом доступе? Выучи такие языки бесплатно: >JavaScript (56 уроков) >Figma (44 видеоурока) >Web Design (57 видеоуроков) >HTML/CSS (41 курс) >UI/UX (33 урока) >Верстка (71 курс) >React (32 курса) >Другие (144 Курса) Подпишись, что бы не потерять возможность выучиться бесплатно!❤️