Frontend вдохновляет </> Александр Белькевич – Telegram
Frontend вдохновляет </> Александр Белькевич
1.81K subscribers
512 photos
62 videos
6 files
303 links
YouTube - https://www.youtube.com/@frontend-skills

Пишу про:
🔥 Frontend
🔥 IT
🔥 Свой опыт
🔥 Истории из жизни

Реклама: @thanksforyourmsg
Download Telegram
#frontend_templates

Первый макет, реализованный от и до (от поиска до заполнения ТЗ) от подписчика :) Макет очень интересный. Качайте, тренируйтесь)

https://frontend-skills.com/template/7Mi3E7iTmFFS7kU69wj6
🔥22👍3
#frontend_mylife

Начал готовить новый видос по интернет-магазину. Если смотрели прошлые части, то возможно помните, что появилась беда с Live Reload при сохранении. В первую очередь начал решать эту проблему. Оказалась ошибка максимально тупой - путь к папке к компонентам в инициализации роутов с маленькой буквы, а в действительности папка была названа с большой) убил 2 часа на понимание такой тупой ошибки 😁

А вы на какие максимально простые вещи тратили много времени?)
❤‍🔥15👍9
#frontend_mylife

Всем привет!

Пока задерживается выход видео. Самое обидное, что контент готов на 90%. Все упирается просто в то, чтобы заполнить данные, которые мы получаем с сервера, какими-нибудь товарами) Ну и по мелочи доработать фильтры в каталоге осталось. И после этого можно садиться за запись.

Очень большая нагрузка сейчас (последние 4 года работал в относительно лайтовом режиме. Новая работа оказалась вполне себе нелегкая временами. К тому же надо себя показать с лучшей стороны) + повели ребенка в сад, соответственно вставать в 7 утра и быть целый день бодрым не получается) надо перестраивать график)

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

Еще начинаю готовить пост про библиотеки, которому пользуюсь на Vue. Обещал еще месяц назад, но реально руки не доходят. В общем, надеюсь, что в скором времени адаптируюсь и буду дальше свеж и весел 😄
🔥27👍62
#frontend_post

Сегодня небольшой, но полезный пост.

Вы наверняка сталкивались с тем, когда вам приходят одноразовые СМС и их можно автоматически подставить в поле на сайте, чтобы не вводить вручную. Никогда не задумывались, как такое делается?

На самом деле все очень легко и на второй картинке вы можете увидеть, что все легко и просто.

С помощью inputmode и pattern мы вызываем цифровую клавиатуру. Тем не менее, вся магия происходит в autocomplete="one-time-code". Благодаря данному атрибуту мы можем подставлять код, который пришел в СМС, в input.

Пользовались подобным? Если нет, то какие интересные функции для работы с input использовали?
🔥40👍122
#frontend_mylife

Вам наверное интересно, какие у меня рабочие задачи на новой работе)

Кроме изменений под капотом есть несколько визуальных изменений:
- Для новых элементов добавлен тег "новое"
- Добавил новые виды сортировки для экскурсий)

Ну и несколько задач еще на тестировании.

Наверное, на данный момент для меня этот проект самый сложный. Куча кода, море функциональности, очень много работы с Vuex.

Из ближайшего интересного - разработка календаря 🙂

Рассказывайте, что у вас происходит)
🔥24👍1
#frontend_post

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

И так, вы решили начинать изучать frontend. Но не знаете, сколько времени это займёт. Знаете как правильно рассчитать? А никак 🙃

Что такое стать джуном? Это найти первую работу. Не по знаниям дорасти до джуна, а именно получить первый оффер и принять его. До этого момента вы стажер. Смиритесь с этим 🙂

До получения приглашения на работу вам необходимо знать:
1. HTML
2. CSS
3. JS
4. Какой-либо framework хотя бы на начальном уровне
5. Иметь адекватные soft-скиллы

Это минимум. Временами смотришь вакансии и понимаешь, что сам до джуна не дотягиваешь)

На каждый из пунктов необходимо время. Как вы можете оценить, сколько вам потребуется времени на изучение JS до такого уровня, что вы сможете писать на framework? Все зависит от вашего склада ума, насколько быстро вы врубаетесь в тему, сколько времени уделяете учебе и т.п. Влияет куча факторов. И я вас уверяю, что вы сами точно оценить не сможете, а уж я, не зная вас, точно ответить на этот вопрос не смогу 🙃

Банальный пример. Сейчас я изучаю какую-то технологию. Почему Senior Frontend Developer ее не знает (пусть это будет TS, Docker, GSAP, D3 и все что угожно)? Да потому что для решения бизнес-задач, которые приносят прибыль моему работодателю, он не нужен. Почему в итоге учу? Чтобы не отставать от трендов. Никто не знает, что нас ждёт завтра. Надо быть готовым ко всему (поэтому быть на волне так важно) 👋

