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

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

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

YeaHub:
https://yeahub.ru/

Связь:
@ruslan_kuyanets
Download Telegram
Кто не пьёт - тот проиграл?🤔😂
Планирую в конце месяца начать записывать видео по JavaScript. Но тогда React Новости будут выходить не 2 раза в неделю, а один.

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

Ведение блога - как один из способов улучшить свои знания. Ведь если можешь что-то объяснить другому, значит сам это понял😄

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

К сожалению если не используешь что-то в работе, то со временем забываешь это🙃

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

На самом деле отдыхать сложно. Что если писать код мне интересно? Решать задачи интересно? Записывать видео? Может я так отдыхаю. А чилить у бассейна мне скучно. Я всегда с радостью встречаю понедельник и конец отпуска🙃

На работе ждёт интересная задача. Дома ждёт мой сервис, ютуб, книги😂

Хочу домой делать интересные для меня вещи. Но вынужден лежать у бассейна с термальной водой.

Лайк если не нравится лежать у бассейна👍🏻

Кит если нравится 🐳
👍9
Каррирование (или карринг) — это процесс превращения функции с множеством аргументов в последовательность функций, каждая из которых принимает только один аргумент. Давай разберем это на простом языке и с примерами.

Что это значит на практике?

Допустим, у нас есть простая функция, которая складывает три числа:

function sum(a, b, c) {
return a + b + c;
}

Теперь, вместо того чтобы передавать все три аргумента сразу, мы можем "каррировать" эту функцию, чтобы она принимала аргументы по одному:

function sum(a) {
return function(b) {
return function(c) {
return a + b + c;
}
}
}

sum(1)(2)(3); // результат: 6

Зачем это нужно?

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

#ОбучающийПост #JavaScript #каррирование
🔥5
В этом примере, мы сначала "фиксируем" URL, а затем метод, создавая функции getUser и createUser, которые уже "знают" эти параметры и принимают только тело запроса в качестве аргумента. Это упрощает повторное использование кода и делает наши функции более чистыми и читаемыми.

#каррирование #code #JavaScript
Язык программирования предоставляет нам богатый арсенал методов и инструментов. Одну и ту же задачу можно решить различными способами, используя разнообразные конструкции.

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

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

Это крутая, творческая и иногда непростая профессия. Мне нравится создавать что-то новое и постоянно учиться — чувствую себя действительно творческим человеком. Особенно здорово разбираться в логике приложения, делать код чище и лучше. Да, я немного перфекционист в этом вопросе. Также я обожаю общаться и быть частью айти-сообщества — это приносит мне радость. И вообще, мне нравится начинать новую рабочую неделю в понедельник, потому что знаю: меня ждёт много интересного.

Программирование подарило мне все это.

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

Хочу пожелать всем, кто мечтает стать программистом, обязательно достичь этой цели. Если вы чувствуете, что это сделает вашу жизнь лучше, то у вас все получится! Желаю вам удачи, мотивации и сил. И пусть в следующем году этот праздник будет и вашим праздником на полную катушку! Я постараюсь помочь вам в этом.

С праздником!
5🔥5🫡2
Разницу между атрибутами async и defer при подключении внешних скриптов в HTML документе.

🔹async

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

🔹defer

Атрибут defer, с другой стороны, также позволяет браузеру продолжить парсинг HTML-документа во время загрузки скрипта. Однако, в отличие от async, он гарантирует, что скрипты будут выполнены в том порядке, в котором они появляются в документе, и только после полной загрузки HTML-документа, перед событием DOMContentLoaded.

🔍Визуально разницу можно представить так:

1️⃣Без async или defer: HTML → Скрипт загружается и выполняется → HTML продолжает загружаться.

2️⃣С async: HTML и скрипт загружаются параллельно → Скрипт выполняется, как только загрузится (HTML может ещё не быть полностью загружен).

3️⃣С defer: HTML и скрипт загружаются параллельно → Скрипт выполняется только после полной загрузки HTML (и в том порядке, в котором они указаны в документе).

🛠Использование:

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

Используйте defer, когда скрипты зависимы друг от друга и должны выполняться в определенном порядке.

#JavaScript #ОбучающийПост #defer #async #HTML
👍4
На данный момент я разрабатываю свой сервис. Как бекенд так и фронтенд часть, разрабатываю один. Больше всего проблем приносит работа с датами. Сложно все учесть: какой формат, какой пояс, как это все синхронизировать, как отображать дату пользователям, стоит ли переводить в локальное время.🙄

Конечно, даёт о себе знать не особо большой опыт в бекенде, так как бекенд пошёл как-то сам по себе, изучал его на практике, а вот фронтенд изучал углублённо, знаю тонкости, особенности, и имею хороший опыт. Хотя сейчас стараюсь улучшить свои знания в бекенд разработке, читаю про архитектуру, подходы, дизайн систем, про БД. Однако если по фронту у меня был ментор на работе, который заложил основу, то по бекенду такого не было.

