Руслан Куянец | Reactify

Всем привет! Мало кто знает, что у нас еще есть чат. Если у вас возникли вопросы, проблемы, вы можете писать туда.

Разрешено общение не только на технические темы. Если вам есть, чем поделиться то смело пишите. Если вы хотите поболтать, обсудить что-нибудь - пишите.

Если у вас есть предложения, советы по контенту - пишите.

Reactify Community

Как у вас прошел первый рабочий день в году?

У меня он начался с раннего подъема в 6:00 и похода в тренажерный зал, после него уже сел работать, еще бросил кофе💪

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

В первый день восстановил режим, потерянный 3 месяца назад😅
Все, теперь становлюсь опять супер продуктивным.

Курс по HTML добавил в Reactify Academy. Осталось настроить до конца платформу. Вот вот появится "Убийца платных курсов"🤞😁

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

Очень долго растянулась вся эта история. Я думал все будет намного быстрее. Ну ничего, я получил опыт и каждый последующий курс будет добавляться быстрее. На выходных хочу уже снять пару новых видео(разговорная тема). Со следующей неделе начать сбор Команд, параллельно написание курса по CSS.

Способы преобразования строки в число в JavaScript

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

1️⃣ parseInt()

Функция parseInt() анализирует строку и возвращает целое число. Она принимает два аргумента: строку для преобразования и основание системы счисления (опционально, по умолчанию 10).

let str = "123";
let num = parseInt(str, 10); // 123

2️⃣ parseFloat()

Функция parseFloat() анализирует строку и возвращает число с плавающей точкой. Она отличается от parseInt() тем, что может обрабатывать дробные числа.

let str = "123.45";
let num = parseFloat(str); // 123.45

3️⃣ Унарный плюс (+)

Простой и быстрый способ преобразования строки в число - использовать унарный плюс. Этот метод работает как с целыми числами, так и с числами с плавающей точкой.

let str = "123";
let num = +str; // 123

let floatStr = "123.45";
let floatNum = +floatStr; // 123.45

4️⃣ Number()

Функция Number() преобразует значение к числовому типу. Если значение не может быть преобразовано в число, она вернет NaN.

let str = "123";
let num = Number(str); // 123

let notANumber = "abc";
let result = Number(notANumber); // NaN

5️⃣ Оператор двойного тильды (~~)

Оператор двойного тильды ~~ является битовым оператором, который эффективно усекает дробную часть числа, аналогично Math.floor(), но быстрее. Он полезен, когда вам нужно преобразовать строку в целое число.

let str = "123.45";
let num = ~~str; // 123

6️⃣ Умножение на 1

Умножение строки на 1 - это простой способ преобразовать её в число. Этот метод эффективен как для целых, так и для дробных чисел. Происходит неявное приведение типа, где строка преобразуется в число благодаря операции умножения.

let str = "123";
let num = str * 1; // 123

let floatStr = "123.45";
let floatNum = floatStr * 1; // 123.45

#JavaScript #string #number

Элементы section, aside, и article

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

Элемент section:

Этот элемент используется для группирования смыслового содержания на веб-странице. Каждый section должен сосредотачиваться на отдельной теме или группе тем, которые логически связаны между собой.

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

Элемент aside:

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

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

Элемент article:

Элемент article используется для обертывания независимого, самодостаточного контента, который можно перенести в другой контекст, не потеряв смысл. Это может быть статья, блог-пост, комментарий, форумное сообщение и т.д.

Пример: В интернет-журнале каждая статья будет обернута в элемент article, так как она самодостаточна и может быть опубликована отдельно от остального содержимого сайта.

#html

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

Если у кого-то есть премиум, то можно проголосовать😎

Сегодня встал рано чтобы добить курс по html. С 7 утра на ногах. Нужно уже восстанавливать режим👌🏻

https://t.me/reactify_IT?boost

Сериализация в JavaScript

Сериализация - это процесс конвертации объекта в строку. В контексте JavaScript, это обычно означает преобразование объектов в формат JSON (JavaScript Object Notation). JSON - это текстовый формат, который легко читается как людьми, так и машинами. Он идеально подходит для передачи данных между сервером и клиентом в веб-приложениях.