И я знаю на 100%, что когда я начну изучать что-то новое - я буду очень сильно тормозить и долго ее изучать. Я тупой? Нет. Но до меня долго доходят новые вещи. И ЭТО НОРМАЛЬНО.

Хотите еще пример? Пожалуйста. Кто-то курсы у меня проходит за 4 месяца, кто-то год. При этом придя с примерном одинаковым уровнем знаний. Почему? Причины выше. Это не значит, что надо у себя на груди (или где они у вас еще есть) рвать волосы и говорить "Я ничтожество, которому место только во Вкусно и точка".

Не стремитесь к тому, чтобы в кратчайшие сроки все освоить. Если вы стремитесь стать джуном, значит вы или меняете профессию или просто выбираете свой путь в дальнейшем. К чему-то настолько новому необходимо подойти с умом. Не торопясь. И уж точно не стоит торопиться быстрее выучиться ради денег. Если вы стремитесь сюда попасть ради них - даже не пытайтесь. Долго не продержитесь.

А насколько быстро вы стали джуном? 💪 Или только идете к этому?
🔥30👍64
#frontend_mylife

Пост для поздравления (или может наоборот, для сочувствия 😁😁).

Недавно купил клавиатуру под мак, очередную, недорогую. Понял, что доканала она меня в край: приходится сильно жать на кнопки, чтобы буквы печатались. До этого еще Logitech была, которая померла быстро и еще какая-то, уже не помню.

Решил заказать клаву от Apple. Заплатил, жду. И разместил информацию о состоянии ждуна в инсту (я ж типа блогер, всем же конечно интересно это 😁). По итогу мне реально очень много ребят написали и предложили другие варианты. Но чаще всего хвалили механическую Keychron. В итоге начитавшись отзывов и обзоров решил остановится на одной из моделей (K2).

Из впечатлений: пока непонятно. Нравится, но высокая, надо привыкнуть. Кайфую от звука клавиш (по этой причине давно хотел механику, но то руки не доходили, то денег не было).

Надеюсь, прослужит долго 😊. Можете накидать огоньков, лайков и что вы там еще любите 😀
🔥42🤩2🌚2
#frontend_mylife

До того момента, как не перешел на новую работу, не получал такого огромного количества багов при проверке. И тут есть 2 причины:

1. Насколько я хорошо бы не проверял, все учесть почти невозможно (если мы говорим о более или менее большой задаче).

2. Работал с многими грамотными QA. Но сейчас я вижу просто монстров в хорошем смысле этого слова.

А ведь кроме того, как проходит проверка командой QA и они находят баги как по функционалу, так и по верстке, потом еще финальным этапом проходится Design Review - проверка того, что ты сделал, дизайнерами. На соответствие отступов, шрифтов и т.п. Иногда Design Review проходится дольше, чем функциональные правки)
👍20😁13🔥7
#frontend_mylife

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

Есть такое мнение, что IT-сообщество токсично. На самом деле тут есть доля правда. Многие забывают, какими были 5 лет назад и да, любят потроллить новичков вместо того, чтобы помочь.

Но на самом деле причина в том, что сами новички и довели до этого.

К посту я приложил картинку, которую прислал в чате по Vue один из участников этого чата с вопросом "Как это сделать?". А теперь ответьте, что можно ответить и как помочь? Что человеку нужно? Как сделать верстку? Как подключить карту? Как это разместить в компоненте фреймворка? К сожалению, телепатией люди в чате не обладают.

Еще очень многие любят спрашивать "Как мне это сделать? Я вообще не знаю, напишите мне код". И вот это триггерит сильнее всего, особенно когда не видно того, что человек пытался решить задачу самостоятельно. Хочешь помощи? Покажи, что ты уже пытался реализовать то, о чем спрашиваешь. Покажи свои примеры кода. А не жди, когда за тебя все сделают.

И на самом деле все это идет от того, что:
1. IT мир очень сильно романтизирован. Многие думают, что тут бегают розовые пони и раскидываются деньгами направо и налево.
2. Лень и ощущение того, что тебе должны. Лень решать вопросы самому. "Я попробовал 5 минут, у меня ничего не вышло" - реальный ответ подписчика у меня в инсте после того, как он мне скинул огромную простыню кода со словами "Ну у тебя опыт большой, ты сразу разберешься".

В IT выживают сильнейшие. Которые любят думать и не сваливать ответственность на других. Поэтому когда решите задать свой вопрос в чатах или другим более скиловым разработчикам:
- Убедитесь, что вы сделали все что смогли и у вас реально затык, а не лень разбираться
- Покажите примеры того, как вы пытались решить задачу
- Опишите задачу полностью и сразу, чтобы люди понимали, чем вам помочь