Ну ничего, выпишу вопросы, пойду на IT завтрак, там много бекендеров, дам тему для обсуждения.😆 А пока оставлю так как сделал🤓 В любом случае все можно исправить, только к тому моменту, когда руки дойдут, пользователей будет не 100, а 10000) и нужно будет придумывать скрипты и миграции, чтобы без потери данных всё перевести из одного формата в другой, а потом еще на фронтенде этот формат правильно отображать. Ужас. Почему же я изначально выбрал фронтенд, а не бекенд😩
😁4
Короче разобрался я с датой, конечно мне кажется сделал небольшие костыли, но в целом цели добился. Тестирую смс рассылку😎

Огонёк если хотели бы проснутся утром и увидеть такое смс напоминание на урок по фронтенду😄
🔥8😁2
https://github.com/roll-over/unknown-interview

Ребята разрабатывают tinder/HH. Open source проект. Вы можете поинтересоваться, как можно принять участие, обычно в таких проектах должен быть чат где ребята списываются и общаются.

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

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

🔍Лексическая Область Видимости - означает, что функция имеет доступ ко всем переменным, которые были в ее области видимости в момент создания. Это создает "замкнутую" область видимости, защищая переменные от внешнего доступа.

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

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

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

#JavaScript #ОбучающийПост #замыкание
👍8
Ближайшие дни контента не будет. Всем отличных выходных! Отдыхать тоже нужно иногда💪🏻
Сегодня стал мужем✌️
🔥25👍5
Всем привет! Завтра выхожу из отпуска. На выходных ездили с женой в классный отель Movenpick Resort & SPA Anapa.

Это просто шикарный отель с проживанием "Ультра Все включено". В такие моменты я очень сильно вдохновляюсь и мотивируюсь. Если отдыхать, то только в таких отелях, где тебя ждет отличный чистый большой номер, где все продумано до мелочей, высокий уровень сервиса, много услуг.

После каждого своего отпуска, или поездки у меня появляются силы работать, становится лучше, улучшать навыки, что-либо создавать. Я заряжен на 100%.

Хочется прожить лучшую жизнь: покупать только качественные вещи, путешествовать, жить в отличных отелях, в общем, все то, что хочется.

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

Все эти возможности должны мотивировать вас, как и меня. А если вы ещё и влюбитесь в это дело, то действительно, вы не будете работать в своей жизни ни дня.

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

P.S На фото я в холле отеля после завтрака записываю идеи для YouTube и телеги
💯131
Еще хочу с октября начать новый "Сериал" создавать на чистом js css html приложение, как React Новости. Развивать его, писать всю ту же функциональность и логику но на чистом js.

Так вот, нам нужно выбрать какое приложение мы будем создавать😃

Пишите в комменты свои идеи, я тоже буду накидывать.

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

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

Мы - не все. Мы - лучше. Будем с вами параллельно изучению технологий React, Redux, TS, Router (которые нужны для работы) углублять знания и навыки по чистому js. Создавать приложения, как когда то создавали наши коллеги - без готовых инструментов.
4
https://youtu.be/am_UiIvha5M?si=AgHZITfRhoPLJCPc

Мой курс по React сегодня перешагнул за 1000 просмотров. Кто смотрел? Что я упустил? Все ли понятно было? Я впервые такое длинное видео делал со сценарием. Тяжело было записывать, много информации держал в голове, чтобы все учесть и в нужный момент рассказать
👍8
🗺Условные операторы и структуры управления потоком в программировании

Давайте представим, что ваши программируемые инструкции — это навигационные указания, а вы стоите на перекрёстке, выбирая, куда пойти.

1️⃣If-Else
If-else — это как знакомый вам проводник, который подходит к вам и говорит: "Если на улице идёт дождь, то возьмите зонт. В противном случае, если идет снег, наденьте теплую куртку. Иначе просто идите так, как вы одеты сейчас". То есть, этот проводник помогает вам сделать выбор, основываясь на различных условиях, одно за другим.

2️⃣Switch
Теперь переходим к switch. Представьте, что у вас есть большая панель с кнопками, и на каждой кнопке написаны различные метки (case 1, case 2 и так далее). Вы просто ищете нужную метку и нажимаете на соответствующую кнопку, чтобы получить инструкции для этого конкретного случая. Это немного быстрее и организованнее, особенно когда у вас есть много меток, потому что вы можете прямо перейти к нужной, минуя другие.

3️⃣Объектные Литералы
Наконец, объектные литералы можно представить как умный телефон с приложением для навигации. Вам просто нужно ввести свой запрос, и приложение мгновенно предоставит вам правильные указания, без необходимости проверки каждого возможного маршрута или условия. Это потому, что все возможные маршруты уже заранее загружены в приложение, что позволяет быстро и прямо переходить к нужной инструкции.

👍If-else хорош для простых, последовательных проверок условий.

💡Switch делает код чуть более структурированным и удобным для большого количества условий, но всё же требует последовательного просмотра.

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

#ОбучающийПост #JavaScript #объектные_литералы
👍10
Помню давно я видел график, который сравнивал скорость выполнения условных операторов if-else, switch и объектных литералов при различном количестве кейсов. По этому графику, до 7 кейсов разница в производительности между switch и if-else была не существенной, но затем обе начинали показывать увеличение времени выполнения. При этом, рост у switch был менее выраженным по сравнению с if-else.

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

Я не смог найти его, поэтому нарисовал😃

#ОбучающийПост #JavaScript #объектные_литералы
👍81🔥1
Тут кстати автор упомянул про Дерево переходов, оптимизацию switch-case