const user = {
  name: "Иван",
  age: 30
};

JSON.stringify(user);
// Результат: '{"name":"Иван","age":30}'

Зачем нужна сериализация?

- Передавать данные между клиентом (браузером) и сервером.

- Сохранять состояние объекта в базе данных или файле.

- Поддерживать формат, совместимый с множеством языков программирования и платформ.

Десериализация

Это обратный процесс, при котором строка в формате JSON преобразуется обратно в объект JavaScript. Для этого используется метод

JSON.parse(serializedUser);
// Воссоздаем объект: { name: "Иван", age: 30 }

#JavaScript

REST API

REST API (представительский интерфейс передачи состояний) – это стандарт взаимодействия программ и сервисов через HTTP-запросы, играющий важную роль в веб-разработке.

Основные концепции:

Ресурсы и URL: REST API оперирует понятием "ресурсов" (данные или функции), каждый из которых идентифицируется уникальным URL.

HTTP-методы: Взаимодействие с ресурсами осуществляется стандартными методами: GET для получения данных, POST для создания, PUT для обновления и DELETE для удаления.

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

Преимущества REST API:

Универсальность: Может использоваться в любых приложениях, способных отправлять HTTP-запросы.

Простота использования: Интуитивно понятен благодаря стандартным HTTP-методам.

Масштабируемость: Отсутствие сохранения состояния сервером обеспечивает лучшую масштабируемость.

REST API облегчает интеграцию различных веб-сервисов и приложений, предлагая гибкость и эффективность в создании веб-решений.

#restapi #api

WEB 3.0

Уже год как я задумываюсь о начале изучения Rust, Web 3.0 и Blockchain. Считаю, что важно идти в ногу со временем. После запуска и получения опыта работы с командами, я планирую приступить к созданию Open Source проекта на основе Web 3.0 технологий.

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

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

Так что, начиная с января, я планирую постепенно погружаться в изучение Rust и Blockchain. Через полгода, надеюсь, мы начнем работу над стартапом. К этому времени наше сообщество расширится, и каждый из нас наберется необходимого опыта.

Окей Google, как стать Senior Web 3.0 Разработчиком за 6 месяцев?

Организация Reactify Teams

Я имею опыт работы по Scrum и Kanban и знаю, что работа в качестве разработчика и участие в организации процессов — это две разные вещи. Теперь для меня, как и для многих из вас, участие в Reactify Teams становится новым этапом. Это похоже на изучение курса по React в течение месяца, а затем попытку написания приложения. Скорее всего, просто посмотрев курс без практики, вы ничего не сможете написать. То же самое и здесь: даже после 10 лет работы в командах, организация процессов может оказаться сложной задачей.

В настоящее время, в дополнение к завершению работы над Академией, я активно готовлюсь к работе с командами. Это новый шаг в моем развитии, и я рад, что могу совместить это с помощью вам. Мы вместе учимся: я — управлять командой, а вы — работать в команде.

Хочу уточнить: это не курс Ulbi TV, где я буду учить вас новым технологиям и инструментам. Это бесплатная практика, где я собираю команду, организую процесс, помогаю и делюсь опытом.

Ваше активное участие тоже важно. Предлагайте инструменты, технологии, методы оптимизации. Мы будем работать как настоящая команда: проводить созвоны, общаться, помогать друг другу. Каждый вносит свой вклад. По мере расширения сервиса мы будем нанимать новых участников, проводить Code review и предлагать улучшения. Это отличная возможность для роста каждого участника.

#teams

Reactify Teams

Во время праздников продумывал организацию Команд. Мы сразу же будем делать большой проект (тему придумаем с вами). Проект должен быть максимально приближен к коммерции.

Внутри сервиса у нас будет несколько приложений:

- Админ панель
- Клиентское приложение
- Сайт
- UI kit
- Бекенд

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

Отбор будет проходить следующим образом:

- Вы отправляете свое резюме (Стек, опыт, немного о себе)
- Небольшой собес
- Решение