Согласны ли с написанным? Или готовы поспорить или может хочется что-то добавить?
🔥31💯14👍5
#frontend_post

На днях получил фидбэк от лида по одной из задач, в которой были разобраны ошибки. Наверное, лет 5 назад я бы психанул и впал бы депрессию от критики. Сейчас я к такому отношусь спокойно и наоборот рад тому, что получаю фидбэк от очень сильной команды.

Ошибаться в разработке - это нормально! Все разработчики сталкиваются с проблемами и ошибками. Но это не значит, что нужно паниковать. Наоборот, ошибки могут быть полезными, поскольку они помогают вам улучшить свои знания и навыки.

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

Используя свои ошибки, вы улучшаете свои знания, развиваете свои умения.

Многие ошибки - это нормальный элемент учебного процесса.

Суть поста - не бойтесь ошибаться и не пугайтесь критики. Она делает вас сильнее. Если вы будете к ней прислушиваться.
35🔥10👍7
#frontend_mylife

Особо никогда тут не писал про свои курсы. Но, думаю, надо сказать.

1 марта закрываю наборы на оба своих курса «По верстке и JS” и курс «От верстки до Vue”. Кто не знаком с ними - можете посмотреть в инстаграм в актуальных сторис :)

Почему закрываю? Просто решил, что одна и та же программа хоть и заходит до сих пор хорошо и отлично продается, но пора идти дальше. Скорее всего до лета ничего нового не будет. Ближе туда может быть что-то новое и необычное придумаю. Пока сложно сказать, так как ничего креативного в голову не идет)

Кто решит забежать в последний вагон - пишите в личку здесь или в инсте :) Всем остальным - хорошего вечера ❤️❤️❤️
❤‍🔥12👍1
#frontend_vacancy

Всем привет!

Я к вам с интересной вакансией 🙂

Знакомые ребята ищут Senior React разработчика в компанию imot.io (аккредитованная), которая занимается речевой аналитикой.

Сервис с помощью искусственного интеллекта анализирует весь цикл переговоров с клиентом (звонки, переписку, онлайн-конференции) и контролирует коммуникацию сотрудников в отделах продаж и колл-центрах.

Какие будут задачи:
Разработка нового функционала front-end части web-service;
Участие в код ревью;
Участие в обсуждение архитектуры продукта и API;

Какие скиллы нужны:
React на уверенном уровне;
Знание HTML/CSS, адаптивную кроссбраузерную вёрстку;
Опыт фронтенд разработки не менее 5ти лет;
Опыт работы с системами контроля версий (git/gitlab);
Понимание принципов: ООП, DRY, KISS, паттернов;
Опыт Сode Review;
Желания вырасти до позиции - Team Lead;
Желание менторить и помогать команде.

На проекте:
React - 17.0.0, hooks и только, без классовых компонентов;
TypeScript - 4.1.2, стейт менеджмент - redux toolkit, redux thunk, axios;
Компонентные либы: 95% mui, 5% ant design;
Backend на python(используется библиотеки flask, fastapi, celery, tensorflow)
Базы данных: mongodb, clickhouse
Распознавание текста Kaldi/Vosk/Yandex.SpeechKit
API для импорта данных из российских облачные АТС и CRM систем

ЗП до 300 000 рублей.

Если подходишь по требованиям - пиши @tatbokareva 🙂
🔥8👍1
#frontend_templates

Новый крутой макет, для которого составлено небольшое ТЗ. Спасибо подписчице! ❤️

Можете спокойно его брать как пет-проект на фреймворке. Стильный дизайн и интересный функционал 🙂

А если у вас есть идеи развития frontend-skills.com - можете писать в комментариях 🙂
🔥12
#frontend_post

На своем профессиональном пути я работал:
- В веб-студиях и небольших проектах
- В стартапе, который создавался полностью с нуля при мне
- В компании, которая уже стояла на ногах, но при этом решила влить в IT-разработку больше денег для получения дополнительной прибыли

Да, в бигтех я не работал (и не рвусь туда осознанно), но тем не менее опыт немалый есть 🙂

И в данный момент работаю в компании, которая давно является одним из лидеров рынка в своей сфере.

Когда я работал в небольших компаниях, задача проверялась по типу "Не сломалось ничего? Давай в production".

Потом работал там, где есть команда QA и которая научила тщательней проверять свои задачи.

Теперь же работаю там, где в целом довольно длинный процесс выпуска задач, но зато до прода доезжает минимальное количество багов:

1. Сбор данных и детальное описание задачи от PM (Product Manager).

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

