CodeRoll | Frontend
4.98K subscribers
1.6K photos
73 videos
1 file
911 links
— Лучшее для разработчика и дизайнера / IT инструменты, курсы и книги
— Веб-разработка на JS, HTML, CSS, React, Vue,Angular

Купить рекламу: https://telega.in/c/coderoll

Чат: https://t.me/coderoll_chat

По всем вопросам пишите сюда - @yankovsky_ads
Download Telegram
Что такое JSON.parse() и JSON.stringify()?

Ответ:
JSON.parse() преобразует JSON-строку в JavaScript-объект или массив.
JSON.stringify() преобразует JavaScript-объект или массив в JSON-строку.

Ставь ❤️ если знаешь ответ
Если нет — ставь 💅

Coderoll | Frontend
9💅2
Вопрос с FrontEnd-собеседования 👨‍💻

Опишите шаблон проектирования "Модуль" в Javascript


Как лучше ответить:

Модули JavaScript являются наиболее часто используемыми шаблонами проектирования для сохранения отдельных фрагментов кода независимыми от других компонентов. Это обеспечивает хорошую структурированность кода.

Модули должны быть функциями, вызываемыми прямо на месте (IIFE, Immediately-Invoked-Function-Expressions), чтобы обеспечить приватные области действия, то есть замыкание, которое защищает переменные и методы. Вот как примерно это может выглядеть:


