React Router: что это и как использовать

React Router – это библиотека для навигации между разными частями веб-приложения, созданными на React. Она помогает создавать одностраничные приложения, которые при переходе подгружают не всю страницу, а только необходимые компоненты.

А узнать, как её установить и создать свои первые простые и вложенные маршруты вы сможете узнать в этой полезной статье.

#js #веб #react

​​Микрофронтенд: что это такое и зачем он нужен?

Микрофронтенды — это деление монолитного приложения на семантически изолированные части и их независимая разработка. Каждая страница сайта или приложения структурно состоит из блоков, это может быть блок рекламы, блок обратной связи и т.д. Они взаимодействуют между собой по задуманной разработчиком логике, но при этом их можно разрабатывать, тестировать и деплоить как отдельные приложения.

Применение микрофронтов позволяет:
— увеличить эффективность разработки: так как проект разделён на небольшие части, это позволит сконцентрироваться на конкретной задаче и выполнить её быстрее;
— более эффективно планировать время разработки;
— обрести большую гибкость: проще изменять UI и логику небольших частей проекта;
— улучшить качество проекта: разделение на небольшие части помогает легче концентрироваться на них и более качественно прорабатывать.

Узнать о микрофронтендах подробнее, посмотреть пример их реализации и инструменты, применяемые для работы с ними, а кроме того, сравнить их основные преимущества и недостатки вы сможете здесь.

#frontend #js #ts #веб

Как устроена сеть и что такое сокеты

Это видео — база для бэкенд-разработчиков и всех, кто планирует работать с сетью.

Вы узнаете про:
— базовые понятия, связанные с сетью;
— сокеты, что это такое и как с ними подружиться;
— базовые протоколы TCP / UDP и чем они отличаются;
— прикладные протоколы HTTP/SMTP/POP3/IMAP/FTP/SSH/SFTP и другие;
— пулы соединений и таймаутов.

Подробнее: https://youtu.be/8to_I2fMg9Y

#веб #сеть #бэкенд

Детальный справочник для веб-разработчиков от А до Я

Если вы искали ресурс, где в одном месте собрано всё, что нужно знать по фронтенд-разработке, то рекомендуем вам Дока. Здесь собрана информация как по основам вёрстки, так и по фреймворкам, JS и TS. Абсолютно бесплатно!

https://doka.guide/

#шпаргалка #веб #javascript #html #css

Руководство по Webpack для начинающих

Webpack — это статический сборщик модулей. Его основная задача — пакетирование файлов JavaScript для использования в браузере, но он также способен преобразовывать, связывать и упаковывать практически любые ресурсы.

Про основные возможности, пользу и использование в статье:

https://nuancesprog.ru/p/14841/

#webpack #веб

Разработка и деплой сайта с нуля и анимацией

В этом видео вы узнаете, как создать сайт с большим количеством разной анимации, например, одной из самых популярных — parallax-эффект.

Вы научитесь работать с компонентами, используя библиотеку ReactJS, познакомитесь с Framer motion, организуете хранилище с Redux Toolkit (RTK), добавите контент через платформу Contentful и с помощью Graphql получите реальные данные на вашем сайте.

#видео #туториал #веб #react

Что такое сайт, CMS, БД, хостинг, домен?

Полезный ролик для тех, кто хочет лучше понимать суть терминов, которыми богата сфера IT. Как это все устроено и взаимодействует друг с другом?

Здесь простыми словами рассказывают для начинающих о самых важных понятиях в веб-разработке.

❤️ — наконец-то понятным языком
🥱 — слишком просто. Админ, давай что-то посложнее

#видео #веб

Дорожная карта для фронтенд-разработчиков

Здесь собраны основные темы и технологии, которые нужно изучить для становления настоящим фронтендером.

#дорожнаякарта #веб #фронтенд

8 неэффективных практик JavaScript, которых лучше избегать

Самая большая ответственность каждого программиста заключается в том, чтобы написанный им код был легко тестируемым и сохранял работоспособность с течением времени.

