erid: 2VtzqvwpLr2

В IT получают больше 250к только те, кто умеют вести переговоры

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

Если это про тебя, подписывайся на канал Выше вилки. Достаточно прочесть в нём хотя бы пару приёмов переговоров — и вы сможете увеличить свой доход на 30%.

Подписывайтесь: @above_the_range

реклама. рекламодатель ИП Шишков Илья Иванович ИНН: 575206903941

👉 @frontendInterview

В чём разница между git pull и git fetch?

Разница заключается в том, что git fetch просто извлекает изменения из удалённого репозитория, а git pull извлекает их и применяет к локальному репозиторию. Упростив действительность. можно сказать, что git pull = git fetch + git merge.

👉 @frontendInterview

Mastering Reactive JavaScript

Эта книга предназначена для опытных JavaScript разработчиков, ищущие новые инструменты и подходы к программированию, и рассказывает про основы реактивного программирования. В двух словах, реактивное программирование  -  это программирование на асинхронных потоках данных. Вы познакомитесь с основами данного программирования, паттернами и примерами реальных приложений.

👉 @frontendInterview

Sum of two lowest positive integers

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

Например, когда массив передается как [19, 5, 42, 2, 77] вывод должен быть 7.

👉 @frontendInterview

​Что такое Test Double и Fake? В чём отличие от Mock и Stub?

Test Double
Это обобщенное обозначение для всех видов замен (заглушек) настоящих объектов в тестах. Он включает в себя такие термины, как Dummy, Fake, Stub, Mock и другие, которые представляют собой замены для реальных объектов во время тестирования.

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

Отличие между Mock и Stub:
- Stub - это тип "заглушки", который предоставляет заранее определенные ответы на вызовы методов или функций.
- Mock - это тип "заглушки", который также предоставляет заранее определенные ответы, но также содержит утверждения (assertions), которые проверяют, были ли вызваны определенные методы или функции и сколько раз они были вызваны.

Итак, в чем их отличие:
- Fake представляет собой упрощенную реализацию с реальным поведением.
- Stub предоставляет заранее определенные ответы на вызовы методов или функций.
- Mock также предоставляет заранее определенные ответы, но содержит также утверждения о вызовах методов или функций.

👉 @frontendInterview

👉 @frontendInterview

​Что такое серверный/клиентский/изоморфный рендеринг? Каковы их отличия?

Серверный рендеринг:
Серверный рендеринг означает, что HTML страница сначала генерируется на сервере, а затем отправляется на клиент. Клиент получает готовый HTML и начинает отображение страницы. Такой подход применяется в традиционных веб-приложениях.

Клиентский рендеринг:
В клиентском рендеринге HTML, CSS и JavaScript отправляются клиенту, и отображение содержимого происходит непосредственно на стороне клиента при помощи JavaScript. Один из примеров такого подхода - использование фреймворков, таких как React или Vue, где основная часть отображения происходит на стороне клиента.

Изоморфный (или универсальный) рендеринг:
Изоморфный рендеринг сочетает в себе серверный и клиентский рендеринг. При этом страница рендерится как на сервере, так и на клиенте, и последующие запросы на сервер могут обрабатываться клиентским кодом. Такой подход обеспечивает инициализацию страницы на сервере, что положительно сказывается на SEO и начальной загрузке страницы. После загрузки страницы JavaScript-код берет на себя управление и обеспечивает интерактивность.

Отличия:
1. Время инициализации: Серверный рендеринг и изоморфный рендеринг предоставляют начальное содержимое на сервере, в то время как клиентский рендеринг инициализируется на стороне клиента.
2. SEO: Серверный рендеринг и изоморфный рендеринг являются лучшими вариантами для SEO, так как поисковые системы могут проиндексировать контент на этапе загрузки страницы.
3. Производительность: Клиентский рендеринг может обеспечить лучшую интерактивность, но серверный и изоморфный рендеринг обычно демонстрируют более быструю первоначальную загрузку страницы.

👉 @frontendInterview

👉 @frontendInterview

​Как сделать изоморфное приложение?

Что такое изоморфное приложение?
Изоморфное веб-приложение (также известное как универсальное) представляет собой приложение, которое выполняется как на сервере, так и на клиенте, обеспечивая возможность генерировать контент на сервере и динамически обновлять его на клиенте. Это позволяет улучшить производительность на этапе загрузки страницы, а также иметь преимущества для SEO.

Преобразование обычного приложения в изоморфное:
1. Выбор фреймворка/библиотеки: Выберите фреймворк или библиотеку, которая поддерживает изоморфный рендеринг, такие как Next.js. или Nuxt.js. Эти инструменты предоставляют средства для создания изоморфных приложений.

2. Разделяемый код: Один из ключевых аспектов изоморфного приложения - это возможность использования одного и того же кода как на серверной стороне (Node.js), так и на клиентской стороне. Это позволяет переиспользовать код и логику между сервером и клиентом.

3. Серверный рендеринг: Создайте серверную часть приложения, которая будет отвечать за генерацию HTML контента на сервере. Это обычно делается с помощью специальных методов рендеринга.

4. Клиентский рендеринг: Убедитесь, что ваш клиентский код может обрабатывать переход к изоморфной странице и продолжить работу, начатую на сервере.

👉 @frontendInterview

Svelte и Sapper в действии

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

Хотите научиться создавать быстрые и элегантные веб-приложения?

Вам помогут компоненты Svelte и качественный опыт взаимодействия. Вы научитесь использовать уникальную модель управления состояниями, освоите упрощенную маршрутизацию страниц, разбиение кода, поддержку автономного режима и работу с представлениями, генерируемыми на сервере.

👉 @frontendInterview

Incrementer

Вам дан массив чисел. Создайте функцию, которая увеличит каждое число на его позицию в массиве.
Результат может содержать только однозначные числа, так что если добавление цифры с её позицией дает вам многозначное число, то должна быть возвращена только последняя цифра.
(массивы будут содержать только числа)

Пример:
[1, 2, 4] --> [2, 4, 7]
#[1+1, 2+2, 4+3]

[4, 6, 9, 1, 3] --> [5, 8, 2, 5, 8]
# [4+1, 6+2, 9+3, 1+4, 3+5]
# 9+3 = 12 --> 2

👉 @frontendInterview

​<dialog>

Тег создаёт всплывающее окно или диалог. По умолчанию не показывается на странице.

Может открываться в двух режимах:
1. Всплывающее окно — не блокирует взаимодействие со страницей.
2. Модальное окно — откроется поверх страницы, имеет фоновое затемнение, остальной контент не доступен для взаимодействия.

Как и у элемента <details>, по умолчанию содержимое окна скрыто от пользователя, но его можно отобразить через атрибут open.
<dialog open>
Я виден. Привет! 👋
</dialog>

<dialog>
Я скрыт от пользователя 🥷
</dialog>

Также окно можно открыть с помощью JavaScript-методов:
1. show() — добавляет атрибуты open и aria-modal="false".
2. showModal() — открывает в режиме «модального окна». Добавляет атрибуты open и aria-modal="true". Появляется подложка в виде псевдоэлемента ::backdrop, который можно стилизовать.
<button type="button" onclick="window.myDialog.show()">
Просто открыть
</button>
<button type="button" onclick="window.myDialog.showModal()">
Открыть как модалку
</button>
<dialog id="myDialog">🖖 Живи долго и процветай!</dialog>

👉 @frontendInterview