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

Parallax Star background in CSS Создано без использования JS. Вместо него автор использует возможности препроцессоров Haml и Sass. 👉 @seniorFront

N-th Fibonacci Создайте функцию, которая принимает число n и возвращает n-ное число в последовательности Фибоначчи. Пример: nthFibo(4) == 2 👉 @seniorFront

Eevee-dex Создано на Vue. Данные для приложения берутся из публичного api. 👉 @seniorFront

Awesome CSS Border Animation В этом видео создаются и анимируются границы блока на чистом CSS. 👉 @seniorFront

Требуются парни и девушки в возрасте 19–40 лет, желающие работать в сфере IT. Опыт в программировании не нужен. С 15 по 21 февраля проводим бесплатный онлайн-интенсив по Frontend-разработке, где будем учить, как разрабатывать сайты и веб-приложения. За эти 7 дней обучения ты: 1. Создашь полноценный веб-сайт на HTML и CSS; 2. Оживишь страницу с помощью JavaScript; 3. Используешь фронтенд-фреймворк Angular; 4. Подключишь Backend и загрузишь сайт на хостинг; 5. Получишь советы по доработке своего проекта; 6. Узнаешь сколько можно зарабатывать и как работать; 7. Получишь в подарок чек-лист «45 мест для поиска работы». А главное, ты увидишь, что разрабатывать сайты и приложения не так сложно, как кажется. И поймёшь, как тебе развиваться в этой профессии, чтобы уже в следующем году зарабатывать от 1000$ на вёрстке сайтов. 👉 Проскочить на интенсив бесплатно

👉 @seniorFront

Mobile Menu Animation При нажатии на кнопку задействуются CSS трансформации. 👉 @seniorFront

Scroll Reveal В JS создана логика, которая определяет, находится ли элемент на экране и исходя из этого показывает или скрывает элемент. 👉 @seniorFront

👉 @seniorFront

CSS Glowing Line В этом видео создается анимированная линия с эффектом свечения. Эффект создается CSS свойством box-shadow. 👉 @seniorFront

Wavy Upload Button При нажатии анимируется svg картинка, находящаяся внутри кнопки. Анимация реализована при помощи библиотеки gsap. 👉 @seniorFront

Sidebar navigation Создано и анимировано на HTML и CSS. В JS реализована только логика открытия/закрытия. 👉 @seniorFront

​Опрос "какими россияне видят программистов" Данные взяты из блога компании Мир Plat.Form. В преддверии дня программиста 2021 года компания провела опрос, который показал, какими россияне видят людей, работающих в этой профессии. Респонденты считают, что среди программистов больше мужчин, а свободное время они предпочитают тратить на компьютерные игры. Исследование, показало, что большинство опрошенных (79%) считают, что в этой сфере трудятся преимущественно мужчины. Также почти все респонденты (82%) отмечают, что у программистов интересная работа. Опрошенные считают, что им приходится перерабатывать (такой ответ дали 68%), а свое свободное время они любят проводить дома (63%), а также играть в компьютерные игры (71%). Только менее трети респондентов (30%) отметили, что программисты занимаются спортом. При этом россияне считают, что представители этой профессии ведут активную социальную жизнь. С утверждением о том, что программисты не спешат вступать в брак, согласны всего 38% опрошенных. Менее половины участников опроса (48%) считают, что большинство программистов интроверты, а меньше трети (27%) полагают, что представители этой профессии – это одинокие люди. Стереотип о программистах как о необщительных интровертах уходит в прошлое. Сейчас большинство из них обладают хорошими коммуникационными навыками. 👉 @seniorFront

Время относительной стабильности закончилось. JS и CSS активно развиваются. Новые фрейморки и фичи заставляют многих пересмотреть подход к написанию кода. Об этом говорят долгожданные результаты опросов State of JS 2022 и State of CSS 2022. Какие выводы из них можно сделать? И, главное, что ждёт нас в 2023 году? Обсудим на бесплатном вебинаре, который проведут тимлиды из ВКонтакте, Telegram Open Network и Frogly (Chrome Extension) Вы поймёте, что нужно знать, чтобы оставаться востребованным специалистом в этом году: какие фреймворки и фичи использовать, а от каких стоит отказаться. Встречаемся 9 февраля в 19:00 (по Москве) в прямом эфире. Регистрируйтесь по ссылке

logo animation Вся сцена состоит из svg картинки, которая анимируется библиотекой anime.js 👉 @seniorFront

​Service Workers Это специальный тип JavaScript-скриптов, которые могут работать в фоновом режиме и осуществлять различные задачи, такие как кэширование и оффлайн-работа веб-приложений. Service Workers регистрируются в веб-приложении и начинают работать только после того, как браузер подтвердит их регистрацию. Они могут работать в фоновом режиме, даже когда веб-приложение не активно, и имеют доступ к системе кэширования браузера и другим средствам оффлайн-работы. Вот пример регистрации Service Worker в веб-приложении: if ('serviceWorker' in navigator) { navigator.serviceWorker.register('/service-worker.js') .then((reg) => { console.log('Service worker registered.', reg); }); } В этом примере мы проверяем, поддерживает ли браузер работу с Service Workers, и если да, то регистрируем файл /service-worker.js как Service Worker. В файле /service-worker.js мы можем определить различные обработчики событий, например, обработчик для события fetch, который будет обрабатывать запросы и возвращать данные из кэша, если они есть: self.addEventListener('fetch', (event) => { event.respondWith( caches.match(event.request) .then((response) => { if (response) { return response; } return fetch(event.request); }) ); }); 👉 @seniorFront

🆕 Интенсив по верстке. Старт 8 февраля! Преподаватель — Никита Михайлов, автор 14 курсов на Хекслете. Вы освоите базу для быстрого вката в IT + сверстаете свою первую страницу. 8 дней прикладной информации без лирики и отступлений всего за 990 рублей!  📋 Переходите по ссылке выше и бронируйте место!

Parallax World Эффект создан на чистом CSS. 👉 @seniorFront