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

WebDEV. Страница 23

19233 @webb_dev

Канал о web-разработке. Новости IT, туториалы, веб-программирование и многое другое.

  • WebDEV

    NestJS за 100 секунд Nest — это прогрессивная платформа для создания серверных приложений и API-интерфейсов с помощью Node.js. 📺 YouTube WebDEV #видео #NestJS #js
    NestJS in 100 Seconds

    Nest is a progressive framework for building server-side applications and APIs with Node.js. It leverages TypeScript and a powerful CLI to ship reliable apps...

    YouTube
  • WebDEV

    💡 Ошибка: беспорядок в медиазапросах Частая ошибка — смешивать mobile-first и desktop-first подходы. Сейчас, когда IE8 перестал фигурировать в спеках, можно смело переходить на mobile-first. Если макеты готовы только для десктопа, попробуйте повлиять на дизайнера, ссылаясь, например, на эту книгу. В любом случае, будете вы использовать min-width или max-width, используйте что-то одно. Иначе в какой-то момент станет тяжело отслеживать логику изменения стилей, а значит, проблематично поддерживать верстку. Кроме того, не стоит писать медиазапросы по хардкоду, используйте как минимум переменные для брейкпоинтов. Т.е. вместо:
    @media (min-width: 1024px)
    
    
    должно получиться:
    $laptop-landscape: 1024px;
    
    @media (min-width: $laptop-landscape)
    
    
    Переменные для брейкпоинтов стоит хранить в отдельном документе или в layout.scss. Можно пойти дальше, прочитать эту статью и выбрать один из предложенных подходов (или написать свой). Продолжение следует... WebDEV #советы #web
  • WebDEV

    WebDEV #test #js Выберите правильный вариант 👇🏼
  • Реклама

  • WebDEV

  • WebDEV

    💡 Не используйте миксины, когда можно использовать миксины Миксины очень помогают следовать принципу DRY (Don’t Repeat Yourself), их активно используют в scss для таких абстрактных задач, как сетка, но о них почему-то забывают, когда речь заходит о верстке компонент. Например, у вас есть кнопки разных цветов, у которых на ховере происходит инверсия цвета. Для инверсии можно написать миксин и сделать стили чуточку чище. Также советуем обратить внимание на плейсхолдеры, которые, к сожалению, редко встречаются в верстке новичков. В Jade тоже следует активнее использовать миксины. Например, для svg-спрайтов. Пример можно посмотреть здесь. WebDEV #советы #web
  • WebDEV

    🛠 Cssbattle — создавайте различные фигуры на CSS в каждом челлендже и улучшайте свои навыки. WebDEV #инструменты #css
  • WebDEV

    📖 Amazon Web Services in Action 🖋 Andreas Wittig, Michael Wittig, 2018 Amazon Web Services in Action - это всеобъемлющее введение в вычисления, хранение данных и создание сетей в облаке AWS. Вы найдете четкое и актуальное освещение всех основных сервисов AWS, которые вам нужны, с акцентом на лучшие практики обеспечения безопасности, высокой доступности и масштабируемости. 💾 Скачать книгу WebDEV #book #web
  • WebDEV

    💡 Ошибка: блоки влияют друг на друга, одни и те же селекторы встречаются в нескольких местах в scss ▍Часть 3 Если возникает необходимость так написать, значит, что-то пошло не так на этапе именования, нужно незамедлительно вернуться к Jade и исправить атрибуты class так, чтобы каждый блок был независимым. Если же заплатка нужна срочно и времени на изменения разметки нет, то оставьте комментарии TODO в обоих документах: в scss и в jade. Говоря о том, что блок не знает о других блоках, хочется вкратце упомянуть об одном полезном псевдоклассе, о котором постоянно забывают новички. Представьте лейаут верхнего уровня: есть блок с основным контентом и блок aside. Для двух этих блоков указана ширина в %, но на одной странице aside нет и ширина блока с основным контентом должна быть 100%. Тут нам на помощь придет псевдокласс only-child: пример. В случаях, когда only-child не подходит, используйте модификаторы. WebDEV #советы #web
  • WebDEV

    WebDEV #test #html Выберите правильный вариант 👇🏼
  • WebDEV

    🔥 Лучшее на канале за неделю 1. React Native за 100 секунд. 2. frontendpractice — поднимите свои навыки во фронтенде на новый уровень, воссоздавая реальные веб-сайты. 3. Ошибка: блоки влияют друг на друга, одни и те же селекторы встречаются в нескольких местах в scss: Часть 1 | Часть 2.
  • WebDEV

  • WebDEV

    Python теперь в телеграм! Python — второй по популярности язык в мире. Он очень универсален: можно писать сайты, а можно искусственный интеллект. Теперь у Python есть русскоязычный канал. Это первоисточник всего, что появляется в платных курсах и остальных ресурсах. Стоит подписаться!
  • WebDEV

    🛠 Happy Hues — палитры отобранных цветов, которые будут уместны в определённом контексте. WebDEV #инструменты
  • WebDEV

    JavaScript теперь в телеграм! JavaScript — самый популярный язык в мире, он используется в 95% всех сайтов, которые вообще существуют. Теперь у JS есть русскоязычный канал. Это первоисточник всего, что появляется в платных курсах и остальных ресурсов. Стоит подписаться!
  • WebDEV

    💡 Ошибка: блоки влияют друг на друга, одни и те же селекторы встречаются в нескольких местах в scss ▍Часть 2 Блок — это отдельный компонент, который не знает о других блоках и их расположении. «Блок — логически и функционально независимый компонент страницы, аналог компонента в Web Components… Независимость блоков обеспечивает возможность их повторного использования, а также удобство в разработке и поддержке проекта.» (источник) Такой код будет ошибочным, т.к. состояние одного блока влияет на элемент в другом блоке:
    .block {
        &:hover .another-block__element {
            color: red;
        }
    }
    
    
    Продолжение следует... WebDEV #советы #web
  • Реклама

  • WebDEV

    ⚡️ Начните знакомство с Rust-фрейморками! Приглашаем 7 апреля в 20:00 на открытый вебинар «Rust и GUI». 📚Вместе с экспертом мы за 1,5 часа разберем подходы к реализации GUI фреймвоков, рассмотрим Rust-фреймворк iced и создадим на нем небольшое приложение. После demo-занятия вы можете продолжить осваивать Rust на онлайн-курсе «Rust Developer». Воспользуйтесь возможностью познакомиться с преподавателем и бесплатно протестировать обучение. 🎯 Пройдите тест и записывайтесь на вебинар – https://otus.pw/Efvw/
  • WebDEV

    🔥 Мы не жизнь, мы к такому готовим 🔥 📌 Экзамен Oracle Java Programmer — это 70 сложных задач за 2,5 часа. Чтобы его сдать, нужно изучать Java не вширь, а вглубь. Такую мощную подготовку дает онлайн-курс «Подготовка к сертификации Oracle Java Programmer (OCAJP)» от OTUS. 🚀 Преподаватели курса уже получили это почетное звание и готовы поделиться своими знаниями и опытом. За 5 месяцев вы разберете все темы и попрактикуетесь решать задачи, как на экзамене. Обучение придаст вам уверенности в своей компетентности. 👉 Пройдите вступительный тест, чтобы оценить свой уровень подготовки и занять место в группе по спец.цене https://otus.pw/lAcS/
  • WebDEV

    🛠 frontendpractice — поднимите свои навыки во фронтенде на новый уровень, воссоздавая реальные веб-сайты. WebDEV #инструменты #frontend