Руслан Куянец | Reactify – Telegram
Руслан Куянец | Reactify
5.84K subscribers
704 photos
52 videos
39 files
287 links
Я IT-специалист, ментор и основатель проекта YeaHub и сообщества Reactify. Здесь рассказываю про Frontend и IT.

Менторство:
https://reactify.ru

YouTube канал:
https://youtube.com/@reactify-it

YeaHub:
https://yeahub.ru/

Связь:
@ruslan_kuyanets
Download Telegram
This media is not supported in your browser
VIEW IN TELEGRAM
Уже монтирую видеокурс по html ✌️
Пока что все получается отлично. Очень хорошо проработал сценарий и текст, чтобы новички все поняли, но и ребята по старше не заскучали😅

Самый подробный курс будет, при этом минимум воды, имхо.
🔥17👍42
Тем временем🚀

Видео по TypeScript уже 7300 просмотров

Подписчиков на канале 1664
👏19👍32🔥1
Множественные асинхронные запросы

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

Использование Async/Await:
- Последовательное выполнение запросов.
- Каждый запрос выполняется один за другим.
- Полезно, когда второй запрос зависит от результата первого.

Использование Promise.all:
- Параллельное выполнение всех запросов.
- Оптимально для независимых запросов, когда порядок не важен.
- Если один из промисов отклоняется, весь Promise.all отклоняется.

Использование Promise.allSettled:
-Также выполняет запросы параллельно.
-Возвращает результаты всех запросов, включая успешные и неудачные.
-Полезно для обработки ситуаций, когда нужен результат каждого запроса, независимо от успеха или неудачи.

Использование Цикла For...Of с Async/Await:
-Последовательное выполнение запросов для каждого элемента в массиве.
-Подходит для сценариев, где требуется обрабатывать элементы массива по очереди.

#JavaScript #обучающийПост #promise #async
👍8👨‍💻311
Использование буфера обмена в JavaScript и React

Буфер обмена — это временное хранилище для данных, которые пользователи копируют (Ctrl+C) или вырезают (Ctrl+X), чтобы вставить (Ctrl+V) их в другом месте. JavaScript предоставляет несколько способов взаимодействия с буфером обмена, что особенно полезно в веб-приложениях.

Для доступа к буферу обмена мы используем Clipboard API

#обучающийПост #JavaScript #react #clipboard
👍17👌2👨‍💻2
Вот о чем подумал

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

Реально, Магнит, Леруа, Хендерсон, Спортмастер, Лента, Метро, О'Кей, Лукойл, Газпром, Пятерочка — все создают приложения для того, чтобы учитывать бонусы, предлагать акции, делать рассылки, организовывать доставку товаров. Даже у различных кофеен и ресторанов есть свои приложения.

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

А ещё сейчас почти все новые жилые комплексы имеют системы 'умного жилого комплекса'. Часто вижу вакансии в строительные компании для разработки таких систем.

У меня у самого куча разных приложений уже😅 просто реально стал замечать, что все больше компаний создают свои приложения)
👍7🤪3🤔1
Подборка библиотек для вашего приложения

1️⃣ react-advanced-cropper: Инструмент для обрезки изображений с настраиваемыми параметрами и интерактивным интерфейсом.

2️⃣ react-calendar: Компонент календаря для выбора дат, предоставляющий легкую интеграцию в формы и интерфейсы.

3️⃣ dayjs: Легковесная библиотека для обработки и форматирования дат, предлагающая простой и интуитивно понятный API.

4️⃣ three: Библиотека для создания 3D-графики, используемая с React через обертки, такие как react-three-fiber, для визуализации 3D-сцен.

5️⃣ swiper: Слайдер с широким спектром настроек для создания динамических и адаптивных слайд-шоу.

#libs
👍71🔥1
Хук useToggle

Хук useToggle в React — это удобный инструмент для управления состояниями, такими как открытие/закрытие, включение/выключение. Это простой способ переключения между двумя состояниями (обычно true и false) в компонентах. Особенно полезен для интерактивных элементов UI, таких как кнопки переключения, скрытие и отображение элементов и т.д. useToggle повышает читаемость кода и упрощает управление состоянием.

#react #code #useToggle #hook
👏8👍4
Недавно наткнулся на статью, что Google экспериментирует с использованием элемента <canvas> для рендеринга полных веб-страниц. Это подразумевает отрисовку всех элементов страницы, включая текст, кнопки, хедер и футер, через <canvas>.

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

Но тут, конечно, возникает вопрос - а как же быть с СЕО, ведь роботы не смогут увидеть, что у вас на <canvas>😅

Прикол конечно, вы заходите на страницу и там в <body> сразу идет <canvas>, а все блоки нарисованы.
😁7😱3
Мой первый поиск работы

Все мое обучение заняло около года. Из этого времени на изучение Frontend я потратил всего 7 месяцев. Остальные 5 месяцев были посвящены поиску себя, так как я не знал, что учить и каким программистом стать. Не имея четкого плана, я провел 5 месяцев в никуда.

