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

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

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

YeaHub:
https://yeahub.ru/

Связь:
@ruslan_kuyanets
Download Telegram
Codewars - это платформа для решения программных задач разного уровня сложности. Почему стоит попробовать?

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

💡 Как это работает?
После регистрации выберите свой язык программирования, и вы будете перенаправлены на задачи, соответствующие вашему уровню. Решая задачи, вы повышаете свой ранг, открывая все более сложные уровни.

🌍 Сообщество
Один из плюсов Codewars - это активное сообщество. После отправки вашего решения вы можете просмотреть решения других участников, узнать новые подходы и методы.

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

Углубление понимания языка
Практика решения разных задач
Подготовка к техническим собеседованиям
Улучшение навыков алгоритмизации
🛠 Советы новичкам:

Не бойтесь начать с простых задач.
Если что-то не получается, не сдавайтесь. Иногда нужно отойти и вернуться позже.
Активно используйте форум: задавайте вопросы и делитесь своими решениями.
Заканчиваю словами, что Codewars - это не просто площадка для решения задач, это место, где можно развиваться вместе с сообществом! 🌟👩‍💻👨‍💻🌟

#СоветДня #JavaScript
👍2
Разработчики сталкиваются с проблемами ежедневно. Иногда ответы на эти вопросы могут быть неочевидными. Вот несколько советов, как найти решение:

1️⃣Четко сформулируйте проблему
Перед тем как начать поиск, попробуйте описать свою проблему максимально конкретно. Чем точнее ваш запрос, тем выше шанс найти ответ.

2️⃣Официальная документация
Перед тем как бежать в Google, проверьте официальную документацию. Для JS это MDN Web Docs, для CSS также MDN или W3Schools.

3️⃣Поисковые системы
Google, Yandex или любой другой — ваш лучший друг. Введите вашу проблему и добавьте "stackoverflow", чтобы сразу попасть на обсуждение похожего вопроса.

4️⃣Форумы и сообщества
StackOverflow — главный ресурс для вопросов и ответов по программированию. Не забывайте про русскоязычные ресурсы, такие как toster.ru.

5️⃣YouTube
Многие проблемы уже обсуждались и решались на видео. Найдите каналы, посвященные вашему стеку технологий.

6️⃣Обучающие платформы
Сайты, такие как Codepen или JSFiddle, позволяют искать конкретные решения и экспериментировать с кодом в реальном времени.

7️⃣Сетевые сообщества
Группы в Telegram, Discord или на других платформах могут помочь вам быстро получить ответ или направление от профессионалов или единомышленников.

💡 Дополнительные советы:

Не стесняйтесь задавать вопросы. Но прежде удостоверьтесь, что вы сначала попытались найти ответ самостоятельно.
Когда найдете решение, попробуйте понять его корень. Это поможет вам в будущем избегать аналогичных проблем.
Запомните: каждая проблема — это возможность для обучения. Не опускайте руки, продолжайте искать и учиться! 💪🌐🚀

#СоветДня
🔥4
Какое значение свойства align-items в контейнере flexbox выставляет все дочерние элементы по центру перпендикулярной оси?

#quiz #CSS #Flexbox
Anonymous Quiz
9%
flex-center
2%
center-axis
22%
justify-center
67%
center
👍2
🌟 Grid vs Flexbox: Что выбрать?

🔹 Основное различие:

Flexbox (Flexible Box) оптимизирован для одномерного макета, то есть по оси X (горизонтальной) или по оси Y (вертикальной).
Grid (Сетка) предназначен для двумерного макета, где у вас есть элементы как в рядах, так и в колонках.
🔹 Когда использовать Flexbox:

Для макетов с одномерными структурами: горизонтальные или вертикальные компоненты (например, навигационные меню, боковые панели).
Если вам нужна большая гибкость в распределении пространства и выравнивании элементов.
Когда порядок элементов имеет значение.
🔹 Когда использовать Grid:

Для макетов с двумерными структурами: сетки с рядами и колонками.
Когда нужно разместить элементы по определенным линиям или областям.
Для более сложных и детализированных макетов.

