😔 Тильтовать — часть моей работы

Бывают моменты, когда тебе ставят новую задачу, ты оцениваешь её определённым уровнем сложности и выставляешь себе условный дедлайн. И в рандомный момент вдруг начинается какая-то жесть, ты понимаешь, что ты не справишься к обусловленному сроку, потому, что ЭТА ХРЕНОВИНА НЕ РАБОТАЕТ И Я НЕ МОГУ ПОНЯТЬ ПОЧЕМУ! Ты можешь потратить не один день на попытки понять, почему это так. Ты просто не видишь ошибки, ты отдебажил всё, что можно и не понимаешь как решить эту проблему. И как объяснить руководству, почему ты не успел закончить задачу, когда ты сам не понимаешь причины? Начинается полный тильт. Но одним прекрасным утром, в очередной раз, когда ты открываешь свой код, тебе внезапно приходит мысль «А что, если…» и после небольшого мозгового штурма, ты закрываешь свой вопрос за час. Просто в момент приходит осознание того, что решение оказывается всегда было перед носом. И в эту секунду, я обычно испытываю противоречивые чувства, с одной стороны — радость, а с другой — угнетение, ведь ты столько времени потратил, чтобы решить эту маленькую грёбаную проблемку. Так и живём.

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

А где ссылочка на превью и код? Да вот же она — ✨ ссылочка ✨

#песочница

Не могу жить без TypeScript ❤️‍🔥

Когда я только начинал заниматься фронтенд–разработкой, моим основным языком программирования был JS и меня он более чем устраивал. Конечно, я тогда слышал про TypeScript, но мне казалось, что это что–то сложное и вообще мне ненужное. Но когда я устроился на работу в ГоуТур, мы с командой приняли общее решение использовать в своём проекте именно TS, т.к. на тот момент нас было аж четверо фронтендеров и работу нужно было как–то приводить к одному общему стилю написания кода. Пускай меня тогда и пугала перспектива перехода на новый язык, но когда я углубился в его суть и почитал парочку статей, я загорелся идеей его изучать. В итоге, спустя больше года разработки проекта, я теперь не могу представить свою работу без него. Когда мне приходится писать какой–то JavaScript код, у меня сразу появляется чувство неполноценности. Ощущение, что я делаю какой–то неправильный или даже небезопасный код. Поэтому любой мой пет–проект теперь начинается с установки TypeScript. Почему? Он делает код предсказуемым и систематичным, что в свою очередь и даёт так называемую «безопасность». Ты описываешь все данные, с которыми работаешь, указываешь какой у них должен и может быть тип, исключая на этом этапе все возможные ошибки этого рода. За это я и полюбил TypeScript. В этом и есть его суть. Я очень рад, что познакомился и не побоялся изучать этот язык. Ведь теперь мне этот страшный и сложный код кажется понятным, опрятным и надёжным!

object-fit — свойство, которое позволяет вместить изображение в любой контейнер с сохранением пропорций. Всё, что нужно сделать, это задать необходимый размер родительскому контейнеру, а тег img растянуть на 100% по ширине и высоте, после чего указать данное свойство со значением «contain».

Пример использования 👈

#cssфичи

Я устал, я ухожу… в отпуск

В последнее время, я чувствовал, что сильно измотан. Моя голова каждый вечер дико кипела после работы, а когда я закрывал ноутбук, мне хотелось просто лечь на диван и ничего не делать. Поэтому я решил, что пора ребутить мозги и взял себе отпуск на 2 недели. Вы только представьте 2 НЕДЕЛИ БЕЗ ПРОГРАММИРОВАНИЯ! Не нужно думать о дедлайнах, о каких-то фичах, багах и прочих рабочих моментах. Так что начиная с завтрашнего дня я планирую как следует отдохнуть и по минимуму садиться за комп. Дышать свежим воздухом, ходить в кино, смотреть сериалы и кушать разные вкусности. Именно об этом я и мечтал последние несколько месяцев. Кто знает, может даже удастся собрать друзей поиграть в настолки! ☺️

Минутка полезности 👨‍💻

every — метод массива, о котором часто многие забывают и начинают придумывать велосипеды в своих проектах. Данный метод возвращает результат проверки всех значений массива на указаное условие.

#полезное

Часто ловлю себя на мысли, что во время работы на меня очень сильно влияет моё окружение. Например, я не могу нормально работать, когда за окном пищит чья-то машина или когда соседи решают устроить недельный марафон по ремонту в будние дни (иногда мне кажется, что это NPC, иначе почему они занимаются этим с утра до вечера, а не работой).

Кто-то скажет: «Ага! Вот оно! Это всё потому, что дома нерабочая атмосфера, а вот в ооофисе…».
А я отвечу, что тоже самое у меня было и в офисе (когда я в него ещё ходил), там также часто рабочая атмосфера срывалась болтовнёй с коллегами, которая могла затянуться на весь день.

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

Поэтому единственный выход, который я для себя нашел — это девочка в больших наушниках. Да, я говорю о знаменитом youtube-канале с абстрактной расслабляющей музыкой. Она реально мне помогает приглушить все внешние раздражители и сосредоточиться на своих мыслях. Я знаю людей, которые могут работать абсолютно в любом месте и при любых обстоятельствах, но к сожалению, я к таковым не отношусь.

А как у вас обстоят дела с подобными проблемами? Получается ли у вас сосредоточиться на работе не смотря на внешние триггеры? 😱

Сколько должна длиться стандартная анимация на сайте?

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

Ссылка на codepen 😎

#cssфичи

Новый проект, как глоток свежего воздуха

Уже больше полутора лет я работаю над одним и тем же проектом. Как в любой сфере и с любым делом, когда ты долго работаешь над чем-то одним, тебя это перестаёт радовать. Пропадает азарт и интерес, всё превращается в сплошную рутину. И как же я был рад тому, что мне в один прекрасный день предложили поработать над новым небольшим продуктом. Это чувство развёртывания проекта с нуля можно сравнить с распаковкой новой техники или с запахом новой книги. Передо мной снова чистый лист, где я могу выбрать новые инструменты для работы или переосмыслить структуру проекта с учётом полученного опыта. Из чего я сделал для себя следующий вывод: переключаться между проектами — это то, что помогает не уставать от своей работы. Главное делать это вовремя и в меру. Я сомневаюсь, что если часто прыгать по проектом будет тот же результат, но в моём случае, это произошло как раз тогда, когда я почувствовал застой в своей работе. И теперь после большого количества времени работы над одним проектом, мне наконец снова интересно писать код. Такие дела 😊