Тесты и задачи по HTML, CSS и JS
Эти тесты подойдут вам, если вы уже знаете основы HTML, CSS, JavaScript и хотите проверить свои знания, закрепив ранее изученные материалы.
Вы также узнаете много нового: нюансы, тонкости, особенности, интересные возможности о которых могли не знать раньше.
👀 Проверить знания
Coderoll | Frontend
Эти тесты подойдут вам, если вы уже знаете основы HTML, CSS, JavaScript и хотите проверить свои знания, закрепив ранее изученные материалы.
Вы также узнаете много нового: нюансы, тонкости, особенности, интересные возможности о которых могли не знать раньше.
👀 Проверить знания
Coderoll | Frontend
❓ Что такое промисы (Promises) в JavaScript?
Ответ:
Промисы — это объект, представляющий результат асинхронной операции. У промиса есть три состояния: pending (ожидание), fulfilled (успех) и rejected (ошибка). Они позволяют работать с асинхронным кодом без использования коллбэков.
Ставь ❤️ если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend
Ответ:
Ставь ❤️ если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend
TanStack Query – must-have для работы с API
Библиотека, которая делает работу с серверными данными в React и Vue в разы проще. Кэширование, рефетчинг, автоматические обновления – все на высшем уровне. Забудь про useEffect и стейты для загрузки данных!
👀 Попробовать
Coderoll | Frontend
Библиотека, которая делает работу с серверными данными в React и Vue в разы проще. Кэширование, рефетчинг, автоматические обновления – все на высшем уровне. Забудь про useEffect и стейты для загрузки данных!
👀 Попробовать
Coderoll | Frontend
❓ Что такое Event Delegation?
Ответ:
Event Delegation — это техника, при которой обработчик события назначается родительскому элементу, а не каждому дочернему элементу. Это позволяет обрабатывать события для элементов, которые могут быть добавлены в DOM после загрузки страницы.
Ставь ❤️ если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend
Ответ:
Ставь ❤️ если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend
Ответ:
LocalStorage и sessionStorage предназначены для хранения данных на клиенте, их нельзя прочитать с сервера. Они не подходят для хранения конфиденциальных данных. Размер localStorage и sessionStorage около 5 Мб, в зависимости от браузера. Данные в localStorage хранятся постоянно, пока не почистят cookies, а в sessionStorage — в течение одной пользовательской сессии, то есть пока пользователь не закроет вкладку браузера.
Ставь ❤️ если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Ответ:
с помощью свойства opacity;
с помощью свойства visibility;
с помощью position:absolute;
уменьшить размеры элемента до нуля.
Ставь ❤️ если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Игровой тренжёр по TypeScript
На сервисе лежат игры по программированию для новичков, чтобы улучшить навыки в кодинге через задачки и упражнения
Да, сервис доступен на русском и английском, визуал тоже кайфовый
👀 Попробовать
Coderoll | Frontend #typescript
На сервисе лежат игры по программированию для новичков, чтобы улучшить навыки в кодинге через задачки и упражнения
Да, сервис доступен на русском и английском, визуал тоже кайфовый
Coderoll | Frontend #typescript
Please open Telegram to view this post
VIEW IN TELEGRAM
❓ Чем useEffect отличается от useLayoutEffect в React?
useEffect выполняется асинхронно, после рендера компонента.
useLayoutEffect выполняется синхронно сразу после рендера, но перед отрисовкой на экране.
Используйте useLayoutEffect , если вам нужно сделать вычисления до отрисовки (например, измерить размер элемента перед его рендерингом).
Ставь ❤️ если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend
Ставь ❤️ если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend
VueUse – коллекция полезных хуков для Vue 3
Это набор готовых реактивных утилит, которые упрощают разработку на Vue.
🔥 Что есть полезного?
✔️ useMouse() – отслеживание движения мыши
✔️ useDark() – автоматическая смена темы
✔️ useFetch() – удобный API-запрос с кешированием
👀 Попробовать
Coderoll | Frontend
Это набор готовых реактивных утилит, которые упрощают разработку на Vue.
🔥 Что есть полезного?
✔️ useMouse() – отслеживание движения мыши
✔️ useDark() – автоматическая смена темы
✔️ useFetch() – удобный API-запрос с кешированием
👀 Попробовать
Coderoll | Frontend
Unocss – ультрабыстрый CSS-фреймворк
Если ты используешь Tailwind, попробуй UnoCSS – он еще быстрее и гибче! Поддерживает динамические классы, работу с темами и минимальный размер бандла.
🔥 Почему стоит попробовать?
✔️ Генерирует только используемые стили
✔️ Гибкость и мощные пресеты
✔️ Лучшая производительность по сравнению с Tailwind
👀 Попробовать
Coderoll | Frontend
Если ты используешь Tailwind, попробуй UnoCSS – он еще быстрее и гибче! Поддерживает динамические классы, работу с темами и минимальный размер бандла.
🔥 Почему стоит попробовать?
✔️ Генерирует только используемые стили
✔️ Гибкость и мощные пресеты
✔️ Лучшая производительность по сравнению с Tailwind
👀 Попробовать
Coderoll | Frontend
❓ Что такое Higher-Order Function?
Ответ:
Higher-Order Function — это функция, которая принимает другие функции в качестве аргументов или возвращает функцию в качестве результата. Примеры встроенных higher-order функций в JavaScript: map, filter, reduce.
Ставь ❤️ если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend
Ответ:
Ставь ❤️ если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend
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
tRPC
Полноценный инструмент для работы с API без необходимости в REST или GraphQL. Позволяет напрямую вызывать серверные функции из клиента с полной поддержкой TypeScript.
👀 Попробовать
Coderoll | Frontend
Полноценный инструмент для работы с API без необходимости в REST или GraphQL. Позволяет напрямую вызывать серверные функции из клиента с полной поддержкой TypeScript.
👀 Попробовать
Coderoll | Frontend
Swiper
Самый популярный слайдер для веб-приложений. Подходит для мобильных и десктопных интерфейсов, поддерживает горизонтальную и вертикальную прокрутку, эффекты и кастомизацию.
👀 Попробовать
Coderoll | Frontend
Самый популярный слайдер для веб-приложений. Подходит для мобильных и десктопных интерфейсов, поддерживает горизонтальную и вертикальную прокрутку, эффекты и кастомизацию.
👀 Попробовать
Coderoll | Frontend
Вопрос с собеседования:
❓ Что такое замыкания?
Это функция, у которой есть доступ к области видимости, сформированной внешней по отношению к ней функции даже после того, как эта внешняя функция завершила работу.
Это значит, что в замыкании могут храниться переменные, объявленные во внешней функции и переданные ей аргументы.
Ставь ❤️если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend
Это значит, что в замыкании могут храниться переменные, объявленные во внешней функции и переданные ей аргументы.
Ставь ❤️если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Vite (если вдруг вы ещё не работали с ним — обязательно посмотрите)
Vite — это невероятно быстрый инструмент сборки интерфейса, обеспечивающий работу веб-приложений нового поколения. Обеспечивает молниеносную скорость благодаря использованию ES-модулей. Поддерживает TypeScript, Vue, React и многие другие фреймворки.
👀 Попробовать
Coderoll | Frontend #vite
Vite — это невероятно быстрый инструмент сборки интерфейса, обеспечивающий работу веб-приложений нового поколения. Обеспечивает молниеносную скорость благодаря использованию ES-модулей. Поддерживает TypeScript, Vue, React и многие другие фреймворки.
Coderoll | Frontend #vite
Please open Telegram to view this post
VIEW IN TELEGRAM
Привет. Вот тебе самые топовые каналы по IT!
⚙️ Free Znanija (IT) — Самая огромная коллекция платных курсов, которые можно скачать бесплатно;
👩💻 IT библиотека — Самая огромная библиотека книг;
💻 Hacking & InfoSec Base — Крутой блог белого хакера;
🛡 CyberGuard — Всё про ИБ;
👩💻 linux administration — Всё про Линукс;
👩💻 Программистика — Python, python и ещё раз python;
👩💻 GameDev Base — Всё про GameDev;
🖥 Coding Base — Мемы, полезные репозитории и инструменты, а так же софт:
А так же крутой блог админа: Rahol Jey | тг вайб
А так же крутой блог админа: Rahol Jey | тг вайб
Please open Telegram to view this post
VIEW IN TELEGRAM
❓Как работает this в JavaScript?
В глобальной области: this ссылается на window (в браузере) или global (в Node.js).
В методах объектов: this ссылается на объект, в котором вызван метод.
В стрелочных функциях: this берется из внешнего контекста.
Ставь ❤️ если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend
Ставь ❤️ если знаешь ответ
Если нет — ставь 💅
Coderoll | Frontend