Блог

Эффективность: как работать и учиться

Сохрани, учи, записывай — только в этом порядке. Сегодня я хочу рассказать о моем процессе учебы и работы. Учеба и работа связаны, потому что в мире программирования, чтоб работать хорошо, надо учиться хорошо и учиться много.

Эффективный способ хранить закладки

Раньше: закидывал кучу закладок в панель
Сейчас: храню только нужное, убираю имена у ссылок

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

Закладки в моем браузере
Закладки в моем браузере

Хоть я и не переполняю панель, я храню закладки без имен — оставляю только иконки. Еще одно доказательство пользы иконок. Главный принцип расположения закладок: соц. сети и новостные сайты, инструменты, материала для изучения.

Социальные сети и новостные сайты

Моя основная соц. сеть — Твиттер. Еще я использую популярный у меня ВК, но редко. Твиттер я открываю больше десяти раз за день, поэтому Твиттер среди закладок, ВК — нет.

Новости я получаю из Дев, Хакерньюз и Реддита, но использую их не так часто, потому что полезный контент часто дублируется в Твиттере официальными аккаунтами или юзерами.

Инструменты

В фронтенде надо использовать много веб инструментов: цветовую палитру, форматтеры кода, сайты для администраторов и документации, — но многие из них нужны только на старте проекта или при его поддержке, поэтому они не на панели закладок. Сохраняю только хранилище, как Гугл Драйв, Гугл Кип и Гитхаб.

Я использую Гугл Кип как тудушник для проектов, потому что мне надо создать доску для проекта, записать туда задачи и отсортировать все. Для сортировки я использую эмоджи.

Материал для изучения

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

Пример: недавно я учил Реакт и в закладках у меня была документация и несколько дополнительных ссылок. После я решил повторить ООП в Джаваскрипте и добавил один курс и статью об ООП в ЕS6.

Необычное место для ссылок

Раньше: хранил ссылки в Pocket или не хранил нигде и терял
Сейчас: распределяю ссылки в Телеграме по каналам

Хоть ссылки и сокращены, я люблю минимализм и много закладок не создаю. Поэтому мне нужно другое место для полезных ссылок и материала «на потом». Для этих целея я использую Телеграм. Он хорошо как мессенджер, но и хорош как облачное хранилище. В Телеграме у меня два канала: Inbox и Links.

Inbox

В этом канале я храню разные материалы, которые я хочу прочитать или выучить скоро. Этот список часто пополняется и не так часто очищается.

Кэширование. Большинство сайтов со статьями сейчас поддерживают Инстант Вью — технологию Телеграма, которая позволяет открывать статьи в своем интерфейсе моментально и изменять режим чтения. Эта функция автоматически кэширует все ссылки, даже если я сохранил их с ноутбука и не открывал на телефоне.

Links

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

Как не забыть, что ты выучил вчера

Раньше: ничего не записывал и забывал — приходилось перечитывать
Сейчас: все записываю и ничего не забываю

Мне надо постоянно пополнять свои знания новым материалом, выкидывать ненужные знания и повторять нужные.

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

@dtroode: Yesterday started learning @sveltejs. Writing all to markdown file. All text is written by me, code from examples. You can see the bold and italic text (red on the left): this is my own thoughts for better memorization

Для каждого нового материала: язык, Фреймворк, технология — я создаю новую папку; в ней находится папка с примерами кода и файл learn.md для записи. Все файлы храню в Маркдауне, потому что удобно смотреть превью в ВС Коде, и регулярно бекаплю.

Заключение

Моя коллекция нуждается в новых ссылках, отправляйте мне в Твиттер или в Телеграм

Почему надо дать Файерфоксу шанс

Используешь Хром? У меня плохие новости для тебя. В эру браузерной монополии мы должны оглядываться на другие браузеры, давайте сделаем это.

Ситуация

Гугл оккупировал весь веб Хромом. У него больше половины всех юзеров.

Инфографика популярности браузеров на всех платформах
Инфографика популярности браузеров на всех платформах

Сафари на втором месте только из-за популярности АйОС и МакОС.

Обновление Файерфокса

Сейчас большинство разработчиков выбирают между Хромом и Файерфоксом. В 2017 году Мозилла выпустила обновленную версию своего браузера — Файерфокс Квантум с новыми настройками внешнего вида, улучшенной поддержкой расширений, приватностью и, что самое главное, скоростью. В два раза быстрее, чем старый Файерфокс и быстрее, чем Хром.

Сравнение скорости Файерфокса Квантум и старого Файерфокса
Сравнение скорости Файерфокса Квантум и старого Файерфокса

Файерфокс ипсользует собственный движок с новым Квантум ЦСС и Квантум DOM рендерингом. Много объяснений в блоге Мозиллы. Хром использует больше оперативной памяти, чем Файерфокс. Также, Файерфокс имеет много полезных фишек, как отображение ненужных ЦСС правил и поддержка prefers-color-scheme: dark медиа правил, которые у Хрома только в бете.

Демонстрация темного режима в новом Файерфоксе
Демонстрация темного режима в новом Файерфоксе

Боитесь насчет расширений? Сейчас большинство разработчиков пишут расширения для одинаково Хрома и Файерфокса.

Последняя причина — антимонополия. Надо давать шанс другим компаниям, которые меньше и тогда станет заметно, как развивается фронтенд. Перенесите все свои закладки в Файферфокс на неделю и попробуйте его.

Разработчик? Замени это сейчас

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

ВС Код — редактор, который я теперь использую
ВС Код — редактор, который я теперь использую

