Фронтенд Гайд

Нужен front-end-разработчик для фриланс-сотрудничества! Пишешь на Vue больше 2 лет? Есть регулярные задачи для тебя в формате фриланса! Задачи разнообразные, чаще на новый функционал и реже верстку Требования: - Опыт работы в коммерческих проектах. - Умеете работать в команде, быстро схватываете задачи и задаете правильные вопросы. - Не раздуваете задачи, цените простой и понятный подход. Будет плюсом владение версткой Tailwind. Ищешь гибкий график и интересные задачи? Мы ждем тебя! Напиши @where_my_million

Анимация замыливания текста при скролле Еще один эффект для текста, основанный на использовании скролла.

Самая актуальная инфа по ноу-код разработке у нас! Канал топовой онлайн-школы по Webflow-разработке, заходи и подписывайся! Разбираем антимации, фреймворки, работу с Upwork. Авторские гайды для разработчиков, кейсы наших спецов, анонсы вебов и других полезных материалов. А еще мы будем верстать сайт об Ai ассистенте, дизайн, которого сделал Ai. И все это на Webflow! Не отставай, лови свежие фишки у нас t.me/+QKv3i7lKBfIzOWEy Подписаться #реклама О рекламодателе

Дарим билет в мир большого IT 🎫 От тебя нужен только опыт работы разработчиком JS+React от года и желание попасть в команду Холдинга Т1 — одного из лидеров российского ИТ-рынка, в портфеле которого 800+ высокотехнологичных проектов и 70+ продуктов и услуг. Регистрируйся на онлайн-интенсив в Открытые школы Т1 и прокачай навыки бесплатно всего за 1 месяц. Лучшие получат оффер от Т1 🔝 и уникальный карьерный фаст-трек до мидла в бигтехе. Всего за полгода мы выпустили 500+ специалистов. Участники присоединились к командам финтех-разработки и разработки ИТ-продуктов. Также участников ждут в юнитах облачных сервисов, развития ИИ-решений, интеграции и консалтинга. ⌛️ Быстрое обучение: 1 месяц. 💻Гибкий формат: все этапы онлайн, занятия по вечерам. 🌏 Работа в Т1 возможна с тер-рии РФ и Беларуси. Ты с нами? Тогда подавай заявку до 24 июля! Старт интенсива — 29 июля. Реклама. ООО "Т1". ИНН 7720484492.

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

ТОП-4 Курса по UX/UI-дизайну по версии Tutortop Tutortop — маркетплейс курсов №1 по количеству школ-партнеров, курсов и реальных отзывов студентов. Освойте востребованную профессию с нуля за 4-5 месяцев. Соберите портфолио из 10+ проектов. Выйдите на заработок 100 000₽+ и работайте удаленно в гибком графике. Выбрать #реклама 16+ tutortop.ru О рекламодателе

Скролл-анимация с типографикой Эксперимент с анимацией с появлением изображения в тексте при скролле.

3D Interactive Card Hover Свойство transform со значением rotate изменяется в зависимости от положения курсора.

Бесплатное обучение IT-профессиям! Базовые знания и практические задания для новичков. Учитесь на практике. Выберите свой путь в IT! Узнать больше #реклама 16+ free.skillfactory.ru О рекламодателе

Телеграм-канал с авторскими онлайн-курсами У образовательной платформы Stepik есть свой телеграм-канал, в котором они рассказывают об авторских курсах (как платных, так и бесплатных). У них есть курсы по таким направлениям: - Python - Web-разработка - Маркетинг - Аналитика - Маркетинг - Иностранные языки Подпишитесь на stepik_courses и найдите интересующий курс для себя! Подписаться #реклама 16+ О рекламодателе

Назови компоненты жизненного цикл ? Спросят с вероятностью 7% Компонент жизненного цикла включает в себя несколько этапов, которые можно разделить на три основные фазы: монтирование, обновление и размонтирование. Каждая из этих фаз включает определенные методы цикла. 1️⃣ Монтирование (Mounting): ✅ constructor(): Вызывается перед монтированием компонента. Обычно используется для инициализации состояния и привязки методов. ✅ static getDerivedStateFromProps(props, state): Вызывается перед рендером компонента как при монтировании, так и при обновлении. Используется для синхронизации состояния с пропсами. ✅ render(): Обязательный метод, который возвращает JSX-разметку компонента. ✅ componentDidMount(): Вызывается сразу после монтирования компонента. Здесь можно выполнять запросы к API или подписываться на события. 2️⃣ Обновление (Updating): ✅ static getDerivedStateFromProps(props, state): Как и при монтировании, вызывается перед рендером компонента для синхронизации состояния с пропсами. ✅ shouldComponentUpdate(nextProps, nextState): Определяет, нужно ли компоненту перерисовываться. Можно использовать для оптимизации производительности. ✅ render(): Ререндер компонента на основе новых пропсов или состояния. ✅ getSnapshotBeforeUpdate(prevProps, prevState): Вызывается прямо перед тем, как изменённый DOM будет отображен. Полезно для сохранения информации о DOM, которая может измениться после обновления. ✅ componentDidUpdate(prevProps, prevState, snapshot): Вызывается сразу после обновления компонента. Можно использовать для выполнения действий после обновления, таких как запросы к API на основе новых пропсов или состояния. 3️⃣ Размонтирование (Unmounting): ✅ componentWillUnmount(): Вызывается перед размонтированием и удалением компонента. Используется для очистки ресурсов, таких как таймеры, подписки или запросы. Пример:

class MyComponent extends React.Component {
  constructor(props) {
    super(props);
    this.state = { count: 0 };
  }

  static getDerivedStateFromProps(nextProps, prevState) {
    // Синхронизация состояния с пропсами
    if (nextProps.count !== prevState.count) {
      return { count: nextProps.count };
    }
    return null;
  }

  componentDidMount() {
    // Выполнение действий после монтирования
    console.log('Component mounted');
  }

  shouldComponentUpdate(nextProps, nextState) {
    // Оптимизация перерисовки
    return nextState.count !== this.state.count;
  }

  getSnapshotBeforeUpdate(prevProps, prevState) {
    // Сохранение информации о DOM
    return null;
  }

  componentDidUpdate(prevProps, prevState, snapshot) {
    // Выполнение действий после обновления
    console.log('Component updated');
  }

  componentWillUnmount() {
    // Очистка ресурсов перед удалением компонента
    console.log('Component will unmount');
  }

  render() {
    return (
      <div>
        <p>Count: {this.state.count}</p>
      </div>
    );
  }
}

Жизненный цикл компонента включает три фазы: монтирование, обновление и размонтирование. В каждой фазе есть свои методы, которые выполняют определенные действия для управления состоянием и поведением компонента.

Jobski - твой помощник при поиске работы в IT Сервис индивидуально подбирает вакансии, учитывая ваш опыт, навыки и стек технологий. Узнать больше #реклама jobski.ru О рекламодателе

Создайте форму входа в систему с помощью HTML и CSS