Задержка в коде
Иногда в процессе программирования возникает необходимость внести паузу в выполнение кода. Часто для этого используется
Решением этой проблемы может стать создание универсальной функции sleep, которая возвращает промис. Эта функция позволяет легко реализовывать задержку в любом месте кода, делая его более чистым и организованным.
Представим, что у нас есть кнопка, при нажатии на которую текст копируется в буфер обмена. Чтобы явно показать пользователю, что действие выполнено, мы временно меняем текст на кнопке на "Успешно!". Это важно, так как без визуального подтверждения пользователь может не понять, что текст успешно скопирован. Однако, мы также хотим дать понять, что можно совершить действие снова. Для этого через несколько секунд мы возвращаем текст кнопки к исходному состоянию "Копировать".
#react #JavaScript #sleep #setTimeout #code
Иногда в процессе программирования возникает необходимость внести паузу в выполнение кода. Часто для этого используется
setTimeout, но при множественном использовании это может стать довольно громоздким и менее удобным. К тому же, оборачивание логики в setTimeout не всегда идеально сочетается с асинхронными операциями и обещаниями (promises).Решением этой проблемы может стать создание универсальной функции sleep, которая возвращает промис. Эта функция позволяет легко реализовывать задержку в любом месте кода, делая его более чистым и организованным.
Представим, что у нас есть кнопка, при нажатии на которую текст копируется в буфер обмена. Чтобы явно показать пользователю, что действие выполнено, мы временно меняем текст на кнопке на "Успешно!". Это важно, так как без визуального подтверждения пользователь может не понять, что текст успешно скопирован. Однако, мы также хотим дать понять, что можно совершить действие снова. Для этого через несколько секунд мы возвращаем текст кнопки к исходному состоянию "Копировать".
#react #JavaScript #sleep #setTimeout #code
👍10✍2👨💻1
This media is not supported in your browser
VIEW IN TELEGRAM
Уже монтирую видеокурс по html ✌️
Пока что все получается отлично. Очень хорошо проработал сценарий и текст, чтобы новички все поняли, но и ребята по старше не заскучали😅
Самый подробный курс будет, при этом минимум воды, имхо.
Пока что все получается отлично. Очень хорошо проработал сценарий и текст, чтобы новички все поняли, но и ребята по старше не заскучали😅
Самый подробный курс будет, при этом минимум воды, имхо.
🔥17👍4❤2
Тем временем🚀
Видео по TypeScript уже 7300 просмотров
Подписчиков на канале 1664
Видео по TypeScript уже 7300 просмотров
Подписчиков на канале 1664
👏19👍3❤2🔥1
Множественные асинхронные запросы
Бывают случаи когда вам необходимо сделать много разных запросов на сервер и получить данные. Есть разные варианты для реализации этого:
Использование Async/Await:
- Последовательное выполнение запросов.
- Каждый запрос выполняется один за другим.
- Полезно, когда второй запрос зависит от результата первого.
Использование Promise.all:
- Параллельное выполнение всех запросов.
- Оптимально для независимых запросов, когда порядок не важен.
- Если один из промисов отклоняется, весь Promise.all отклоняется.
Использование Promise.allSettled:
-Также выполняет запросы параллельно.
-Возвращает результаты всех запросов, включая успешные и неудачные.
-Полезно для обработки ситуаций, когда нужен результат каждого запроса, независимо от успеха или неудачи.
Использование Цикла For...Of с Async/Await:
-Последовательное выполнение запросов для каждого элемента в массиве.
-Подходит для сценариев, где требуется обрабатывать элементы массива по очереди.
#JavaScript #обучающийПост #promise #async
Бывают случаи когда вам необходимо сделать много разных запросов на сервер и получить данные. Есть разные варианты для реализации этого:
Использование Async/Await:
- Последовательное выполнение запросов.
- Каждый запрос выполняется один за другим.
- Полезно, когда второй запрос зависит от результата первого.
Использование Promise.all:
- Параллельное выполнение всех запросов.
- Оптимально для независимых запросов, когда порядок не важен.
- Если один из промисов отклоняется, весь Promise.all отклоняется.
Использование Promise.allSettled:
-Также выполняет запросы параллельно.
-Возвращает результаты всех запросов, включая успешные и неудачные.
-Полезно для обработки ситуаций, когда нужен результат каждого запроса, независимо от успеха или неудачи.
Использование Цикла For...Of с Async/Await:
-Последовательное выполнение запросов для каждого элемента в массиве.
-Подходит для сценариев, где требуется обрабатывать элементы массива по очереди.
#JavaScript #обучающийПост #promise #async
👍8👨💻3❤1✍1
Использование буфера обмена в JavaScript и React
Буфер обмена — это временное хранилище для данных, которые пользователи копируют (Ctrl+C) или вырезают (Ctrl+X), чтобы вставить (Ctrl+V) их в другом месте. JavaScript предоставляет несколько способов взаимодействия с буфером обмена, что особенно полезно в веб-приложениях.
Для доступа к буферу обмена мы используем Clipboard API
#обучающийПост #JavaScript #react #clipboard
Буфер обмена — это временное хранилище для данных, которые пользователи копируют (Ctrl+C) или вырезают (Ctrl+X), чтобы вставить (Ctrl+V) их в другом месте. JavaScript предоставляет несколько способов взаимодействия с буфером обмена, что особенно полезно в веб-приложениях.
Для доступа к буферу обмена мы используем Clipboard API
#обучающийПост #JavaScript #react #clipboard
👍17👌2👨💻2
Вот о чем подумал
Раньше считалось крутым иметь классный сайт, и все соревновались в создании более модного и удобного сайта. Сейчас у каждой более-менее большой компании есть своё приложение. А маленькие компании используют общие приложения, например, для бонусной системы, для товаров, для бронирования и т.д.
Реально, Магнит, Леруа, Хендерсон, Спортмастер, Лента, Метро, О'Кей, Лукойл, Газпром, Пятерочка — все создают приложения для того, чтобы учитывать бонусы, предлагать акции, делать рассылки, организовывать доставку товаров. Даже у различных кофеен и ресторанов есть свои приложения.
Если раньше для создания и поддержки сайта/приложения требовалось, например, шесть программистов, то сейчас с этим справятся, например, трое-четверо. Разработка упрощается, появляются различные инструменты и технологии, в том числе и искусственный интеллект.
А ещё сейчас почти все новые жилые комплексы имеют системы 'умного жилого комплекса'. Часто вижу вакансии в строительные компании для разработки таких систем.
У меня у самого куча разных приложений уже😅 просто реально стал замечать, что все больше компаний создают свои приложения)
Раньше считалось крутым иметь классный сайт, и все соревновались в создании более модного и удобного сайта. Сейчас у каждой более-менее большой компании есть своё приложение. А маленькие компании используют общие приложения, например, для бонусной системы, для товаров, для бронирования и т.д.
Реально, Магнит, Леруа, Хендерсон, Спортмастер, Лента, Метро, О'Кей, Лукойл, Газпром, Пятерочка — все создают приложения для того, чтобы учитывать бонусы, предлагать акции, делать рассылки, организовывать доставку товаров. Даже у различных кофеен и ресторанов есть свои приложения.
Если раньше для создания и поддержки сайта/приложения требовалось, например, шесть программистов, то сейчас с этим справятся, например, трое-четверо. Разработка упрощается, появляются различные инструменты и технологии, в том числе и искусственный интеллект.
А ещё сейчас почти все новые жилые комплексы имеют системы 'умного жилого комплекса'. Часто вижу вакансии в строительные компании для разработки таких систем.
У меня у самого куча разных приложений уже😅 просто реально стал замечать, что все больше компаний создают свои приложения)
👍7🤪3🤔1
Подборка библиотек для вашего приложения
1️⃣
2️⃣
3️⃣
4️⃣
5️⃣
#libs
1️⃣
react-advanced-cropper: Инструмент для обрезки изображений с настраиваемыми параметрами и интерактивным интерфейсом.2️⃣
react-calendar: Компонент календаря для выбора дат, предоставляющий легкую интеграцию в формы и интерфейсы.3️⃣
dayjs: Легковесная библиотека для обработки и форматирования дат, предлагающая простой и интуитивно понятный API.4️⃣
three: Библиотека для создания 3D-графики, используемая с React через обертки, такие как react-three-fiber, для визуализации 3D-сцен.5️⃣
swiper: Слайдер с широким спектром настроек для создания динамических и адаптивных слайд-шоу.#libs
👍7❤1🔥1
Каким будет вывод этого фрагмента кода?
Anonymous Quiz
25%
start , end , setTimeout, resolve
21%
start , setTimeout , end, resolve
43%
start , end , resolve, setTimeout
11%
start , resolve , end, setTimeout
🤯6👌1
Хук useToggle
Хук useToggle в React — это удобный инструмент для управления состояниями, такими как открытие/закрытие, включение/выключение. Это простой способ переключения между двумя состояниями (обычно true и false) в компонентах. Особенно полезен для интерактивных элементов UI, таких как кнопки переключения, скрытие и отображение элементов и т.д. useToggle повышает читаемость кода и упрощает управление состоянием.
#react #code #useToggle #hook
Хук useToggle в React — это удобный инструмент для управления состояниями, такими как открытие/закрытие, включение/выключение. Это простой способ переключения между двумя состояниями (обычно true и false) в компонентах. Особенно полезен для интерактивных элементов UI, таких как кнопки переключения, скрытие и отображение элементов и т.д. useToggle повышает читаемость кода и упрощает управление состоянием.
#react #code #useToggle #hook
👏8👍4
Недавно наткнулся на статью, что Google экспериментирует с использованием элемента <canvas> для рендеринга полных веб-страниц. Это подразумевает отрисовку всех элементов страницы, включая текст, кнопки, хедер и футер, через <canvas>.
С помощью такого подхода можно достичь высокого уровня плавности и качества графики. Это особенно круто для сложных приложений, где нужно много визуализации, типа карт или графических редакторов.
Но тут, конечно, возникает вопрос - а как же быть с СЕО, ведь роботы не смогут увидеть, что у вас на <canvas>😅
Прикол конечно, вы заходите на страницу и там в <body> сразу идет <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
Все мое обучение заняло около года. Из этого времени на изучение Frontend я потратил всего 7 месяцев. Остальные 5 месяцев были посвящены поиску себя, так как я не знал, что учить и каким программистом стать. Не имея четкого плана, я провел 5 месяцев в никуда.
Когда я освоил React, Redux, Router, пришло время искать работу, но я сомневался в себе. Боялся, что недостаточно хорош и что мне нужно еще немного поучиться. Ведь в Roadmap было столько всего - Next.js, Node.js, ESLint, Webpack, TypeScript и т.д.
Я очень боялся проходить собеседования. Первый отклик я отправлял около 30 минут, весь вспотел и перенервничал, прежде чем нажал одну кнопку. Как я себя переборол? Просто нажал кнопку, ведь отклик - это не приглашение. 😅
С каждым днем я все активнее откликался, улучшал резюме, смотрел множество видео с прохождением собеседований и разбором заданий. Я постоянно читал гайды о том, как улучшить резюме. Ежедневно я писал конспекты, решал задачи, учил алгоритмы, работал над проектом для портфолио, изучал TypeScript и другие технологии, просто чтобы сказать: "Я знаком с этим, но не работал".😁
В то время мне не приходилось врать в резюме о своем опыте. Без опыта и без курсов HR с удовольствием отвечали, присылали технические задания и приглашали на собеседования.
К моменту начала поиска работы я уже спокойно разрабатывал приложения, не подглядывая, я сам добавлял функционал и придумывал дизайн.
Спустя 2 недели я нашел свою первую работу.🎉
Продолжение следует... Если поддержите Лукасами, то завтра напишу о своей первой работе
#story_1
👍31🔥3✍1👏1
Вообще думаю создать фейковое резюме и попробовать получить приглашение на Junior позицию без опыта.
Поэкспериментировать с фрилансом, сопроводительными письмами.
Возможно даже создать гитхаб профиль и добавить туда разные проекты. И весь процесс вам показывать
Как идея? 💡
Поэкспериментировать с фрилансом, сопроводительными письмами.
Возможно даже создать гитхаб профиль и добавить туда разные проекты. И весь процесс вам показывать
Как идея? 💡
👍47🔥12🤝2❤1
Моя первая работа
Моя первая работа была в аутстаффинговой компании. Компании сдают своих работников в аренду в другие компании/проекты и за это получают деньги. В Аутстаф набирают много джунов. Джунов нет смысла сдавать в аренду, но зачем их тогда набирают? Чтобы выдать за Мидл+/Сеньора.
Джунов готовят к собесам, прилизывают резюме, накручивают 3 года опыта в крутых проектах. Вам как шпиону прорабатывают историю, которую вы учите и потом на собесе рассказываете. Вы вместе с вашим ментором вместе проходите собес, он сидит за камерой и подсказывает вам, пишет ответы и решает задачи. (Все это разумеется незаметно для собеседующей компании)
В итоге Джуна с 2-3 месяцами опыта продают на Сеньорскую позицию в европейскую компанию с окладом 4-5к долларов месяц. Разумеется Джуну достается 20к рублей, остальное идет в компанию.
Большинство задач однотипные в любой работе. 70% ты делаешь интерфейсы без сложной логики. А когда проступает сложная задача то тебе помогает ментор. Без ментора ты не должен общаться с командой в которую тебя закинули, не можешь отвечать на сообщения и участвовать в созвонах. Прежде чем запушить код, его проверяет твой ментор.
Я работал на таком проекте 4 месяца, к тому времени мой коммерческий опыт был всего 6 месяцев. Я Джун с 6 месяцами опыта, успешно работаю Сеньором уже 4 месяца. Я выполнял почти все задачи, которые мне давали. Я был довольно самостоятельным, решал что писать, как отвечать, проверял код других разрабов с проекта. Единственное, сначала ментор должен был дать добро. Мой ментор меня постоянно хвалил, и мой код уже не требовал исправлений.
Самостоятельность сильно прокачивает. В больших компаниях ты год красишь кнопки потому что ты Джун и это твоя зона ответственности. А тут ты выполняешь боевые задачи, растешь быстрыми темпами и набираешься уверенности. Эта компания дала мне большой рывок, я понял логику программирования, перестал бояться инструментов и сложных задач.
Продолжение следует… Если поддержите Лукасами, то завтра напишу почему уволился спустя 6 месяцев
#story_1
Моя первая работа была в аутстаффинговой компании. Компании сдают своих работников в аренду в другие компании/проекты и за это получают деньги. В Аутстаф набирают много джунов. Джунов нет смысла сдавать в аренду, но зачем их тогда набирают? Чтобы выдать за Мидл+/Сеньора.
Джунов готовят к собесам, прилизывают резюме, накручивают 3 года опыта в крутых проектах. Вам как шпиону прорабатывают историю, которую вы учите и потом на собесе рассказываете. Вы вместе с вашим ментором вместе проходите собес, он сидит за камерой и подсказывает вам, пишет ответы и решает задачи. (Все это разумеется незаметно для собеседующей компании)
В итоге Джуна с 2-3 месяцами опыта продают на Сеньорскую позицию в европейскую компанию с окладом 4-5к долларов месяц. Разумеется Джуну достается 20к рублей, остальное идет в компанию.
Большинство задач однотипные в любой работе. 70% ты делаешь интерфейсы без сложной логики. А когда проступает сложная задача то тебе помогает ментор. Без ментора ты не должен общаться с командой в которую тебя закинули, не можешь отвечать на сообщения и участвовать в созвонах. Прежде чем запушить код, его проверяет твой ментор.
Я работал на таком проекте 4 месяца, к тому времени мой коммерческий опыт был всего 6 месяцев. Я Джун с 6 месяцами опыта, успешно работаю Сеньором уже 4 месяца. Я выполнял почти все задачи, которые мне давали. Я был довольно самостоятельным, решал что писать, как отвечать, проверял код других разрабов с проекта. Единственное, сначала ментор должен был дать добро. Мой ментор меня постоянно хвалил, и мой код уже не требовал исправлений.
Самостоятельность сильно прокачивает. В больших компаниях ты год красишь кнопки потому что ты Джун и это твоя зона ответственности. А тут ты выполняешь боевые задачи, растешь быстрыми темпами и набираешься уверенности. Эта компания дала мне большой рывок, я понял логику программирования, перестал бояться инструментов и сложных задач.
Продолжение следует… Если поддержите Лукасами, то завтра напишу почему уволился спустя 6 месяцев
#story_1
👍51😱3🔥2👏2
Промисификации в JavaScript
Это процесс преобразования функций, которые используют колбеки для управления асинхронным кодом, в функции, работающие на основе промисов. Это делается для упрощения и улучшения управления асинхронными операциями в коде.
Самый простой пример это
Так же
Как работает промисификация:
- promisify принимает функцию func, основанную на колбеках.
- Возвращает новую функцию, которая, когда вызывается, возвращает промис.
- Внутри промиса вызывается исходная функция func с переданными аргументами и дополнительным колбеком.
- Этот колбек (callback) обрабатывает результат или ошибку и вызывает resolve или reject соответственно.
#promisify #JavaScript #promise
Это процесс преобразования функций, которые используют колбеки для управления асинхронным кодом, в функции, работающие на основе промисов. Это делается для упрощения и улучшения управления асинхронными операциями в коде.
Самый простой пример это
setTimeout(callback, delay). Как раз таки тут мы передаем колбек который должен выполнится по истечении какой то задержки.Так же
fs.readFile(filePath, 'utf8', callback) функции чтения файла в Node.jsКак работает промисификация:
- promisify принимает функцию func, основанную на колбеках.
- Возвращает новую функцию, которая, когда вызывается, возвращает промис.
- Внутри промиса вызывается исходная функция func с переданными аргументами и дополнительным колбеком.
- Этот колбек (callback) обрабатывает результат или ошибку и вызывает resolve или reject соответственно.
#promisify #JavaScript #promise
👍6❤2🤓2
Мое увольнение
Это была моя первая официальная работа. Классный офис, зона отдыха с большой плазмой, YouTube, PS4. Чай, кофе, снеки, фрукты, конфеты, печенье - всё, как на картинках из крутых офисов Яндекса и Google.
Мы отмечали каждый праздник: компания дарила нам подарки, заказывала доставку еды. По пятницам мы оставались в офисе, играли в настольные игры или смотрели фильмы. Для нас заказывали кучу пицц и роллов. Каждый четверг проводились мероприятия - викторины, командные игры, а также "технические четверги", где кто-то выступал с презентацией на техническую тему. Я выступил с темой ООП.
Раз в месяц у нас была индивидуальная встреча с HR и ментором, где обсуждались рост, достижения и потребности. Было здорово работать в кабинете с командой, общаться и получать советы от ментора. В офисе также были бесплатные занятия английским, на которые я ходил два раза в неделю. Один раз мы с коллегами даже пошли в баню.
Мой первый корпоратив в этой компании прошёл в прикольном кафе с банкетом, ведущим, танцами и конкурсами.
Но был и обратный момент: первый месяц я работал без зарплаты. Второй месяц моя зарплата составила 10 тысяч рублей, третий - 15 тысяч, а последующие месяцы - 25 тысяч. Я быстро рос профессионально, выполнял все задачи и даже работал дома. В пути на работу и обратно я читал книги и документацию.
Когда я попросил о повышении зарплаты, мне отказали, обещая повышение на 10 тысяч только через месяц. Я сказал, что подумаю. Конечно, я мог согласится и пока не нашел новую работу получать зарплату. Но я так не мог. В четверг я сказал что увольняюсь и начал искать работу. Мне нужно было доработать до понедельника. За выходные я сделал 4 технических задания и меня пригласили на 4 собеседования. В понедельник после последнего дня я прошел 2 собеседования и получил два оффера. Остальные проходить не стал. Выбрал компанию где больше понравилось. Работаю в ней до сих пор. Зарплату предложили почти в 3 раза больше чем было.
Продолжение следует...
#story_1
Это была моя первая официальная работа. Классный офис, зона отдыха с большой плазмой, YouTube, PS4. Чай, кофе, снеки, фрукты, конфеты, печенье - всё, как на картинках из крутых офисов Яндекса и Google.
Мы отмечали каждый праздник: компания дарила нам подарки, заказывала доставку еды. По пятницам мы оставались в офисе, играли в настольные игры или смотрели фильмы. Для нас заказывали кучу пицц и роллов. Каждый четверг проводились мероприятия - викторины, командные игры, а также "технические четверги", где кто-то выступал с презентацией на техническую тему. Я выступил с темой ООП.
Раз в месяц у нас была индивидуальная встреча с HR и ментором, где обсуждались рост, достижения и потребности. Было здорово работать в кабинете с командой, общаться и получать советы от ментора. В офисе также были бесплатные занятия английским, на которые я ходил два раза в неделю. Один раз мы с коллегами даже пошли в баню.
Мой первый корпоратив в этой компании прошёл в прикольном кафе с банкетом, ведущим, танцами и конкурсами.
Но был и обратный момент: первый месяц я работал без зарплаты. Второй месяц моя зарплата составила 10 тысяч рублей, третий - 15 тысяч, а последующие месяцы - 25 тысяч. Я быстро рос профессионально, выполнял все задачи и даже работал дома. В пути на работу и обратно я читал книги и документацию.
Когда я попросил о повышении зарплаты, мне отказали, обещая повышение на 10 тысяч только через месяц. Я сказал, что подумаю. Конечно, я мог согласится и пока не нашел новую работу получать зарплату. Но я так не мог. В четверг я сказал что увольняюсь и начал искать работу. Мне нужно было доработать до понедельника. За выходные я сделал 4 технических задания и меня пригласили на 4 собеседования. В понедельник после последнего дня я прошел 2 собеседования и получил два оффера. Остальные проходить не стал. Выбрал компанию где больше понравилось. Работаю в ней до сих пор. Зарплату предложили почти в 3 раза больше чем было.
Продолжение следует...
#story_1
👍17🔥3❤2
Как думаете плохо поступил? Меня вырастили, кормили пиццами, а я ушёл
👍8❤1🔥1