MariJoy

На прошлой неделе приболела, процесс обучения немного пострадал, собственно из сделанного только практическое задание. И пока это задание лидирует в моем топе неприятного.

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

Пришлось тренироваться изменять коммиты. С git у меня отношения не очень, но кажется я начинаю его любить. Не то чтобы я окончательно поняла концепцию веток и куда отрывается detached HEAD, но прогресс явно наметился.
Было волнительно в первый раз применять rebase -i на практике, но блин, какой же он балдежный, я прям в восторге) Можно вернуться в любую точку и сделать там практически что угодно, можно изменить коммит, слить его с другим, но особенно полезно для меня оказалась возможность "разбить" его на несколько.
Руководствовалась вот этим https://git-scm.com/docs/git-rebase#_splitting_commits , добавить туда git stash можно из финального вида нарезать целую предысторию. Локально работать очень удобно, для командной работы наверное не очень тк коммиты переписываются.
По пути потрогала свои первые конфликты.

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

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

По статистике просела, буду нагонять:
времени на обучение потрачено: 17 часов
место в рейте: 255

Посмотрев на дэдлайны выданных на прошлой неделе задач (до 14 января), я немного расслабилась. По вечерам не спеша решала задачки плюс дочитала материалы по css.

Начала с задач на массивы. Они шли с ограничением не использовать циклы, основной упор на методы массивов. Из нового, что осело:
-Array.from() - довольно удобная штука, с помощью которой можно на месте создать массив и сразу для каждого элемента применить функцию.
-Пустые слоты в массиве - это не undefined, многие методы их игнорируют, и для применения нужно сначала "наполнить" слоты.
-Многие мутирующие методы имеют не мутирующих близнецов, запомнить легко, тк к названиям просто добавлено to, toSorted() например. При решении задач, на мутирование не оглядывалась, но в голове держать полезно.
-Reduce, мой не любимый и мною избегаемый, оказался не таким страшным, после того как я поняла что аккумулятор, по сути это то, что функция возвращает при каждой итерации. Сначала еще забывала передавать начальное значение. Его наверное можно и не передавать если оно совпадает с первым элементом массива, но когда прописывается получается понагляднее.

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

По css у меня оставались статьи про новые функции, из интересного:
-Сss модули, как я поняла главный бенефис модулей - это локальная область видимости + возможности composes, что-то типа extends с sass.
-Сontainer queries позволяет менять элементы в зависимости от родительского контейнера. Играть от размеров контейнера для адаптивного дизайна звучит как что-то очень полезное. Поддержка у браузеров вроде довольно хорошая) помимо размеров можно будет еще привязываться к стилям родителя.
- Popover + Anchor похоже будет хорошая связка, довольно легкая в использовании, нашла статейку на тему ссыль

Статистика:
времени на обучение потрачено: 18 часов
место в рейте: 189

Неделя выдалась спокойной, по плану занятий нужно было перепроверить задеплоеную верстку у 4 студентов, изучить медиа запросы и сделать респонсив под мобильные устройства.

Через медиа запросы, оказывается, можно не только подогнать макет к разным размерам экранов и ориентации. Но еще, например, настроить разные размеры для кликабельных областей в зависимости от указателя. Или убрать ховер эффекты, там где в принципе нет ховера.
Из того, что я еще представляю как можно использовать: это тип print, для настройки печатного вида. И настройки prefers-color-scheme. Остальное пока не представляю в каких ситуациях можно применить на практике.

С подгонкой под мобильные справилась довольно быстро.
В свободное время:
-поковырялась с svg для иконок. Сделала свой первый спрайт через symbol. Html после этого сдал выглядеть получше) Долго не могла понять, почему не применяется currentColor, потом только вычитала что информация кэшируется.
-почитала про относительные единицы измерения, применила rem к шрифтам в макете. На макете крайним размером под мобильные было 380, так что я до 320 решила попробовать сделать шрифты "флюидными" через calc(). Формулу брала здесь https://css-tricks.com/snippets/css/fluid-typography/ , сайт вообще кладезь всякого интересного. До конца не разобралась почему в одних случаях calc нормально принимает разные значения типа vw и px, в других нет, ну и как работает миксин из примера тоже не поняла. Но задуманное сделала. Надо теперь к остальные делали с макета тоже местами сделать относительными, а то смотрится не пропорционально.
-пообщалась с другими студентами, кому-то немного помогла. Чужой код - интересно и не сразу понятно, но когда получается найти в нем проблемное место - это прям буст к настроению. Попадаются хорошие решения, например, очень понравилось как выглядела работа sass с неймингом по БЭМ. На досуге тоже надо будет посмотреть.
-добила часть оставшихся тестов.

Результат работы тык
На этой неделе будет работа c функционалом.

Статистика:
времени на обучение потрачено: 31 час
место в рейте: 293

Итак, прошла неделя, сегодня понедельник, настало время подвести итоги. Программа на недели включала в себя основы HTML, CSS и JS. Со всем этим я так или иначе уже сталкивалась, с js конечно побольше, с версткой я обращаться умею плохо, нет даже так, очень плохо.