Когда я освоил React, Redux, Router, пришло время искать работу, но я сомневался в себе. Боялся, что недостаточно хорош и что мне нужно еще немного поучиться. Ведь в Roadmap было столько всего - Next.js, Node.js, ESLint, Webpack, TypeScript и т.д.

Я очень боялся проходить собеседования. Первый отклик я отправлял около 30 минут, весь вспотел и перенервничал, прежде чем нажал одну кнопку. Как я себя переборол? Просто нажал кнопку, ведь отклик - это не приглашение. 😅

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

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

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

Спустя 2 недели я нашел свою первую работу.🎉

Продолжение следует... Если поддержите Лукасами, то завтра напишу о своей первой работе

#story_1
👍31🔥31👏1
Вообще думаю создать фейковое резюме и попробовать получить приглашение на Junior позицию без опыта.

Поэкспериментировать с фрилансом, сопроводительными письмами.

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

Как идея? 💡
👍47🔥12🤝21
Моя первая работа

Моя первая работа была в аутстаффинговой компании. Компании сдают своих работников в аренду в другие компании/проекты и за это получают деньги. В Аутстаф набирают много джунов. Джунов нет смысла сдавать в аренду, но зачем их тогда набирают? Чтобы выдать за Мидл+/Сеньора.

Джунов готовят к собесам, прилизывают резюме, накручивают 3 года опыта в крутых проектах. Вам как шпиону прорабатывают историю, которую вы учите и потом на собесе рассказываете. Вы вместе с вашим ментором вместе проходите собес, он сидит за камерой и подсказывает вам, пишет ответы и решает задачи. (Все это разумеется незаметно для собеседующей компании)

В итоге Джуна с 2-3 месяцами опыта продают на Сеньорскую позицию в европейскую компанию с окладом 4-5к долларов месяц. Разумеется Джуну достается 20к рублей, остальное идет в компанию.

Большинство задач однотипные в любой работе. 70% ты делаешь интерфейсы без сложной логики. А когда проступает сложная задача то тебе помогает ментор. Без ментора ты не должен общаться с командой в которую тебя закинули, не можешь отвечать на сообщения и участвовать в созвонах. Прежде чем запушить код, его проверяет твой ментор.

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

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

Продолжение следует… Если поддержите Лукасами, то завтра напишу почему уволился спустя 6 месяцев

#story_1
👍51😱3🔥2👏2
Промисификации в JavaScript

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

Самый простой пример это setTimeout(callback, delay). Как раз таки тут мы передаем колбек который должен выполнится по истечении какой то задержки.
Так же fs.readFile(filePath, 'utf8', callback) функции чтения файла в Node.js

Как работает промисификация:

- promisify принимает функцию func, основанную на колбеках.
- Возвращает новую функцию, которая, когда вызывается, возвращает промис.
- Внутри промиса вызывается исходная функция func с переданными аргументами и дополнительным колбеком.
- Этот колбек (callback) обрабатывает результат или ошибку и вызывает resolve или reject соответственно.

#promisify #JavaScript #promise
👍62🤓2
Мое увольнение

Это была моя первая официальная работа. Классный офис, зона отдыха с большой плазмой, YouTube, PS4. Чай, кофе, снеки, фрукты, конфеты, печенье - всё, как на картинках из крутых офисов Яндекса и Google.

Мы отмечали каждый праздник: компания дарила нам подарки, заказывала доставку еды. По пятницам мы оставались в офисе, играли в настольные игры или смотрели фильмы. Для нас заказывали кучу пицц и роллов. Каждый четверг проводились мероприятия - викторины, командные игры, а также "технические четверги", где кто-то выступал с презентацией на техническую тему. Я выступил с темой ООП.

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

Мой первый корпоратив в этой компании прошёл в прикольном кафе с банкетом, ведущим, танцами и конкурсами.

Но был и обратный момент: первый месяц я работал без зарплаты. Второй месяц моя зарплата составила 10 тысяч рублей, третий - 15 тысяч, а последующие месяцы - 25 тысяч. Я быстро рос профессионально, выполнял все задачи и даже работал дома. В пути на работу и обратно я читал книги и документацию.

Когда я попросил о повышении зарплаты, мне отказали, обещая повышение на 10 тысяч только через месяц. Я сказал, что подумаю. Конечно, я мог согласится и пока не нашел новую работу получать зарплату. Но я так не мог. В четверг я сказал что увольняюсь и начал искать работу. Мне нужно было доработать до понедельника. За выходные я сделал 4 технических задания и меня пригласили на 4 собеседования. В понедельник после последнего дня я прошел 2 собеседования и получил два оффера. Остальные проходить не стал. Выбрал компанию где больше понравилось. Работаю в ней до сих пор. Зарплату предложили почти в 3 раза больше чем было.

Продолжение следует...

#story_1
👍17🔥32
Как думаете плохо поступил? Меня вырастили, кормили пиццами, а я ушёл
👍81🔥1