Руслан Куянец | Reactify x YeaHub
前往频道在 Telegram
Я IT-специалист, ментор и основатель проекта YeaHub и сообщества Reactify. Здесь рассказываю про Frontend и IT. Менторство: https://reactify.ru YouTube канал: https://youtube.com/@reactify-it YeaHub: https://yeahub.ru/ Связь: @ruslan_kuyanets
显示更多6 301
订阅者
-1024 小时
-1087 天
-14730 天
帖子存档
Всем привет! Мало кто знает, что у нас еще есть чат. Если у вас возникли вопросы, проблемы, вы можете писать туда.
Разрешено общение не только на технические темы. Если вам есть, чем поделиться то смело пишите. Если вы хотите поболтать, обсудить что-нибудь - пишите.
Если у вас есть предложения, советы по контенту - пишите.
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.454️⃣
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
🚀 Подними свои фронтенд-скиллы на новый уровень с True Frontender! 🚀
👨💻 Изучаешь фронтенд или хочешь поднять свой грейд? Хочешь успешно проходить собеседования?
True Frontender – это твой навигатор в мире кода!
💡 На канале True Frontender тебя ждет:
- Полезные советы на основе реального опыта работы
- Примеры задач, которые встречаются на собеседованиях
- Фишки и авторские статьи по React, TypeScript, JavaScript, CSS, HTML
- Советы которые помогут сделать твой код чище и компактнее
- Рекомендации по улучшению качества твоего кода
🌟 True Frontender – это не просто канал, это твой путь к мастерству в фронтенде. Развивайся как в технических, так и в творческих аспектах разработки.
🔥 Присоединяйся сейчас – будущее твоего кода начинается здесь! 👉 @truefrontender 🚀
Вы работаете в IT-сфере. Представьте, что зарплата на вашей текущей позиции (например, middle специалист) снижается с 150 000 рублей. Какое уменьшение зарплаты стало бы для вас критическим? (не конкретно в вашей компании, а вообще во всей сфере)
Всем привет! В телеге много кастомных штук для каналов за голоса. Можно добавлять имодзи, менять внешний вид и тд.
Если у кого-то есть премиум, то можно проголосовать😎
Сегодня встал рано чтобы добить курс по 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Войти в IT создали годный проект для всех Frontend разработчиков:
1️⃣ Прокачай свои навыки программирования без особых усилий
2️⃣ Каждый день на канале выходят курсы и статьи от ведущих специалистов на рынке IT
3️⃣ Больше не нужно тратить кучу времени на поиск хороших, бесплатных обучающих материалов в интернете
P.S. Мы сами уже давно подписаны и иногда берем контент у них 😏
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
🔤 У нас часто спрашивают: "Какие каналы мы читаем в телеграме?"
Хотим посоветовать крутой канал CodeRoll | Frontend, где вы найдете:
- задачи для собеседований
- полезные статьи и новости для разработчиков
- необычные инструменты для веб-разработки
✅
Не реклама, личная рекомендация.Отличие || и ?? в 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