По HTML проходились по основным тегам, семантике. Тут, пожалуй, главный вывод, что не нужно все строить на div, инпутов есть куча разных видов и + полезных атрибутов. Оказалось для разметки есть валидатор, на следующей уже опробую в деле. Возможно я его возненавижу.

CSS. Тоже общая информация. Селекторы, специфичность, основные свойства для шрифтов, позиционирования и тд. Все очень поверхностно, на сколько я поняла на следующей неделе будет более детальное погружение. Дополнительно поковырялась со специфичностью, узнала что ее можно представить в виде  0-0-0-0,
inline с более высокой специфичностью 1-0-0-0
id 0-1-0-0
class, атрибуты и псевдоклассы 0-0-1-0
теги и псевдоэлементы 0-0-0-1
*(универсальный) – низший приоритет
!important – высший
есть еще такая штука как layer в css, пометила себе почитать на досуге

JS. Повторила про типы, преобразования типов, операторы, циклы, всплытие и области видимости. Основное время досталось типам. Их всего 8, 7 из них примитивы. Интересно, все примитивы кроме null и undefined имеют свои обвертки object wrapper, которые позволяют вызывать методы, для null и undefined вызов метода будет выкидывать ошибку. Еще интересно на сколько mdn отличается в русифицированной версии и в английской). typeof null будет выдавать object, тот же результат будет если проверить примитив созданный с помощью конструктора new.

К проходимым топикам прошла 4 теста, баллы от 88 до 95. Самый низкий за html:) Времени тесты отжирают неплохо, текст на английском, местами с подвохом приходилось напрягаться.

Было также два практических занятия, на строки и на числа
Cтроки было легко и скучновато. Что бы я хотела рассмотреть детальнее так это – регулярные выражения, это просто фантастические возможности, но пока это выглядит для меня как клинопись, понимаю только диапазоны типа [0-9] [a-c] и флажки /g и /i
Числа и объект Math. Вот здесь мне было уже гораздо тяжелей, пришлось вспоминать математику, которую я проходила в школе практически мимо. Если теорему Пифагора я вспомнила довольно быстро (Анна Николаевна, спасибо за то, что смогли мне вдолбить хоть что-то) Нахождение угла между двумя векторами и задачку с числами фибоначи я делала долго, и фиг повторю без формулы перед глазами) К задачкам были приложены ссылки на вики, но че-то мне это нифига дела не ускорило. Вторая часть задания тоже была скучновата.
В целом решением задач не удовлетворена, можно сработать лучше, но со временем я не подрасчитала, доделывала все в воскресенье. Казалось бы проходимые топики вижу не в первый раз, но все равно что-то не помнила, что-то не видела, думала справлюсь побыстрей) Практическая часть залита на репозиторий https://github.com/IlinJoy, но туда лучше идти с седативным)

Остался еще топик с JS Scope & Functions с замыканиями, декораторами, this и тд. И еще один с функциями добавлеными ES2015, дедлайн до декабря, думаю успею.
На следующей неделе углубление в css и препроцессор sass, о котором я ни сном не духом, 4 теста и верстка двух страниц офигенно красивого макета. Вот этого я немного побаиваюсь.

И в заключение немного статистики:
место в рейте: 239, из 3к участников больше половины не активны, как мне кажется

времени на обучение потрачено: 24 часа
Ушла учиться, вернусь с отчетом в понедельник

Звучит как что-то маловероятное, но попробовать стоит. Решила начать вести публичные отчеты об обучении. Я здесь в основном за тем чтобы страдать графоманией и спрашивать о том как продолжать и что еще можно почитать)

И так дано: графический дизайнер на фрилансе, образование гуманитарное, с двумя корочками (преподаватель изо и комп. графика).
Начала самостоятельно, быстро поняла, что хватаю информацию отовсюду и поверхностно, и нашла очень ламповый курс, где нас на потоке было всего 50. Все пошло гораздо веселей, с видосов на ютюбе, переключилась на чтение. Курс состоял в основном из ссылок на статьи или ресурсы типа Learn.JS, все организованно от простого к сложному + закрепляющие задания. В какой-то момент у меня начали случаться накладки с основной работой и все полетело к чертям. Если раньше я размеренно шла с группой, не отставая больше чем на пару дней, то теперь разрывы были в полмесяца/месяц, которые я нагоняла как можно быстрей как только появлялась минутка, два месяца в режиме 12 часов за компом и я сдулась. Люди, которые учатся так по полгода и больше - супергерои. Я пару месяцев в итоге и не работала и и не училась, обходила комп по дуге. Продолжать после того как курс закончился оказалось грустновато, уже не хватало компании, да и позабылось все, и вот я решила начать сначала)
Во второй заход думала начать с новым потоком, но попался другой вариант, система схожа, привет ссылки, привет чтение)) привет соревнование, на курсе >3к студентов и есть таблица рейтинга с очками. Первый этап учишься самостоятельно, есть автотесты с дэдлайнами. Курс на английском, так что заодно прокачаюсь в нем. На втором этапе самых лучших разберут менторы)
Планирую публиковать отчеты раз в неделю, с выжимкой из того, что пройдено, плюс номер места в рейте, может еще буду записывать кол-во затраченных часов. Рекомендованное время на курсе 20-40 часов в неделю, не работать не вариант, так что буду еще экспериментировать с процессом обучения и тайм менеджментом.