IT путешествие

Несмотря на наличие position: sticky; в css я бы не назвал его простым в использовании: нужно выполнение большого количества условий для его реализации. Предлагаю решение на js. // выберите элемент за которым надо следить const isSticky = false; const element = document.getElementById('.element'); const windowHeight = window...

Про этот метод многие знают, но страница может при загрузке перевести вас куда-нибудь в середину. Поэтому лучше учитывать также положение body и высчитывать разницу. const bodyRect = document.body.getBoundingClientRect(); const elemRect = document...

Если вам потребовалось обернуть компонент в <ClientOnly> и нужно получить доступ к нему, то попробуйте схему ниже ------------------------- <script setup lang="ts"> onMounted(async (): Promise<void> => { await nextTick(); await nextTick(); console...

Недавно устанавливал приложение Nuxt на сервер (ос Ubuntu 22) и обнаружил ошибку в NuxtImg - на продакшене он не работает. Долго искал почему и узнал, что требуется установить еще один пакет. npm install...

Недавно у меня была проблема - я пытался сделать красивое появление картинки, после ее загрузки. Но не мог это сделать при анимированном page transition. И до этого при больших списках элементов не все было гладко. Теперь же я понял в чем была ошибка - нужно было использовать onMounted) компонент BaseImage <script setup lang="ts">. .. const props = defineProps({ ... }) let isLoaded = ref<boolean>(false) function onLoad(): void { isLoaded.value = true } onMounted(async (): Promise<void> => { await nextTick() onLoad() }) </script> <template> <div :class="cn('relative', props...

Только что узнал как типизировать полученные данные в Nuxt. pages/index.vue interface TypedData { id: number title: string } const { data: article }: { data: Ref<TypedData> } = await useFetch('http://url...

Введение Экспертиза в распространенных frontend темах и способность показать необходимые навыки очень важны для Frontend-разработчика, они выделяют вас как кандидата на работу вашей мечты. В этой статье в формате "вопрос - ответ" рассматриваются 10 наиболее распространенных вопросов на собеседованиях по Frontend, с которыми я сталкивался во время собеседований с Frontend-разработчиками. 1. Что такое HTTP? HTTP расшифровывается как HyperText Transfer Protocol. Это прикладной протокол, позволяющий передавать данные. HTTP позволяет получать ресурсы, такие как HTML-страницы, изображения, видео и т...