DevDocs
Универсальная платформа с документацией по различным технологиям (JS, Vue, React, CSS и другим).
Все документации в одном месте без необходимости гуглить.
👀 Ссылка
Coderoll | Frontend
Универсальная платформа с документацией по различным технологиям (JS, Vue, React, CSS и другим).
Все документации в одном месте без необходимости гуглить.
👀 Ссылка
Coderoll | Frontend
❤3
❓ Что такое Closure и как его избежать?
Ответ:
Closure — это функция, которая запоминает своё внешнее окружение. Чтобы избежать нежелательных замыканий, можно использовать let вместо var внутри циклов или пересоздавать область видимости.
Ставь ❤️ если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend
Ответ:
Ставь ❤️ если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend
❤4💅3
❓ В чем разница между null и undefined?
Ответ:
null — это значение, которое означает "отсутствие значения". Его можно присвоить переменной намеренно.
undefined — это значение, которое указывает, что переменная была объявлена, но ей не присвоено значение.
Ставь ❤️ если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend
Ответ:
Ставь ❤️ если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend
❤7💅1
Современный JavaScript. От новичка до профи [2024]
Курс. По мере прохождения вы погрузитесь в интереснейший мир JavaScript. Обучение начинается с основных концепций языка и продолжается передовыми техниками программирования.
Вне зависимости от уровня подготовки, курс обеспечит вас всей самой необходимой информацией для успешного освоения JS.
👀 Посмотреть курс
Coderoll | Frontend
Курс. По мере прохождения вы погрузитесь в интереснейший мир JavaScript. Обучение начинается с основных концепций языка и продолжается передовыми техниками программирования.
Вне зависимости от уровня подготовки, курс обеспечит вас всей самой необходимой информацией для успешного освоения JS.
Coderoll | Frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Разбираем 5 способов ускорить сайт: от простого к сложному
Каждая миллисекунда важна! В этой статье разбираются топовые способы оптимизации загрузки страницы
👀 Читать
Coderoll | Frontend
Каждая миллисекунда важна! В этой статье разбираются топовые способы оптимизации загрузки страницы
👀 Читать
Coderoll | Frontend
❓Что такое Virtual DOM?
Virtual DOM – это концепция, используемая в React и других библиотеках для эффективного обновления пользовательского интерфейса. Вместо прямых изменений в реальном DOM, React сначала обновляет виртуальную копию, сравнивает изменения (diffing), а затем минимально обновляет реальный DOM.
Virtual DOM делает обновления производительнее, так как минимизирует количество реальных манипуляций с DOM.
Ставь ❤️ если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend
Ставь ❤️ если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend
❤3💅3
Тесты и задачи по HTML, CSS и JS
Эти тесты подойдут вам, если вы уже знаете основы HTML, CSS, JavaScript и хотите проверить свои знания, закрепив ранее изученные материалы.
Вы также узнаете много нового: нюансы, тонкости, особенности, интересные возможности о которых могли не знать раньше.
👀 Проверить знания
Coderoll | Frontend
Эти тесты подойдут вам, если вы уже знаете основы HTML, CSS, JavaScript и хотите проверить свои знания, закрепив ранее изученные материалы.
Вы также узнаете много нового: нюансы, тонкости, особенности, интересные возможности о которых могли не знать раньше.
👀 Проверить знания
Coderoll | Frontend
👍1
❓ Что такое промисы (Promises) в JavaScript?
Ответ:
Промисы — это объект, представляющий результат асинхронной операции. У промиса есть три состояния: pending (ожидание), fulfilled (успех) и rejected (ошибка). Они позволяют работать с асинхронным кодом без использования коллбэков.
Ставь ❤️ если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend
Ответ:
Ставь ❤️ если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend
❤6👍2💅1
TanStack Query – must-have для работы с API
Библиотека, которая делает работу с серверными данными в React и Vue в разы проще. Кэширование, рефетчинг, автоматические обновления – все на высшем уровне. Забудь про useEffect и стейты для загрузки данных!
👀 Попробовать
Coderoll | Frontend
Библиотека, которая делает работу с серверными данными в React и Vue в разы проще. Кэширование, рефетчинг, автоматические обновления – все на высшем уровне. Забудь про useEffect и стейты для загрузки данных!
👀 Попробовать
Coderoll | Frontend
❓ Что такое Event Delegation?
Ответ:
Event Delegation — это техника, при которой обработчик события назначается родительскому элементу, а не каждому дочернему элементу. Это позволяет обрабатывать события для элементов, которые могут быть добавлены в DOM после загрузки страницы.
Ставь ❤️ если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend
Ответ:
Ставь ❤️ если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend
❤4💅2
Разбираем вопрос с FrontEnd-собеседования 👨💻
Как лучше ответить:
Модули JavaScript являются наиболее часто используемыми шаблонами проектирования для сохранения отдельных фрагментов кода независимыми от других компонентов. Это обеспечивает хорошую структурированность кода.
Модули должны быть функциями, вызываемыми прямо на месте (IIFE, Immediately-Invoked-Function-Expressions), чтобы обеспечить приватные области действия, то есть замыкание, которое защищает переменные и методы. Вот как примерно это может выглядеть:
Здесь мы создаем экземпляры приватных переменных и/или функций перед возвратом нашего объекта, который мы хотим вернуть. Код за пределами нашего замыкания не может получить доступ к этим приватным переменным, поскольку он не находится в той же области действия.
Coderoll | Frontend
Опишите шаблон проектирования "Модуль" в Javascript
Как лучше ответить:
Модули JavaScript являются наиболее часто используемыми шаблонами проектирования для сохранения отдельных фрагментов кода независимыми от других компонентов. Это обеспечивает хорошую структурированность кода.
Модули должны быть функциями, вызываемыми прямо на месте (IIFE, Immediately-Invoked-Function-Expressions), чтобы обеспечить приватные области действия, то есть замыкание, которое защищает переменные и методы. Вот как примерно это может выглядеть:
// declare private variables and/or functions
return {
// declare public variables and/or functions
}
})();
Здесь мы создаем экземпляры приватных переменных и/или функций перед возвратом нашего объекта, который мы хотим вернуть. Код за пределами нашего замыкания не может получить доступ к этим приватным переменным, поскольку он не находится в той же области действия.
Coderoll | Frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
👍3❤1🔥1
Ответ:
LocalStorage и sessionStorage предназначены для хранения данных на клиенте, их нельзя прочитать с сервера. Они не подходят для хранения конфиденциальных данных. Размер localStorage и sessionStorage около 5 Мб, в зависимости от браузера. Данные в localStorage хранятся постоянно, пока не почистят cookies, а в sessionStorage — в течение одной пользовательской сессии, то есть пока пользователь не закроет вкладку браузера.
Ставь ❤️ если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
❤4💅2
Ответ:
с помощью свойства opacity;
с помощью свойства visibility;
с помощью position:absolute;
уменьшить размеры элемента до нуля.
Ставь ❤️ если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
❤4💅3
Игровой тренжёр по TypeScript
На сервисе лежат игры по программированию для новичков, чтобы улучшить навыки в кодинге через задачки и упражнения
Да, сервис доступен на русском и английском, визуал тоже кайфовый
👀 Попробовать
Coderoll | Frontend #typescript
На сервисе лежат игры по программированию для новичков, чтобы улучшить навыки в кодинге через задачки и упражнения
Да, сервис доступен на русском и английском, визуал тоже кайфовый
Coderoll | Frontend #typescript
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥4❤2
❓ Чем useEffect отличается от useLayoutEffect в React?
useEffect выполняется асинхронно, после рендера компонента.
useLayoutEffect выполняется синхронно сразу после рендера, но перед отрисовкой на экране.
Используйте useLayoutEffect , если вам нужно сделать вычисления до отрисовки (например, измерить размер элемента перед его рендерингом).
Ставь ❤️ если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend
Ставь ❤️ если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend
💅7❤4
VueUse – коллекция полезных хуков для Vue 3
Это набор готовых реактивных утилит, которые упрощают разработку на Vue.
🔥 Что есть полезного?
✔️ useMouse() – отслеживание движения мыши
✔️ useDark() – автоматическая смена темы
✔️ useFetch() – удобный API-запрос с кешированием
👀 Попробовать
Coderoll | Frontend
Это набор готовых реактивных утилит, которые упрощают разработку на Vue.
🔥 Что есть полезного?
✔️ useMouse() – отслеживание движения мыши
✔️ useDark() – автоматическая смена темы
✔️ useFetch() – удобный API-запрос с кешированием
👀 Попробовать
Coderoll | Frontend
👍4🔥1
Unocss – ультрабыстрый CSS-фреймворк
Если ты используешь Tailwind, попробуй UnoCSS – он еще быстрее и гибче! Поддерживает динамические классы, работу с темами и минимальный размер бандла.
🔥 Почему стоит попробовать?
✔️ Генерирует только используемые стили
✔️ Гибкость и мощные пресеты
✔️ Лучшая производительность по сравнению с Tailwind
👀 Попробовать
Coderoll | Frontend
Если ты используешь Tailwind, попробуй UnoCSS – он еще быстрее и гибче! Поддерживает динамические классы, работу с темами и минимальный размер бандла.
🔥 Почему стоит попробовать?
✔️ Генерирует только используемые стили
✔️ Гибкость и мощные пресеты
✔️ Лучшая производительность по сравнению с Tailwind
👀 Попробовать
Coderoll | Frontend
👍3🔥1
❓ Что такое Higher-Order Function?
Ответ:
Higher-Order Function — это функция, которая принимает другие функции в качестве аргументов или возвращает функцию в качестве результата. Примеры встроенных higher-order функций в JavaScript: map, filter, reduce.
Ставь ❤️ если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend
Ответ:
Ставь ❤️ если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend
💅6❤3
5 игр-тренажеров для прокачки фронтенда 🎮
Осваивать технологии легче в игровой форме. Парочка игр уже были в предыдущих постах — а вот ещё дополнение к ним:
Flexbox Froggy 🐸
Если хотите прокачать Flexbox, попробуйте сыграть за лягушек и расположить их по нужным местам на пруду. Отличная практика на flex-direction, justify-content и другие свойства!
🔗 https://flexboxfroggy.com/
Grid Garden 🌱
А вот тренажёр для CSS Grid: расставляем грядки, используя grid-template-columns, grid-area и другие свойства. Отличный способ освоить сетки в CSS.
🔗 https://cssgridgarden.com/
CSS Diner 🍽️
Для тренировки селекторов CSS идеален CSS Diner! Игра помогает разобраться в основах селекторов и понять, как выбирать элементы в DOM.
🔗 https://flukeout.github.io/
CodeCombat ⚔️
Эта игра для тех, кто хочет развить навыки программирования, включая JavaScript. Сражения с монстрами и решения головоломок в игре требуют от вас писать код. Особенно полезно для практики базового JS!
🔗 https://codecombat.com/
JavaScript 30 📆
Не совсем игра, но челлендж, где за 30 дней вы создадите 30 небольших проектов, каждый из которых оттачивает какой-то конкретный аспект JS. Подходит для продвинутых новичков и тех, кто хочет улучшить навыки JS.
🔗 https://javascript30.com/
Coderoll | Frontend | #Тренажёр
Осваивать технологии легче в игровой форме. Парочка игр уже были в предыдущих постах — а вот ещё дополнение к ним:
Flexbox Froggy 🐸
Если хотите прокачать Flexbox, попробуйте сыграть за лягушек и расположить их по нужным местам на пруду. Отличная практика на flex-direction, justify-content и другие свойства!
🔗 https://flexboxfroggy.com/
Grid Garden 🌱
А вот тренажёр для CSS Grid: расставляем грядки, используя grid-template-columns, grid-area и другие свойства. Отличный способ освоить сетки в CSS.
🔗 https://cssgridgarden.com/
CSS Diner 🍽️
Для тренировки селекторов CSS идеален CSS Diner! Игра помогает разобраться в основах селекторов и понять, как выбирать элементы в DOM.
🔗 https://flukeout.github.io/
CodeCombat ⚔️
Эта игра для тех, кто хочет развить навыки программирования, включая JavaScript. Сражения с монстрами и решения головоломок в игре требуют от вас писать код. Особенно полезно для практики базового JS!
🔗 https://codecombat.com/
JavaScript 30 📆
Не совсем игра, но челлендж, где за 30 дней вы создадите 30 небольших проектов, каждый из которых оттачивает какой-то конкретный аспект JS. Подходит для продвинутых новичков и тех, кто хочет улучшить навыки JS.
🔗 https://javascript30.com/
Coderoll | Frontend | #Тренажёр
Please open Telegram to view this post
VIEW IN TELEGRAM
❤3