Чтобы этого добиться, стоит следовать определённым правил и избегать заведомо плохих практик. О восьми из них можно узнать в этой статье.

#javascript #веб

21 рекомендация по HTML

Нашёл материал для тех, кто решил погрузиться в мир фронтенд-разработки. Здесь собраны довольно базовые советы. Тем не менее, они будут крайне полезны тем, кто только начинает свой путь. Вы найдёте рекомендации по семантической вёрстке, правильному использованию базовых тегов и многому другому.

Подробнее в материале.

#html #веб

Что такое WebRTC — как работает, преимущества и примеры использования

Web Real-Time Communications — относительно новая технология, которая вывела онлайн-коммуникации на принципиально новый уровень. Она имеет открытый исходный код и отвечает за потоковую передачу данных с использованием API JavaScript для связи между браузерами и приложениями в формате peers-to-peers (точка-точка).

WebRTC применяется в таких секторах как образование, управление персоналом и HR, банкинг, страхование, здравоохранение и многих других.

Подробнее о технологии и её особенностях, рассказали в статье.

#webrtc #веб

6 полезных свойств CSS за 10 минут

В этом видео не только собраны полезные свойства, но и показано, где они могут быть полезны и как их правильно применять.

Здесь будет про изменения размера блока, создание галерей, плавный скролл, переворачивание карточек, наложение слоев и смешивание цветов, а также про правильное сохранение пропорций.

Если хотите смотреть оригинал, то он доступен по ссылке.

#видео #css #веб

Медитативное программирование: Делаем бесконечную лестницу на чистом HTML и CSS без лишних слов

#видео #html #css #веб

Вы правда думаете, что знаете все возможности Box Shadows в CSS?

Автор этой статьи с вами бы поспорил. Он так увлёкся изучением этого свойства, что нашёл множество интересных особенностей и хитростей, которые не должны работать, но по какой-то причине работают.

Загляните к нему и посмотрите сами.

#веб #css #ненормальноепрограммирование

Введение в Веб-безопасность

В веб-безопасности есть две основные концепции:

1. Никто на 100% не защищён. Никогда.
2. Одного слоя защиты недостаточно.

Поздравляю, вы знакомы с основами безопасности. Шутка, конечно. Чтобы познакомиться хотя бы с основами безопасности, нужно знать гораздо больше.

Эта статья расскажет вам об основных терминах и аббревиатурах, используемых в веб-безопасности такие, как CORS, CSP, HTTPS и так далее. А также, что они на самом деле значат для разработчиков.

#веб #безопасность

HTTP-запросы: параметры, методы и коды состояния

Когда пользователь вводит URL-адрес сайта в поисковой строке браузера, его устройство инициирует соединение с сервером и отправляет ему HTTP-запрос — сообщение с некой информацией. В запросе может быть что угодно.

В этой статье вы рассмотрите, как общаются серверы и устройства пользователей: что такое HTTP-сообщение, какая у него структура и из чего состоит HTTP-запрос и ответ. А также вскользь затронете сам протокол HTTP и его основы.

https://habr.com/ru/companies/timeweb/articles/853174/

#http #основы #веб

Создание сайта с адаптивной вёрсткой с нуля

В этом видео вы узнаете, как создать сайт на html и css с нуля, также познакомитесь с методологией БЭМ, которая используется во многим проектах. Но самое главное, вы увидите, как правильно сделать адаптивную вёрстку сайта.

Оригинал остался здесь.

#видео #веб #курс

Что происходит, когда вы вводите адрес сайта и нажимаете Enter

Несмотря на фундаментальность вопроса, в нем ошибаются или не могут дать точного ответа даже Senior-разработчкии. Что уж говорить о джунах.

Но теперь вы можете разобраться в вопросе благодаря этой статье. Здесь без сложных терминов вы изучите процесс от ввода URL до полной загрузки и отображения страницы в браузере.

#веб #сеть