Руслан Куянец | 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
YeaHub Опрос

Всем привет, буду благодарен если вы пройдете небольшой опрос с вариантами ответов. Это поможет нам в разработке платформы. Займет менее 5 минут👌

https://forms.gle/JtxKyFKbQKrEmDVg6
👌4👍3🔥1
YeaHub Новости

Мы в процессе настройки Frontend нашего приложения. Пока ждем дизайн, без дела не сидим. Также настроили UI Kit репозиторий.

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

Backend уже активно разрабатываем. Скоро появится авторизация и некоторые CRUD операции по добавлению Этапов проверки, Вопросов, Профессий и т.д.

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

Скоро приступим к разработке интерфейса.

https://github.com/YeaHubTeam/yeahub-web-client
https://github.com/YeaHubTeam/yeahub-ui-kit
https://github.com/YeaHubTeam/yeahub-backend

#yeahub
👍6🔥2🫡2
Babel

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

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

Совместимость: Позволяет использовать новые функции JavaScript, не беспокоясь о поддержке старых браузеров.

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

Интеграция в проект:

Интеграция начинается с установки через npm или yarn, включая babel-core и babel/preset-env. Конфигурация производится через файл .babelrc или babel.config.js, где указываются нужные пресеты и плагины.

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

#babel #JavaScript
👍6👌2🔥1
Реализация функции filter в JavaScript

Когда на собеседованиях задают задачу реализовать какой-либо существующий метод JavaScript, цель состоит не только в том, чтобы проверить ваши знания языка, но и в том, чтобы увидеть, насколько хорошо вы понимаете механизм работы методов изнутри. Рассмотрим такой пример на методе filter.

Метод filter является стандартным методом массивов в JavaScript, который используется для фильтрации элементов массива по определенному критерию. Он делает это, применяя функцию обратного вызова (callback) к каждому элементу исходного массива и создавая новый массив из элементов, для которых функция обратного вызова возвращает true.

Основные принципы работы метода filter:

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

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

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

#JavaScript #собеседование #filter #array
👍9🔥2👌1
Всем привет, нужно еще немного ответов🥺

Пройдите пожалуйста опрос. Очень важно знать. Опрос быстрый, всего 11 вопросов, не надо отвечать развернуто, там есть варианты ответа. Спасибо за помощь 👌


https://forms.gle/JtxKyFKbQKrEmDVg6
4🔥1🥴1🤝1
[СОВЕТ] Поиск информации.

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

#совет #обучение
👍9😁5💯3🔥1
В курсе ли HR-специалисты, что при поиске разработчиков они могут столкнуться с кандидатами, "накрутившими" свой опыт? Разделяют ли они опасения по поводу возможности найма Джунов с завышенными заявлениями об опыте?

Да, конечно, в курсе. Я заметно ощутила эту тенденцию в 2022 году. Очень много было ребят с накрученным опытом по вакансиям QA, именно они открыли мир «накрученного опыта», а потом подхватили эту тенденцию и кандидаты на другие IT-специальности.

На текущий момент меньше всего кандидатов с таким накрученным опытом в backend-разработке, devops, системном администрировании. Опасений по поводу найма таких специалистов нет, если техническое собеседование будет проводить профессионал, также все больше компаний вводит практику «лайв кодинга», и именно этот этап просто «отсеит» неподходящих кандидатов.

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

Я отношусь нейтрально к накрутке опыта; это не хорошо и не плохо. Отношусь негативно лишь в том случае, когда человек абсолютно слаб в разработке и претендует на роль мидла. Это, во-первых, подрывает психологическое состояние самого сотрудника (если при этом ему удастся трудоустроиться, что верится с трудом). Он будет сам постоянно переживать, стрессовать и подводить команду и компанию, и в конечном итоге он просто не пройдет испытательный срок. Позитивно отношусь к действительно талантливым ребятам, которые по сути уже пишут код как мидлы. Их «накрутка» опыта не будет мешать ни команде, ни компании в целом, поскольку результат, который ждет от сотрудника работодатель, будет оправдан.

Вот как ответила Залифа. @it_coach1

Ваше мнение 👇👇👇
👍10🔥41👌1
Arguments в JavaScript