Первые ребята будут со мной настраивать проекты. Когда проекты будут настроенны, я повышаю ребят до R-Middle/Senior Разработчиков. Мы будем вместе проводить собесы и возьмем еще несколько человек (до 10-14). Я хочу чтобы как можно больше людей имели возможность практиковаться. Поэтому такой большой проект.

Для удобства разработки у нас будет на фронте FSD. Тут все по модулям, разработчики не будут мешать друг другу. Каждый будет заниматься своей сущностью/фичами/виджетами.

Бекенд сделаем так же модульно. Разобьем по сущностям/сервисам.

Предпочтительный стек:

- React
- Next Js
- css module
- Vite
- Redux/Signals
- Typescript
- Storybook

- Node Js
- Nest Js
- Postgresql/MongoDB
- Typeorm
- Typescript

Стек можно менять. Будем решать что убрать/добавить/изменить

#teams

Уважаемые Единомышленники,

Поздравляю вас с наступлением Нового 2024 года! Этот год обещает быть полным новых возможностей и достижений, особенно в области обучения и развития в сфере программирования.

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

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

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

Благодарю вас за то, что вы с нами и вкладываете свои силы в развитие нашего сообщества. Ваши сообщения и обратная связь, будь то в личных сообщениях, комментариях на YouTube или здесь, оказывают неоценимую поддержку и вдохновляют на новые достижения. Вместе мы создаём сообщество Reactify, где каждый готов помогать друг другу и совместно творить. Ваша активность и участие — это та сила, которая движет нас вперёд.

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

С уважением и наилучшими пожеланиями,

Reactify | Руслан

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

Сильно подвело желание запустить своё приложение(не Академия). Много времени ушло на его разработку, старался улучшить и добавить как можно больше функций. Нужно было давно запустить его с минимально необходимым функционалом. Из-за этого все планы были нарушены.

С чего начну 2024 год?

- Reactify Academy. Нужно запустить платформу и заполнять её, добавлять больше курсов и тестов.
- Reactify Teams. Собрать как можно быстрее первую команду и начать разрабатывать совместный проект.
- YouTube канал. Нужно увеличивать количество контента, выпускать больше видео и начать снимать Shorts.
- Менторинг. Академия, команды и YouTube помогут достигнуть цели - стать фронтенд-разработчиком бесплатно. Но у занятий с ментором очень много преимуществ. Я сниму об этом видео позже.
- Партнерство и интеграции. Хочу привлекать в академию авторов, а в команды - опытных разработчиков, которые будут делиться своим опытом и возглавлять команды новичков. Ещё нужно как-то взаимодействовать с другими блогерами и авторами 😅 Что-нибудь придумаем.

На самом деле планов ещё больше. Я их все выписываю. Не буду их говорить, а то и так уже много вам наобещал, а в итоге ещё ничего нет 🥲

Цели на 2024 год:

- Reactify Academy. Заполнена всеми возможными авторскими курсами по frontend и backend разработке (HTML, CSS, JS, React, TS, Redux, Next, Nest, Vue, Angular и т.д.). Много статей, тестов и ивентов. Большая аудитория.
- Reactify Teams. 20+ постоянных команд, участники которых постоянно переходят из проекта в проект, обмениваются опытом.
- YouTube. 20,000 подписчиков.
- Telegram. 10,000 подписчиков.
- Стартап. Начать реализовывать своё приложение/сервис.

Я в холле отеля, жду жену, и мы выдвигаемся к родным. 💪

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

Родственники и друзья из разных регионов тоже приехали. Праздники обещают быть весёлыми. В свободное время буду работать, так как нужно много всего доделать. Как обычно, ничего не успеваю 😅

Без снега, конечно, не то же самое 😬. Но ничего, на праздниках планирую съездить в Архыз, чтобы покататься на сноуборде 🏂. Там много снега.

Всем отличных праздников, с наступающим! 🎄

Пожелаю вам всего, когда буду поздравлять с Новым годом 😎

Проверка значений на истинность или ложность в JavaScript

При работе с JavaScript, одной из ключевых задач является проверка значений на истинность или ложность. В этом контексте часто возникает вопрос: использовать ли Boolean() функцию или же применять более прямой подход через преобразование типов.