Список инструментов, которые я больше не использую, и чем я их заменил:

  1. Atom → Sublime Text → VS Code. Я начал кодить с Codecademy (они первые в гугле). Мой первый HTML код я скопировал в Atom и сохранил на компьютер. Я выбрал его, потому что давно, когда искал текстовый редактор, натыкался на Атом и в описании у него было что-то связанное с кодом. Потом я перешел на Sublime Text и он был хорош. Я написал в нем много вышедших и не вышедших сайтов. Потом я услышал о VS Code — он был для меня слишком сложным после Sublime, но я полностью перешел.
  2. Beautify → Prettier. Форматировать код вручную очень тяжело, поэтому я решил автоматизировать этот процесс. Сперва использовал расширение Beautify, но потом перешел на Prettier с его конфигурационными файлами.
  3. Стандартный моноширинный шрифт → Fira Code. Шрифт даже для разработчика очень важен. Раньше я не обращал на это внимания и однажды я увидел в твиттере один интересный шрифт с новой функцией для меня — лигатурами. Это был Fira Code. Сейчас он очень популярен.
  4. jQuery → чистый JS. Я начал писать на JavaScript с туториала по jQuery на ютубе. Там говорилось, что jQuery чище, меньше, легче и позволяет решать задачи в несколько строк, которые в JavaScript пишутся в 200. Но после я понял, что у чистого JS больше поддержки, он чище, легче и занимает меньше места со стандартной поддержкой браузера.
  5. CSS → SASS. Просто нравится синтаксис родитель { ребенок {} }.
  6. Jekyll → Gatsby. Gatsby более прогрессивен и имеет много оптимизация из коробки.
  7. Lighthouse → PageSpeed Insights. Просто более стабильно.

Статья будет дополняться вечно.

Хочешь сделать лучшее АйОС приложение? Делай как они

Если твое приложение в этом списке, то время праздновать! Если нет — читай статью и делай, как эти разработчики.

Лучшие приложения

В АйОС 11 Эппл наконец выпустили новую дизайн систему, которую они до этого тестировали в Эппл Музыке. Я говорю про новые стандарты дизайна приложений с большими заголовками. Очень много людей, которые хейтят такой дизайн, но мне он очень нравится. Это заслуга хорошей типографики — шрифт Сан Франциско крут.

Memento, PDF Viewer и WhatsApp
Memento, PDF Viewer и WhatsApp

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

Memento

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

Procreate

Procreate — приложение для креаторов (уау). У них есть и карманная версия для Айфона и обе версии соответствуют дизайн гайдлайнам. Я не использую это приложение, но я видел скриншоты, видео и много хороший отзывов — просто подпишитесь на них в Твиттере

PDF Viewer

Очень хорошее приложение от команды ПСПДФКит. Использую почти каждый день, потому что в школе удобнее открывать ПДФки, вместо таскания учебников. Я нашел это приложение у Федерико Витичи в Твиттере. У него очень много функций, возможно, даже больше, чем во многих десктопных приложениях, и есть кастомные темы. Есть платная версия, но мне и бесплатной достаточно. Также поддерживаются вкладки.

WhatsApp

Я не люблю Вотсап, потому что есть Телеграм, но они поддерживают этот дизайн, поэтому я не могу не упомянуть их тут.

Также много других приложений, как Scriptable — пожалуйста, почини поисковое меню, — Jayson, Pretext и много других, которые я не использую, как Timery и MindNode.

Если вы можете предложить еще, то напишите мне в Телеграм или Твиттер

Как и чем я занимаюсь

Сперва, кто я — уже полтора года начинающий веб-разработчик, пишу на HTML, CSS, JS, учу React.

Технический сетап

Я использую Dell Inspiron 13 с 256 ГБ SSD, 8 ГБ RAM и Intel Core i5. Да, я не тот крутой пользователь Мака, который приходит домой, открывает свой ноутбук одним пальцем, использует эксклюзивный платный софт и потом твитит красивые скриншоты программ с тенями.

Софтверный сетап

Я установил на ноутбук две системы — Windows 10 и Ubuntu — всегда последние версии. Windows занимает 200 ГБ, остальное место под Ubuntu. Потому что мне нравится Unix, но Linux пока что не такая независимая система.

Мой рабочий стол
Мой рабочий стол

Программы

Настало время самого интересного. Давайте посмотрим на весь путь создания сайта:

  1. Сперва надо задизайнить. Для этих целей я использую две программы Affinity Photo и Figma. Чаще вторую. Я не люблю софт от Adobe.
  2. Дальше надо написать то, что нарисовал. Я не использую IDE — вместо этого есть Visual Studio Code — мощная и красивая замена. VS Code — что-то между текстовым редактором и IDE. Если мне надо быстро записать несколько строк, то я открываю его младшего брата — Sublime Text. Он самый быстрый редакатор и выглядит хорошо.
  3. Часто мне надо спланировать работу. Для этого я использую Notion и Google Keep. Notion — для текстов, Keep — для списка задач.

Остальные инструменты:
а) терминал — встроенный в VS Code,
б) браузеры — Chrome и Firefox.

На этом все. Надеюсь, вы нашли что-нибудь интересное здесь.

Мои мысли о мартовском ивенте Эппл

Результаты мартовского ивента Эппл. Подписки!

Больше плюсов

Выход Тима Кука
Выход Тима Кука

First things first. Плюсы.

Мне понравилась презентация, но не понравились новые продукты. Журналы по подписке? До России это не скоро дойдет. Игры по подписке вообще сомнительная вещь, хоть я и слышу, что многие ждут и активно высказываются об этом в Твиттере. Вот эксклюзивное кино — это круто, но тоже под сомнением в России.

Видео с презентации, как обычно, крутые. И Динеш из Кремниевой Долины.

Пойду смотреть лэндинги — часто нахожу там ошибки и просто через девтулз исправляю +

ПозднееВсе заметки