🔹 Что лучше?
Вопрос "что лучше" не совсем корректен. Эти две технологии дополняют друг друга! Их можно использовать вместе в одном проекте. Выбор зависит от конкретной задачи, которую вы решаете.

📌 Заключение: Flexbox и Grid предоставляют разные инструменты для разных ситуаций. Понимание их основных принципов поможет вам правильно выбрать подходящий инструмент для вашего макета. 🛠️🎨

#ОбучающийПост #CSS
🔥2
Привет всем! 🖐 Недавно я побывал на Tinkoff Frontend BBQ Party. Три интересных доклада, вкусная еда, освежающие напитки и, самое главное, общение с коллегами. Всё это абсолютно бесплатно после регистрации!

Такие мероприятия - это возможность:
1️⃣ Расширять свой кругозор. С каждым новым докладом и разговором вы узнаете что-то новое.
2️⃣ Нетворкинг. Заводите новые полезные знакомства, которые могут помочь в карьере или просто стать вашими друзьями.
3️⃣ Делиться опытом. Не стесняйтесь рассказывать о своем опыте и получать обратную связь.

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

Присоединяйтесь к IT-сообществу, берите от него максимум! Ведь это не только об обучении и работе, но и о чудесной атмосфере, дружелюбии и вдохновении!
🔥5
Всем привет, встретил такой вот интересный сайт для изучения git. И не нужно никаких курсов проходить💪
https://learngitbranching.js.org/?locale=ru_RU
🔥61
Какой из следующих методов не мутирует (не изменяет) исходный массив?
Anonymous Quiz
16%
push()
24%
sort()
49%
slice()
12%
pop()
Мы все знаем, как сложно иногда взяться за крупную задачу, особенно когда перед глазами множество деталей. Но давайте взглянем на это с другой стороны и попробуем разбить её на более мелкие и управляемые кусочки!

🎯 Задача: Создать интерактивную галерею с возможностью просмотра, добавления и удаления изображений.

1️⃣ HTML:
Создать структуру галереи: контейнер, блоки для изображений, кнопки управления.
Реализовать форму добавления новых изображений: поле для ссылки, кнопка отправки.

2️⃣ CSS:
Оформление основного контейнера галереи: отступы, рамка, тени.
Стилизация блоков с изображениями: размеры, рамки, анимации при наведении.
Оформление формы и кнопок: цвета, шрифты, эффекты при нажатии.

3️⃣ JavaScript:
Функционал загрузки изображений: принимать ссылку, создавать новый блок с изображением.
Возможность удалять изображения: кнопка удаления, функция удаления из DOM.
Эффекты просмотра: увеличение при клике, слайд-шоу.

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

🔑 Разбивая сложные задачи на маленькие, вы делаете процесс разработки более понятным и организованным. Каждая маленькая задача становится конкретной, и вы можете сосредоточиться на ней, не отвлекаясь на другие детали. Это помогает не только быстрее завершать работу, но и делать её качественнее!

#СоветДня
🔥3
Какой из следующих элементов используется для вставки внутристрочного JavaScript кода?

#quiz #HTML
Anonymous Quiz
7%
<noscripting>
5%
<js>
85%
<noscript>
2%
<javanoscript>
Какое свойство позволяет установить внешние отступы элемента?

#quiz #CSS
Anonymous Quiz
12%
padding
0%
space
0%
border-gap
88%
margin
Привет всем🤚
Я подписан на рассылку HH на почту. Пришло письмо hh Карьера, типо у них бета версия и можно посмотреть путь для становления в любой профессии!
Я немного потыкал, в целом прикольно. Можете тоже глянуть😄
https://career.ru/
👍3
Каким методом можно добавить элемент в конец массива?

#quiz #JavaScript
Anonymous Quiz
81%
push()
14%
add()
5%
append()
0%
concat()
👍4
Всем привет, снимаю новое видео, думаю сегодня выпустить😌
Технарями рождаются или становятся?🤔
Anonymous Poll
21%
Рождаются
74%
Становятся
5%
Не знаю
Если у элемента установлено значение box-sizing: border-box;, что включается в его общую ширину?

#quiz #CSS
Anonymous Quiz
7%
Только контент
9%
Контент и padding
57%
Контент, padding и border
27%
Все вышеуказанное + margin
👍2