3. Непосредственно разработка.

4. Code Review другими разработчиками.

4. Проверка QA. Тестирование задачи в хвост и гриву) Часто вылезают такие кейсы, о которых даже не задумываешься. На этом этапе может подключаться PM для просмотра того, все ли правильно логически работает.

5. Новый для меня опыт - Design Review. Тщательная проверка дизайнерами того, что сделал разработчик. Шрифты, отступы и т.п. Не Pixel Perfect, но если в дизайне line-height: 1.24px, будь добр указать, даже если внешне разницы почти нет. Самый мой первый Design Review я мощно вальнул, так как не ожидал настолько тщательной проверки

6. Сборка релиза. У нас есть свой релиз-менеджер, который собирает релизные ветки и проверяет работоспособность. Даже на этом этапе может что-то вылезти и задача может вернуться для быстрых хотфиксов.

7. Релиз

И даже после таких больших слоев проверки изредка бывает такое, что баги есть. Благодаря тому, что пользователи непредсказуемы и часто творят какую-то дичь 🙂

Вот как-то так) А как ваши задачи проверяют на проектах?)
🔥29👍13
#frontend_mylife

Всем привет!

Немного новостей)

1. Работа приобрела и прислала мне Macbook на M1 Pro 16 дюймов. После моей прошки 13-дюймовой на Intel небо и земля. Сижу, настраиваю (пока недоустановил все что необходимо для работы).

2. Возвращаюсь на Youtube. На следующей неделе хочу продолжить плейлист по разработке UI-Kit на Vue. Скорее всего, будем разрабатывать Select своими руками) Если есть идеи, что хочется посмотреть техническое или с говорящей головой - пишите в комментах. Рассмотрю все варианты, запишу себе в бэклог))

P.S. Досмотрел вчера экранизацию The Last Of Us (самая любимая игра на PS). Немного не хватило экшена, но в целом, наверное, один из лучших фильмов, сделанные по игре.

Как ваши дела? Что нового? Как работа и задачи? :)
🔥21
#frontend_mylife

В последнее время частенько спрашивают, какие курсы глянуть полезные. Сейчас прохожу курс по Docker (тык на ссылку). Прошел половину. Что-то узнал новое, что-то еще узнаю дальше. Но однозначно, наверное, лучшее, что видел на данный момент. Ссылка на Udemy, но без проблем можно найти автора в гугле и купить курс лично у него. Не реклама, но всегда делюсь полезностями :)
👍20
#frontend_post

Небольшой спонтанный пост.

Безумно частая вещь, которую я встречаю - frontend-разработчики не проверяют контент на переполнение 💻

Это бывает и в работе, и когда я вел платный Patreon и проверял там работы, и сейчас я супер часто наблюдаю такое на своих курсах (радует, что студенты сразу исправляются).

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

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

Поэтому на frontend важно проверять блоки на переполнение контентом и убедиться, что все элементы вписываются в свои контейнеры и отображаются корректно. Это можно сделать, например, путем использования CSS свойств, таких как max-width, max-height, overflow и другие, чтобы ограничить размеры и видимость элементов на странице.

А вы проверяете контент? Были забавные случаи из-за того, что не подумали про это? 😊
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥11👍5🤓3
Всем привет!

Для компании, в которой работаю, необходимо сверстать landing page. В целом несложный, но объемный.

Сейчас один, чуть позже примерно такого же объема еще один.

От вас нужен хороший опыт именно верстки. JS будет самый минимум.

Пишите в личку
@alexbelkevich. Я дам ссылку на макет и ссылку на опросник, чтобы не потерять каждый ответ. Исполнителя выберем в течении сегодня-завтра.

P.S. Сразу предупрежу, что дизайнеры очень тщательно смотрят итоговый результат. Не пиксель перфект, но соответствие шрифтов и т.п.

P.P.S. Пока пост висит - смело пишите :)


Всем спасибо! Очень многие откликнулись, есть из кого выбрать ❤️
🔥16
#frontend_mylife

Интересная история. Написал мне менеджер Яндекс.Дзена с предложением создать блог на данной площадке в обмен на разные плюшки (типа помощи продвижения).

Меня максимально не радует в последнее время Isntagram и полнейшее отвращение к ВК (в плане удобства). Поэтому решил, почему бы не попробовать. По словам менеджера - они сейчас хотят развивать направление IT-блогов. Поэтому почему бы и да. Что я теряю?

Поэтому кто читает Дзен (уверен, таких не много и я сам раньше сюда заходил раз в год) - залетайте по ссылке. Кто знает, может Дзен и взлетит рано или поздно. А сейчас это просто еще один способ продвижения :)
👍16🔥7🤡5