South Hub — IT-кэмп в Сочи для СТО и тех, кто хочет ими стать  
Когда? 
6 – 8 октября 
Где? 
Красная Поляна, Сочи 
Зачем? 
Подняться на уровень выше. Профессионально и физически.  
 
В отеле Novotel Congress соберутся 400 IT-руководителей, тех директора и CEO. На протяжении 3-х дней 45 спикеров будут делиться с участниками своим опытом и мыслями о будущем отрасли в формате лекций и бесконечного нетворкинга.  
Помимо конференц-части гостей ждут зрелищные спортивные турниры в баскетбол, FIFA 23 PS 5 и Го, хайкинг по горам, утренние пробежки, много неформального общения, а также вечеринка на закате на высоте 2 200 метров. 
Все подробности о кэмпе можно найти на сайте:  
https://i.southhub.ru/zhNMv

Разработка PWA 

Делимся ссылкой на бесплатный курс по разработке PWA(Progressive Web Applications - прогрессивные веб-приложения). 

Курс охватывает основы создания PWA приложений. Вы узнаете: 
- что такое прогрессивное веб-приложение;
- как его создать или обновить существующий контент;
- что такое service workers и многое другое.

Ссылка на курс

#js

Grid.js - это плагин для создания красивых таблиц, написанный на TypeScript. Он может использоваться в React, Angular, Vue приложениях, а также без каких-либо библиотек и фрэймворков. 

Минифицированная и сжатая версия весит 12КБ. Таблицы Grid.js легко кастомизируются и стилизуются.

Примеры таблиц смотрите на сайте!

Ссылка на официальный сайт

#инструменты

react-use - это библиотека с коллекцией полезных React хуков.

Например:
useNetworkState — отслеживает состояние сетевого подключения браузера;
useOrientation — отслеживает состояние ориентации экрана устройства;
usePageLeave — срабатывает, когда мышь покидает границы страницы;

Более 90 хуков!

Ссылка на GitHub

#react

sails.js - это MVC фрэймворк для создания Node.js приложений. Разработчики sails.js вдохновились архитектурой и подходом к разработке приложений у Ruby On Rails и решили создать нечто подобное на JavaScript.

Он построен на Node.js, Express и Socket.io. Имеет низкий порог вхождения.

Ссылка на официальный сайт

#nodejs

Super Designer - это коллекция бесплатных инструментов для создания уникальных фонов, градиентов, узоров, форм, изображений и многого другого. Результат доступен в формате SVG, PNG, JPG или CSS кода.

Ссылка на сайт

#дизайн

Нотация Big O

В программировании одну задачу можно решить различными способами. Поскольку существуют различные способы, должен быть и способ оценить эти решения или алгоритмы с точки зрения производительности и эффективности.

Нотация Big O — это метрика для определения эффективности алгоритма. Она позволяет оценить, как долго код будет работать с различными наборами входных данных, и измерить, насколько эффективно код масштабируется по мере увеличения размера входных данных. 

Подробно о Big O читайте в статье!

Ссылка на статью

#статьи

HTML-элементы, которые никто не использует

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

Например, <datalist> позволяет добавлять список предложенных вариантов для автозаполнения у элементов ввода. 

Полный список читайте в статье!

Ссылка на статью

#html

Total TypeScript - это ресурс с материалами для изучения TypeScript. На сайте есть бесплатный курс из 18 уроков и коллекция полезных советов. 

Ссылка на сайт

#js

Day.js - это библиотека для работы с датами в JavaScript, альтернатива Moment.js. 

Она весит всего 2KB, имеет тот же синтаксис и те же функции, что и Moment.js и отлично поддерживает интернационализацию.

Ссылка на сайт

#инструменты

Framer Motion - это готовая библиотека aнимации для React приложений.

С помощью нее можно создавать слайд-шоу, табы, реализовывать функционал, который позволит пользователю перемещать элементы и многое другое.

Примеры смотрите на сайте! 

Ссылка на сайт

#react

Node.js 19

Вчера был выпущен Node.js 19. Изменения включают обновление движка JavaScript V8 до версии 10.7 и HTTP(S)/1.1 KeepAlive включен по умолчанию. Но это не все обновления. Подробнее читайте в анонсе!

Ссылка на статью

#nodejs

blob animation

Делимся ссылкой на генератор, с помощью которого можно создавать плавные анимированные blob-фигуры (фигуры в виде капель). На выходе получается готовый анимированный SVG. 

Ссылка на генератор

#дизайн

DNS и HTTPS

Делимся ссылкой на коллекцию комиксов, где объясняется, как работает HTTPS, DNS, DNSSEC.

Нескучно и познавательно! 

Ссылка на сайт

#статьи

Освоить веб-разработку с нуля за 10 месяцев — реально, хотя и непросто. Придётся сократить время на хобби, заниматься после работы и до неё, искать дополнительные материалы и подолгу думать над задачами.

Но оно того стоит: в конце пути — новая профессия и интересная работа. А Яндекс Практикум поможет не сбиться с курса.

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

Если не справляетесь с делами, то два раза за курс можно взять академический отпуск на месяц. Если на базовой программе тяжело, снизить темп поможет расширенная программа, которая длится 18 месяцев. Учёба будет размеренной, а программа более фундаментальной.

Оплата учёбы работает в формате подписки: платежи проходят каждый месяц, и вы можете остановить их в любой момент.

Протестируйте формат курса бесплатно →

CSS toggles 

Все знают хак с чекбоксом для создания переключателя и он до сих пор является популярным способом для создания “toggle effect” на чистом CSS.

Но в скоро будущем возможно появится официальный функционал для создания переключателей. CSS toggles сейчас на стадии предложения и пока экспериментальная реализация появилась в Chrome Canary.

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

Cсылка на статью

#css

Temporal API 

Работать с датами в JavaScript немного проблематично, вот почему часто используются готовые библиотеки.

Было предложено добавить новое API для работы с датами - Temporal API. Основная цель нового API — упростить работу с датами и временем в JavaScript, а также добавить дополнительную поддержку таких вещей, как даты без времени, время без дат и часовые пояса.

Пока новинка на 3 стадии предложения. Подробнее о ней читайте в статье!

Cсылка на статью

#js

Algorithm Visualizer - это интерактивная онлайн-платформа, которая визуализирует алгоритмы из кода.

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

Доступные языки: JavaScript, Java и C++.

Через визуализацию изучение становится проще!

Cсылка на сайт

#инструменты

react-draggable - это компонент для создания перетаскиваемых элементов. 

Дочерние элементы, обернутые в этот компонент получают возможность перетаскивания. В репозитории можно найти ссылку на демо и подробную информацию об использовании.

Cсылка на репозиторий

#react

Icônes – это ресурс с коллекциями иконок, среди которых есть Material Design Icons, Ant Design Icons, Bootstrap Icons и другие. Выбор огромный!

Cсылка на сайт

#дизайн

JAMstack

Многие думают, что JAMstack - это какая-то новая технология. 

На самом деле, это новый архитектурный подход к созданию современных веб-сайтов, основанный на клиентском JavaScript, повторно используемых API и предварительно созданной разметке. 

Кстати, аббревиатура JAM расшифровывается, как:
J - JavaScript,
A - API,
M - Markup.

Подробнее о нем и его преимуществах можно почитать на официальном сайте.

Cсылка на сайт

#статьи