DНЕВНИК web-программиста
2.58K subscribers
214 photos
14 files
560 links
Авторский канал о том, как стать программистом, когда вы даже не знаете, что это.
Много интересного и для других сфер - планирование, самоконтроль, различные лайфхаки и т.д.
Задачи @tasks_frontend
Обратная связь @WpdFeedbackBot
Сотрудничество @rezvanini
Download Telegram
23 сентября 2020 — 2 октября 2020 пройдёт онлайн конференция по всему миру - Frontend Live, посвященная всем аспектам разработки клиентской части веб проектов.

Мероприятие платное, но 25-26 сентября бесплатные дни. Чтобы посмотреть трансляцию, достаточно зарегаться тут

Расписание - https://bit.ly/2ZGOejA
Всем привет!

Не знаю как у других, но у меня с вёрсткой не всегда все гладко и часто приходится гуглить проблемы. И дело не в сложности, а просто в отсутствии обширной практики. А в наше время CSS совсем не простая штука, очень много всевозможных нюансов, о которых нужно знать.

Одна из проблем, с которой сталкивался - вертикальное выравнивание текста.
Вот небольшой материал на эту тему

#css
Всем привет! 🖖

Каждый раз, когда я начинаю новый проект, сталкиваюсь с муками выбора структуры CSS.
Насколько я знаю, у многих так.
Чаще всего я пользуюсь SCSS и применяю паттерн, о котором я писал 7-1.
Иногда это гибридные варианты, когда в Реакт использую модули.
Сейчас текущий проект так организован - размещение файлов стилей у каждого компонента(не модули), но подключение в едином файле по паттерну 7-1.
Да, можно приводить доводы, что вот этом проекте вот так оптимальнее, а в этом вот эдак. Но суть в том, что бы не только вы это понимали. Поэтому лично я предпочитаю общепринятые методики, в команде и для дальнейшей поддержки проекта это гораздо важнее.
Сегодня прочел ещё один интересный вариант, думаю попробую в следующий раз.
А как вы структурирует CSS? Поделитесь в чате

ЗЫ Если кто не читал про паттерн 7-1

#css
Всем привет!

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

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

Да, это быстро освоится, рука набьется и чаще и чаще у вас все на автоматизме будет. Но я пришел к выводу - что так и нужно начинать работу в IT. Да как и в любом деле - от простого к сложному.
Поэтому, старайтесь найти первую работу по силам и она будет приносить вам удовольствие и быстрый рост!
Не распыляйтесь на весь веб, это не возможно. Выбирайте нужный стек и становитесь профессионалами.
Всем удачи 🖖
Руководство по абсолютным и относительным величинам в CSS.

👉 http://css.yoksel.ru/size-units/

#css
Всем привет!

Наткнулся на интересный репозиторий - 30 second of code

Более сотни коротких кусочков кода. Залипнуть можно на долго, многое может пригодиться для решения ваших задач.
Рекомендую 👍

#js
Немного юмора от коллеги по работе 🤣

#юмор
Всем привет!

Последнее время постоянно в требованиях стоит создание кастомных полос прокрутки.
Если вы ещё не делали, попробуйте - я уже не представляю скролл без них.
Простая инструкция - создаём полосу прокрутки на CSS

#css
​​Всем привет!

Недавно в чате было обсуждение - как организовывать статус пользователей. И если по статусам, получаемым от сервера(например, online, offline) все ясно, то как организовать статусы, которые только на клиенте можно отследить? Например, afk, idle и тп

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

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

В жизни решил эту проблему так же, но гораздо проще))) Коллега подсказал просто супер билиотеку - React Idle Timer. Простая в использовании, но очень мощная. Да, она для React, но уверен, что есть аналоги и для других фреймворков + можно посмотреть исходники))))
Хорошая, документация, примеры, TypeScript - короче, рекомендую!
зы страничка на github

ззы Прикреплю скрин - на Хуках весь код вышел в несколько строк! В документации в примерах все есть

#react
Всем привет!

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

ps В РФ через vpn доступен сайт

#book
Всем привет!

Сейчас на работе потребовалось освоить SSG - генератор создания статических сайтов. Т.к. я использую React, то выбор пал на Gatsby - модная штука, особо часто сейчас используют, при переводе сайтов в wordpress на React.
Кратко: Gatsby позволяет отвязать сайт от БД. Сайт становится статичным и быстро грузится (Реакт в чистый HTML) и появляется возможность хостиинга на халявные сайты, где нет поддержки БД.
На практике пока могу одно сказать - нужно знать graphQl (хотя и без него можно, но с ним вся фишка) и немного напрягают другие мелочи, возможно, я просто не разобрался еще.

Кстати, сегодня утром прочел статью, где автор как раз сравнивает ssg решения - Почему я выбрал Next.js, а не Gatsby, Gridsome или Nuxt?

#ssr #react #gatsby #next
Если кто использует React+Redux, но ещё не пробовал хуки именно Redux - вот прям настоятельно рекомендую!
ЗЫ Вот не плохая статья на этот счёт.

#react #redux