(function() {
// 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
👍4🔥21
DevDocs

Универсальная платформа с документацией по различным технологиям (JS, Vue, React, CSS и другим).

Все документации в одном месте без необходимости гуглить.

👀 Ссылка

Coderoll | Frontend
3
Что такое Closure и как его избежать?

Ответ:
Closure — это функция, которая запоминает своё внешнее окружение. Чтобы избежать нежелательных замыканий, можно использовать let вместо var внутри циклов или пересоздавать область видимости.

Ставь ❤️ если знаешь ответ
Если нет — ставь 💅

Coderoll | Frontend
4💅3
В чем разница между null и undefined?

Ответ:
null — это значение, которое означает "отсутствие значения". Его можно присвоить переменной намеренно.
undefined — это значение, которое указывает, что переменная была объявлена, но ей не присвоено значение.

Ставь ❤️ если знаешь ответ
Если нет — ставь 💅

Coderoll | Frontend
7💅1
Современный JavaScript. От новичка до профи [2024]

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

Вне зависимости от уровня подготовки, курс обеспечит вас всей самой необходимой информацией для успешного освоения JS.

👀 Посмотреть курс

Coderoll | Frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Разбираем 5 способов ускорить сайт: от простого к сложному

Каждая миллисекунда важна! В этой статье разбираются топовые способы оптимизации загрузки страницы

👀 Читать

Coderoll | Frontend
Что такое Virtual DOM?

Virtual DOM – это концепция, используемая в React и других библиотеках для эффективного обновления пользовательского интерфейса. Вместо прямых изменений в реальном DOM, React сначала обновляет виртуальную копию, сравнивает изменения (diffing), а затем минимально обновляет реальный DOM.

Virtual DOM делает обновления производительнее, так как минимизирует количество реальных манипуляций с DOM.

Ставь ❤️ если знаешь ответ
Если нет — ставь 💅

Coderoll | Frontend
3💅3
Тесты и задачи по HTML, CSS и JS

Эти тесты подойдут вам, если вы уже знаете основы HTML, CSS, JavaScript и хотите проверить свои знания, закрепив ранее изученные материалы.

Вы также узнаете много нового: нюансы, тонкости, особенности, интересные возможности о которых могли не знать раньше.

👀 Проверить знания

Coderoll | Frontend
👍1
Что такое промисы (Promises) в JavaScript?

Ответ:
Промисы — это объект, представляющий результат асинхронной операции. У промиса есть три состояния: pending (ожидание), fulfilled (успех) и rejected (ошибка). Они позволяют работать с асинхронным кодом без использования коллбэков.

Ставь ❤️ если знаешь ответ
Если нет — ставь 💅

Coderoll | Frontend
6👍2💅1
TanStack Query – must-have для работы с API

Библиотека, которая делает работу с серверными данными в React и Vue в разы проще. Кэширование, рефетчинг, автоматические обновления – все на высшем уровне. Забудь про useEffect и стейты для загрузки данных!

👀 Попробовать

Coderoll | Frontend
Что такое Event Delegation?

Ответ:
Event Delegation — это техника, при которой обработчик события назначается родительскому элементу, а не каждому дочернему элементу. Это позволяет обрабатывать события для элементов, которые могут быть добавлены в DOM после загрузки страницы.

Ставь ❤️ если знаешь ответ
Если нет — ставь 💅

Coderoll | Frontend
4💅2
Разбираем вопрос с 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
👍31🔥1
⚡️В чём разница между cookie, sessionStorage и localStorage?

Ответ:
Сookies — наиболее защищенный способ хранения данных в браузере. К информации, хранящейся в cookies, можно получить доступ как с бэкенда на сервере, так и в браузере, они отправляются с HTTP-запросами. Максимальный размер — 4 Кб.

LocalStorage и sessionStorage предназначены для хранения данных на клиенте, их нельзя прочитать с сервера. Они не подходят для хранения конфиденциальных данных. Размер localStorage и sessionStorage около 5 Мб, в зависимости от браузера. Данные в localStorage хранятся постоянно, пока не почистят cookies, а в sessionStorage — в течение одной пользовательской сессии, то есть пока пользователь не закроет вкладку браузера.


Ставь ❤️ если знаешь ответ
Если нет — ставь 💅

Coderoll | Frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
4💅2
⚡️Какими способами можно визуально скрыть элемент?

Ответ:
с помощью свойства display;
с помощью свойства opacity;
с помощью свойства visibility;
с помощью position:absolute;
уменьшить размеры элемента до нуля.


Ставь ❤️ если знаешь ответ
Если нет — ставь 💅

Coderoll | Frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
4💅3
Игровой тренжёр по TypeScript

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

Да, сервис доступен на русском и английском, визуал тоже кайфовый

👀Попробовать

Coderoll | Frontend #typescript
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥42
Чем useEffect отличается от useLayoutEffect в React?

useEffect выполняется асинхронно, после рендера компонента.

useLayoutEffect выполняется синхронно сразу после рендера, но перед отрисовкой на экране.

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

Ставь ❤️ если знаешь ответ
Если нет — ставь 💅

Coderoll | Frontend
💅74
VueUse – коллекция полезных хуков для Vue 3

Это набор готовых реактивных утилит, которые упрощают разработку на Vue.

🔥 Что есть полезного?
✔️ useMouse() – отслеживание движения мыши
✔️ useDark() – автоматическая смена темы
✔️ useFetch() – удобный API-запрос с кешированием

👀 Попробовать

Coderoll | Frontend
👍4🔥1
Unocss – ультрабыстрый CSS-фреймворк

Если ты используешь Tailwind, попробуй UnoCSS – он еще быстрее и гибче! Поддерживает динамические классы, работу с темами и минимальный размер бандла.

🔥 Почему стоит попробовать?
✔️ Генерирует только используемые стили
✔️ Гибкость и мощные пресеты
✔️ Лучшая производительность по сравнению с Tailwind

👀 Попробовать

Coderoll | Frontend
👍3🔥1
Что такое Higher-Order Function?

Ответ:
Higher-Order Function — это функция, которая принимает другие функции в качестве аргументов или возвращает функцию в качестве результата. Примеры встроенных higher-order функций в JavaScript: map, filter, reduce.

Ставь ❤️ если знаешь ответ
Если нет — ставь 💅

Coderoll | Frontend
💅63