Использование Boolean()

Функция Boolean() в JavaScript используется для преобразования любого значения в булевый тип (true или false). Это явный способ проверки, позволяющий легко понять, что происходит в коде.

Прямое Преобразование Типов

Можно также применять прямое преобразование типов. Это делается с помощью логических операторов, таких как ! (логическое НЕ). Двойное использование !! эффективно преобразует значение в его булевый эквивалент.

Выбор между !! И Boolean()

✅ Boolean() является более явным и легко читаемым, особенно для начинающих разработчиков.

✅ В некоторых командах предпочитают использовать Boolean() для единообразия кода.

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

#JavaScript

Отличие || и ?? в JavaScript

В программировании операторы || и ?? играют разные роли, хотя оба они используются в контексте работы с значениями, которые могут быть неопределенными или иметь значение "по умолчанию".

Оператор || (Логическое ИЛИ)

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

false, 0, "", null, undefined, NaN

Оператор ?? (Оператор нулевого слияния):

Так же используется для установки значения по умолчанию, только под ложными подразумеваются:

null, undefined

Отличия операторов

Основное отличие между этими операторами заключается в их поведении при работе с различными "ложными" значениями. Оператор || реагирует на любое ложное значение, в то время как ?? реагирует только на null или undefined.

Это делает ?? более предсказуемым при работе с возможными "пустыми" значениями, так как он не считает такие значения, как 0, false, или пустую строку (""), равными null или undefined.

#JavaScript

Цели

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

Действительно, заниматься разработкой приложения в одиночку — это долго и неэффективно. Я хочу получить опыт в Reactify Teams. Через полгода я вернусь к своей идее, но уже с командой. Для меня это ценный навык — собирать и управлять командой, участвовать в процессах создания продукта. Поэтому участие в команде бесплатное. Все честно, и мне, и вам — опыт. Хотя многие разработчики берут за это деньги.

Сейчас кажется, что мне нужно сосредоточиться на развитии Reactify Academy и Reactify Teams, а также на ведении YouTube и Telegram каналов. Важно быть активным членом IT-сообщества, и это поможет мне достигнуть моих целей.

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

#teams #academy

Операторы в JavaScript

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

Арифметические Операторы:
Используются для выполнения обычных математических операций, таких как сложение (+), вычитание (-), умножение (*), деление (/), и нахождение остатка от деления (%).

Операторы Сравнения:
Позволяют сравнивать значения. Включают в себя равенство (== или === в некоторых языках), неравенство (!= или !==), больше (>), меньше (<), больше или равно (>=), меньше или равно (<=).

Логические Операторы:
Применяются для формирования логических выражений. Основные логические операторы – это И (&&), ИЛИ (||), и НЕ (!).

Операторы Присваивания:
Используются для присвоения значений переменным. Простое присваивание происходит через оператор =, а также существуют операторы комбинированного присваивания, такие как +=, -=, *= и т.д.

Унарные Операторы:
Это операторы, которые применяются к одному операнду. Примеры включают инкремент (++), декремент (--), и унарный минус, который меняет знак числа.

Тернарный Оператор:
Уникальный оператор, который принимает три операнда. Обычно используется как короткая форма для выражения if-else. Структура выглядит так: условие ? выражение1 : выражение2.

Операторы Разделения:
В некоторых языках программирования, таких как JavaScript, операторы разделения (...) позволяют расширять элементы итерируемых объектов (например, массивов) в местах, где ожидается несколько аргументов или элементов.

#JavaScript

Обучение

Вообще я хочу сделать полный цикл развития в Reactify. Обучаться с 0 до Джуна в Reactify Academy, после этого практиковаться и получать опыт в Reactify Teams.

Еще хочу в следующем году привлекать авторов/опытных разработчиков в Reactify. Для того чтобы сделать как можно больше команд нужны опытные наставники, которые будут помогать мне. А так же вести лекции, проводить собесы, проверять знания, писать статьи и мини курсы на платформу.

Хочу большое IT сообщество. Следующий год будет насыщенным. Всего добьемся🤞

#teams #academy