В JavaScript, объект arguments представляет собой специальную коллекцию, доступную внутри функций, которая содержит аргументы, переданные этой функции. Это позволяет работать с функциями, принимающими произвольное количество аргументов, не определяя их все явно. Хотя arguments и напоминает массив по способу доступа к значениям и наличию свойства length, он не обладает методами массива, такими как forEach или map.

Преобразование arguments в массив

Чтобы воспользоваться полным набором методов массива, arguments можно преобразовать в настоящий массив. Современный способ сделать это — использовать оператор распространения (...)

Стрелочные функции

Важно помнить, что объект arguments не доступен в стрелочных функциях. Это одно из ключевых отличий стрелочных функций от обычных. В стрелочных функциях для работы с переменным количеством аргументов следует использовать оператор распространения (...args)

#JavaScript #arguments
👍3🔥2💯1
Дневник ментора: проблема Eslint & Prettier

На менторстве, мы с учеником столкнулись с непростой проблемой, вызванной конфликтом между Prettier и ESLint, проявляющимся в ошибке "delete enter". Конфликт заключался в том, что Prettier автоматически форматировал код, добавляя отступы, тогда как ESLint ожидал код без этих отступов.

Мы предприняли несколько шагов в попытке устранить эту проблему:

1. Внесение изменений в .prettierrc, добавляя endOfLine: "crlf" и endOfLine: "auto".

2. Изменение настроек в .vscode/settings.json с files.eol: "auto" и files.eol: "\n".

3. Настройка Git с помощью команды git config --global core.autocrlf false.

4. Очистка кэша ESLint через npx eslint --clear-cache.

5. Проверка и настройка других конфигураций Prettier.

Так же все усугублялось тем, что у меня на MacBook все работало, а у него на Windows нет.

Несмотря на все усилия, проблема оставалась нерешенной, пока мы не обнаружили, что корень проблемы лежит в плагине eslint-webpack-plugin для Webpack. После его удаления из конфигурации Webpack:


new EslintWebpackPlugin({
extensions: ['js', 'jsx', 'ts', 'tsx'],
fix: true
})


А так же добавлении конфига в .prettierrc:


{
// Другие настройки
"endOfLine": "auto"
}


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

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

#mentor
👍7🔥2👏1
Алгоритм обхода дерева

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

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

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

#algorithm #JavaScript
👍84🔥3👌1
Список задач на Циклы и примитивы с Codewars

Решаем задачи. Полезно для развития мышления и знания языка

1. even-or-odd
2. opposite-number
3. century-from-year
4. abbreviate-a-two-word-name
5. reversed-strings
6. credit-card-mask
7. remove-first-and-last-character
8. create-phone-number
9. How many arguments
10. Leap Years

#codewars #algorithm #task #loop #primitive
👍6🔥2👌1
Менторство

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

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

https://telegra.ph/Obuchenie-s-mentorom-02-22

#mentor
🔥6🤣2🤝21
Руслан Куянец | Reactify pinned «Менторство Многие обращаются ко мне с вопросами о стоимости, процессе обучения, длительности и других аспектах менторства. Чтобы упростить доступ к информации, я решил собрать все в одном месте и подробно рассказать о программе обучения. Если у вас останутся…»
Сезонность в рекрутинге

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

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

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

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

#job
👍10🤝32
Я дома, а это значит, что скоро выйдут 2 серии React Новости✌️

1 серия - рефакторинг. Очень полезная серия
2 серия - React Router. Наконец-то у нас появится отдельная страница новости

В субботу и воскресение выпущу 😌

#react_новости
👍8🔥54
Асинхронный код в JavaScript

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

Основные моменты, которые нужно понимать о асинхронном коде:

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

Event Loop: Это цикл событий, который позволяет JavaScript выполнять асинхронные задачи после завершения всех синхронных. Он следит за тем, чтобы асинхронные операции возвращались в главный поток для выполнения, как только они будут готовы.

Микрозадачи и Макрозадачи: JavaScript разделяет асинхронные задачи на два типа — микрозадачи (например, обещания (Promises)) и макрозадачи (например, таймеры, ввод/вывод). Микрозадачи обрабатываются сразу после текущего синхронного кода и перед любыми макрозадачами, делая их приоритетными.

Promises: Обещания (Promises) — это объекты, представляющие будущий результат асинхронной операции. Они позволяют управлять асинхронным кодом более удобно, чем через колбэки, предоставляя методы для обработки успешного выполнения и возникновения ошибок.

#promise #JavaScript #async
🔥9👍4👌41