Разбираем вопрос с FrontEnd-собеседования 👨‍💻

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

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

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

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

    // declare private variables and/or functions
    return {
      // declare public variables and/or functions
    }
})();

Здесь мы создаем экземпляры приватных переменных и/или функций перед возвратом нашего объекта, который мы хотим вернуть. Код за пределами нашего замыкания не может получить доступ к этим приватным переменным, поскольку он не находится в той же области действия.

Coderoll | Frontend

⚡️В чём разница между cookie, sessionStorage и localStorage?

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

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

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

Coderoll | Frontend

⚡️Какими способами можно визуально скрыть элемент?

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

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

Coderoll | Frontend

Игровой тренжёр по TypeScript

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

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

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

Coderoll | Frontend #typescript

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 | #Тренажёр

Вопрос с собеседования:

❓Что такое замыкания?

Это функция, у которой есть доступ к области видимости, сформированной внешней по отношению к ней функции даже после того, как эта внешняя функция завершила работу.
Это значит, что в замыкании могут храниться переменные, объявленные во внешней функции и переданные ей аргументы.

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

Coderoll | Frontend

Vite (если вдруг вы ещё не работали с ним — обязательно посмотрите)

Vite — это невероятно быстрый инструмент сборки интерфейса, обеспечивающий работу веб-приложений нового поколения. Обеспечивает молниеносную скорость благодаря использованию ES-модулей. Поддерживает TypeScript, Vue, React и многие другие фреймворки.

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

Coderoll | Frontend #vite

❓Как объединить массивы?

1 - Можно использовать метод concat()
2 - Можно использовать spread оператор

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

Coderoll | Frontend