Обложка канала

Senior Frontend - javascript, html, css. Страница 57

20191 @seniorFront
Открыть

Senior Front - канал для front-end программистов, здесь есть много всего про CSS3, Javascript, Html5, Angular, React, видео / статьи / курсы

  • Senior Frontend - javascript, html, css

    Multi Tab Component Компонент табов, созданный на React и анимированный средствами JS. 👉 @seniorFront

  • Senior Frontend - javascript, html, css

    💻 Завтра 7 июня в 20:00 мск OTUS приглашает всех разработчиков, знакомых с JavaScript, на открытый вебинар «Объекты в JavaScript». 🎯Преподаватель: Юрий Дворжецкий, ведущий Fullstack разработчик, кандидат физико-математических наук. 📚 Что будет? Рассмотрим особенности современной реализации объектов в JavaScript-движка: свойства, прототипное наследование и другие, а также некоторые аспекты производительности данных решений. 🔥 Открытый урок дает возможность познакомиться с онлайн-курсом «JavaScript Developer. Professional» от OTUS, а также получить персональную скидку на курс от преподавателя после вебинара.🎁 ➡️ Пройдите небольшой тест на знание JS для участия в мероприятии l='noreferrer nofollow' href='https://otus.pw/mUOL/'>https://otus.pw/mUOL/

  • Senior Frontend - javascript, html, css

  • Реклама

  • Senior Frontend - javascript, html, css

    Loading Micro Animation Весь загрузчик - svg картинка, которой применяется множество CSS анимаций. 👉 @seniorFront

  • Senior Frontend - javascript, html, css

    PaginationHelper В этой кате вам нужно создать класс, который будет работать с пагинацией. В качестве данных в классе есть массив элементов и число элементов на странице. Пример работы методов класса: var helper = new PaginationHelper(['a','b','c','d','e','f'], 4); helper.pageCount(); //should == 2 helper.itemCount(); //should == 6 helper.pageItemCount(0); //should == 4 helper.pageItemCount(1); // last page - should == 2 helper.pageItemCount(2); // should == -1 since the page is invalid // pageIndex takes an item index and returns the page that it belongs on helper.pageIndex(5); //should == 1 (zero based index) helper.pageIndex(2); //should == 0 helper.pageIndex(20); //should == -1 helper.pageIndex(-10); //should == -1 👉 @seniorFront

  • Senior Frontend - javascript, html, css

    HTML5 canvas and javascript fireworks tutorial Сцена фейерверка на canvas и JS с очень подробными комментариям в коде. 👉 @seniorFront

  • Senior Frontend - javascript, html, css

    Модули, import/export Каждая программа со временем становится большой. Чем больше в проекте кода, тем сложнее в нём ориентироваться, писать и поддерживать. Модули помогают организовать код так, чтобы с проектом было проще и удобнее работать, позволяют переиспользовать код и структурировать программу. В модуле по умолчанию всё скрыто. Наружу предоставляется только то, что разработчики намеренно хотят предоставить — экспорты. Эту функциональность можно импортировать в других модулях и использовать. Таким образом, модуль — это чёрный ящик с одним входом (импорт) и одним выходом (экспорт), через которые этот модуль «общается» с другими. Модули можно сравнить с функциями: они решают те же проблемы, но в более крупном масштабе. Функции помогают разбивать большую задачу на мелкие, а модули — разбивать большой проект на мелкие части. Функции помогают структурировать выстраивать архитектуру решения конкретной задачи, а модули — проекта целиком. 👉 @seniorFront

  • Senior Frontend - javascript, html, css

    Isometric Menu Hover В этом видео создается объемный список и анимируется его элемент при наведении. Для создания объёмности и "выезжания" элемента применяются CSS трансформации. 👉 @seniorFront

  • Senior Frontend - javascript, html, css

    Освой Node.js и разрабатывай бэкенд любой сложности! 🎯 Первые шаги мы сделаем уже 8 июня в 20:00 на открытом уроке «Многопоточность и обработка данных в Node.js». Мы рассмотрим несколько способов реализации многопоточности с Worker API и разберем варианты взаимодействия процессов. Занятие проведет Юрий Дворжецкий, ведущий fullstack-разработчик в рамках курса «Node.js» 🚀Курс рассчитан на frontend-разработчиков или backend-разработчиков со знанием Javascript. — На открытом уроке проверьте, насколько вы готовы к обучению на углубленном курсе - Node JS Developer от OTUS 🔥 РЕЗУЛЬТАТ ПРОХОЖДЕНИЯ КУРСА Разработка серверных приложений любой сложности на Node.js с использованием Express, TypeScript, GraphQl, Apollo и Nest.js 👉 ЗАРЕГИСТРИРОВАТЬСЯ https://otus.pw/nDsr/

  • Senior Frontend - javascript, html, css

    Gradient Buttons Кнопки с анимированным градиентом, реализованные при помощи препроцессоров Slim и Less. 👉 @seniorFront

  • Senior Frontend - javascript, html, css

    Lightbox Gallery Hover Effect Несколько карточек, сверстанных при помощи препроцессоров Pug и SCSS. 👉 @seniorFront

  • Senior Frontend - javascript, html, css

    🔥Хардкорный тест по React.js — Ответьте на 19 вопросов и проверьте, насколько хорошо вы знаете фреймворк. Сможете сдать — пройдёте на продвинутый курс по React.js со скидкой. 👉🏻ПРОЙТИ ТЕСТ ПО REACT 📌Хотите протестировать учебный процесс заранее? Регистрируйтесь на бесплатный вебинар «Обзор нововведений в React 18» — 8 июня в 20:00 мск: регистрация

  • Senior Frontend - javascript, html, css

    ​Псевдоклассы группы child При помощи этих псевдоклассов можно удобно выбирать элементы по их порядковому номеру внутри родительского элемента. Пример: Раскрасим в разные цвета фон у пунктов списка. Обратите внимание, что у всех пунктов списка одинаковые классы, а значит, мы не сможем обратиться к отдельным пунктам при помощи селектора по классу. <ul class="list"> <li class="list-item">Тёмный синевато-зелёный</li> <li class="list-item">Блестящий зелёный</li> <li class="list-item">Блестящий зеленовато-желтый</li> <li class="list-item">Блестящий зеленовато-желтый</li> <li class="list-item">Блестящий зеленовато-желтый</li> <li class="list-item">Розовый щербет</li> <li class="list-item">Умеренный оранжевый</li> </ul> У всех пунктов списка будет жёлтый фон: .list-item { background-color: #FFD829; } У первого пункта списка будет тёмно-зелёный фон: .list-item:first-child { background-color: #064236; } У последнего пункта списка будет оранжевый фон: .list-item:last-child { background-color: #ED6742; } У второго пункта списка будет зелёный фон: .list-item:nth-child(2) { background-color: #49A16C; } У предпоследнего пункта списка будет розовый фон: .list-item:nth-last-child(2) { background-color: #F498AD; } 👉 @seniorFront

  • Senior Frontend - javascript, html, css

    Magic Menu Indicator В этом видео автор создает индикатор выбранного пункта меню. Для этого он стилизует элемент span, а затем в JS создает логику смещения индикатора, зависящую от выбранного элемента. 👉 @seniorFront

  • Senior Frontend - javascript, html, css

    Всем привет! Ребята создали чат-бота Masterhub, который рассылает разработчикам релевантные Frontend вакансии без спама. Настрой бота за 1 минуту и получай до 50 вакансий в неделю, отобранных по твоим предпочтениям. @MasterHuBot

  • Реклама

  • Senior Frontend - javascript, html, css

    Play Button Animation Кнопка, сверстанная и анимированная на HTML и CSS. 👉 @seniorFront

  • Senior Frontend - javascript, html, css

    Как устроена автоматизация в Почте России? А есть ли легаси? Все это можно узнать в Telegram-канале Почтатеха — ИТ-подразделения Почты, которое занимается разработкой цифровых продуктов. В нем вы также найдете актуальные вакансии, комментарии экспертов и множество интересного из мира информационных технологий. Подписывайтесь: @pochtatech
    Почтатех

    Разрабатываем сложные цифровые продукты для Почты России. Открытые вакансии: https://hr.pochta.tech/

    Telegram

  • Senior Frontend - javascript, html, css

    Wifi Signal animations Элементы созданы на canvas и анимированы в JS. 👉 @seniorFront