О хуках в фронтенд-разработке на Хабре писали уже не раз, и в этой статье мы не сделаем великого открытия. Наша цель другая – рассказать про React Hooks настолько подробно и просто без трудной терминологии, насколько это возможно. Чтобы после прочтения статьи каждый понял про хуки всё. Эта статья будет полезна как начинающим React-разработчикам, так и тем, кто хочет, не уходя в глубины документации, получить практическую информацию в сжатом виде.
Разработка веб-сайтов *
Делаем веб лучше
Новости
Не умер ли ещё PHP (и ещё 11 вопросов, которые не стыдно задавать в 2022)
Уже который год во всех слаках, дискордах, телеграмах и форумах главный вопрос о любом языке программирования звучит так — стоит его учить В ЭТОМ ГОДУ, или лучше уже не надо? Взять какой-нибудь PHP — его же вечно хоронят, и всё никак.
Есть и много других вопросов. Например:
— Что выбрать — PHP, Python, Go или Node.js? Или Visual Basic? Или С? Может, Brainfuck?
— Почему все говорят про Python? Он крутой? Круче, чем всё?
— Бэкенд — это про логику и алгоритмы? Матан нужен? А чувство прекрасного?
— У фронтендеров React, Vue и миллионы других фреймворков, о которых все слышали, а что у бэкендеров? Терпение?
— Придётся ли устанавливать Linux, чтобы работать с бэкендом?
— Почему о фронтендерах все говорят, а о бэкендерах нет? Это потому что у них зарплата 20 тысяч?
Как хорошо, что спрашивать не стыдно, а отвечать — бесплатно. Поэтому мы попробуем ответить, а вы присоединяйтесь к обсуждению, потому что в таком деле у всех свои ответы.
Пишем социальную сеть на Ruby on Rails. Часть 1
Всем привет! Я Ruby on Rails Developer и еще совсем недавно я начинал свой путь в этой области. Я уже прошел первые шаги (о них я писал в данной статье), как выбор языка, изучение его основ, знакомство с фреймворком, первые pet-проекты, первые собеседования, первый оффер, первая компания. Но многие только начали идти по этому пути и именно для них эта статья. По своему опыту помню, как сложно искать гайды (большинство из них про создание книжных магазинов, личных блогов и т.д.), поэтому, надеюсь, многим понравиться идея создания соц сети.
Шаринг сокет-соединения между вкладками
В каждом современном сервисе должны быть сториз и чат, и для начала мы решили запилить в hh.ru переписки. Меня зовут Влад Коротун, я фронтенд-разработчик. В этой статье расскажу, как неординарный подход к использованию Web Workers помог нам решить эту задачу.
Для желающих посмотреть на предмет сабжа в динамике у нас есть видеоверсия этой статьи.
Практический пример использования CSS Layer
CSS Layer — это очень мощный апдейт языка, о котором, на мой взгляд, должны знать все фронтендеры уже сейчас, так как он довольно сильно меняет представление о том, как писать стили.
В статье я поделюсь реальной проблемой и тем, как элегантно её можно было бы решить с помощью CSS Layer, который пока ещё нельзя использовать из-за почти нулевой браузерной поддержки.
Тайна меняющейся фавиконки
Вчера на работе разработчик обратился ко мне с проблемой. Разговор шел примерно так...
Начала Docker для юнги
Туториал по основам докера в котором простыми словами объясняется, как собирать образы и разворачивать контейнеры. Тут же можно узнать, чем контейнер отличается от виртуалки, что такое образ и увидеть простой кейс.
Топ-10 методов веб-взлома 2021 года по версии PortSwigger
Добро пожаловать в топ-10 новых методов веб-взлома 2021 года. Это заключительный этап ежегодной работы нашего сообщества. Цель работы — выявить самые значимые в области веб-безопасности, опубликованные в 2021 году.
PortSwigger — разработчик инструментов для этичного хакинга, работа с которыми — часть нашего курса по этичному взлому.
Темизация, часть 3. Themeizer – юный попутчик стилей
Получить стили от дизайнера, рассказать о них программисту и наполнить сайт новыми красками. Попутчик, единственная цель которого – сделать вашу жизнь чуточку лучше.
Вот уже третья статья выходит с темой, которой не существует. Первая статья затевалась для того, чтобы описать полезный и интересный функционал, да ещё и дающий красивый результат. Сейчас же пора признать, что темизация это не про внедрение бездушного черно-белого мира и не про личные прихоти, это важный шаг в вопросах доступности сервиса и в целях его конверсии.
Если техническая часть первой статьи была посвящена клиентской части, второй – серверной, то в третьей я бы хотел рассказать о нелёгком пути, который проделывают стили до попадания на сайт и о попутчике, которого я создал им в помощь, дружелюбном и помогающем им на каждом шаге – от дизайна до вёрстки. Я назвал его Themeizer и в завершающей трилогию статье, хотел бы вас познакомить с ним, с его умениями и рассказать о процессе его зарождения.
3 совета по удобным интерфейсам за Февраль
Хабр, все мы испытываем негативные эмоции, когда встречаемся с неудобными интерфейсами. Чтобы эти события происходили как можно реже, я пытаюсь доносить лучшие практики. В феврале я провел исследования и написал 3 совета, которые, надеюсь, помогут вам делать более удобно для пользователей.
Почему я ненавижу турбо-страницы от Яндекса
Яндекс запустил свою версию "ускоренных страниц" под названием “Турбо” в далеком 2017 году. Это был эксперимент, но прошло уже 5 лет, и я вижу в этой технологии больше проблем, чем их решения.
Далее делюсь личным опытом взаимодействия с турбо, который может отличаться от мнения остальных пользователей, разработчиков и владельцев интернет ресурсов, чьи страницы ускоряет Яндекс.
Как мы собрали проект на Django и React и уважили загрузчик Webpack
Когда мы взялись за гибридный проект, в котором одновременно использовались Django и React, мы столкнулись с дилеммой: как интегрировать две эти части, в особенности, как разрешить шаблонам Django отображать ресурсы JavaScript, сгенерированные при клиентской сборке. Мы нашли изящный способ, позволяющий с этим справиться: использовать Webpack-загрузчик для Django с трекером бандлов Webpack, при помощи которых нам поддался этот этап работы сборочного конвейера. А в этой статье мы научим вас, как это делается.
Дайджест свежих материалов из мира фронтенда за последнюю неделю №506 (6 — 13 февраля 2022)
ActiveStorage::Variant. Креатив на рельсах
Краткий этот туториал будет полезен, хотелось бы надеяться, как программистам, работающим с Ruby on Rails, так и тем из "племени младого незнакомого" веб-разработчиков, кто захочет освоить отличный инструмент, увидевший свет в Rails 5.2 ("извлечен из прода" Basecamp 3 усилиями George Claghorn и Javan Makhmali) - фреймворк Active Storage. Фреймворк делает простым и на редкость удобным загрузку файлов в облако (прямо сразу "из коробки" доступны Amazon S3, Google Cloud Storage и Microsoft Azure Storage), также - если речь об изображениях, видео или PDF-файлах - создание превью на лету.
Основы внутреннего устройства JavaScript
С ростом популярности JavaScript команды разработчиков начали использовать его поддержку на многих уровнях своего стека — во фронтенде, бэкенде, гибридных приложениях, встраиваемых устройствах и многом другом. В этой статье мы хотим более глубоко рассмотреть JavaScript и то, как он работает.
Введение
Почти все уже слышали о концепции движка V8 и большинство людей знает, что язык JavaScript однопотоковый или что он использует очередь обратных вызовов.
В этом посте мы подробно разберём эти концепции и объясним, как же работает JavaScript. Благодаря знанию этих подробностей вы сможете писать более оптимальные приложения, надлежащим образом использующие API. Если вы работаете с JavaScript относительно недавно, этот пост поможет вам понять, почему JavaScript настолько «странный» по сравнению с другими языками. А если вы опытный разработчик на JavaScript, то он позволит вам по-новому взглянуть на внутреннее устройство JavaScript Runtime, с которым вы работаете каждый день.
Тултипы (tooltips). Что это такое и как их проектировать
Тултип, от английского tooltip. Это такая короткая всплывающая подсказка, появляющаяся при наведении курсора на элемент. Или при фокусировании на элементе с помощью клавиатуры. Или при длительном разглядывании элемента, если вы в шлеме виртуальной реальности с трекингом глаз.
Привет, меня зовут Егор Камелев. Я занимаюсь проектированием интерфейсов с 2006 года. Сегодня хочу поделиться чек-листом вопросов, связанных с проектированием тултипов.
Простой и эффектный parallax-эффект без JavaScript
Всем привет! Буквально за 5 минут расскажу, как сделать parallax-эффект, который помог нам наглядно показать стилистические различия между светлой и темной темами на сайте «Дизайн-система НЛМК».
Parallax-эффект позволяет пользователю увидеть изменения темы у компонентов при скролле страницы, причем сами компоненты зафиксированы, а линия смены темы двигается синхронно со скроллом.
Подробнее о нашей BI-системе в Домклик
Приветвую, не так давно вышла первая статья с общим описанием нашей самописной BI в Домклик. А сегодня хотелось бы подробнее поговорить про технический концепт этого инструмента. Если интересно, прошу под кат.
Как понять, что перед вами плохой разработчик
Мало просто сменить свою сферу работы на IT, желательно еще и стать хорошим разработчиком. Бывший тимлид и консультант Александр Усков рассказывает, как понять, что перед вами плохой разработчик и что с ним вообще можно делать
В этой статье мы разберем признаки слабых разработчиков, которые можно обнаружить на собеседовании, в ходе совместной работы или даже в процессе неформального разговора в курилке. Важное уточнение — все описанное в нашей статье не стоит рассматривать как чек-лист формальных правил. Это скорее некоторые закономерности, каждая из которых не является гарантией того, что перед вами — «плохой» разработчик. Но, если в одном человеке сочетаются несколько из них, то вероятность этого сильно увеличивается.
Инструкция по Selenium Docker
В этой статье мы расскажем о том, как запускать Selenium-тесты в Docker и выполнять их в браузерах Chrome и Firefox. И мы, вероятно, также поймем, зачем запускать Selenium-тесты в Docker.