Ура, одобрили сообщество на твиче. Как говорится если стримите разработку, пишите, добавим)

крутой сайт для обучения основам https://doka.guide/

Кстати нас уже 500 человек 🥳🥳

Как сказал какой-то умный хуй, покажи своих 10 друзей и я скажу кто-ты. У меня не было такого количества друзей и я создал дискорд, теперь это реально самая действенная штука и единственный способ прокачать себя, никакие видосы и книжки не дадут тебе того, что может дать другой человек. Ты грубо говоря становишься его копией, а ребята в нашем дискорде очень сильные сидят. Я очень благодарен им!
Вот ссылка кста
https://discord.gg/Y7AzrfHt

Наш боец со стрима, под ником smiface замутил сайт с обучалкой (будет обновляться) https://smiface.herokuapp.com/

Ребята, я к вам с очередной годнотой. Есть один бесплатный сайт, там есть обучалки на почти все языки, как говорится спасибо людям на твиче, которые мне скинули его.
Как ваши дела кстати?
https://metanit.com/web/
p.s. если учите веб, прошу вас, даже не смотрите что такое jquery и бутстрап. На старте обучения погружаться в легаси - плохая практика

Рубрика хороший паттерн. Мне скинул знакомый верстальщик, как у него на проекте. Дока мне понравилась, думаю новичкам, да и мне будет интересно ознакомиться. Чтобы информация усваивалась буду выкладывать по одной теме в день. (Мне просто лень всё сделать сразу)
Тема номер раз, надеюсь все успели уже пощупать, что такое scss ? Если нет, вперед, вам нужно загуглить только две вещи (что такое миксины, что такое спрайты)
Итак, если с названиями js, mixins, sprites всё понятно, что же такое vendor.
Папка src/js/vendor предназначена для хранения скриптов сторонних библиотек, которых нет в репозитории npm.
Файл src/scss/main.scss предназначен для хранения основных стилей сайта. При сборке данный файл преобразуется в CSS и сохраняется в build/css вместе с файлом main.css.map.
Папка src/resources предназначена для хранения различных файлов проекта. При сборке файлы из данной папки попадают в build.
Папка src/resources/fonts предназначена для хранения шрифтов. При сборке файлы из данной папки попадают в build/fonts

Pixel-perfect — техника верстки, при которой результат максимально совпадает с исходным макетом. (которую я игнорирую, сверстать примерно как грится на глаз 😎)

Под этим понимается соответствие:

положения элементов;
размеров;
отступов;
цветов;
шрифтов;
размеров текста;
межстрочного и межбуквенного интервалов.
Что не входит в pixel-perfect:

Аболютное соответствие макету.

Несмотря на свое название, техника pixel-perfect не подразумевает стопроцентного совпадения с макетом. Различия могут быть и будут.

Дизайнер при создании макета может сделать что-то «на глаз» или просто ошибиться: сбиться с сетки, выровнять слой немного не по центру, использовать не тот шрифт или размер текста, подобрать цвет не по палитре и так далее.

Не нужно повторять того же в верстке:

Если положение элемента отклоняется от сетки или других подобных элементов, то его следует выровнять.
Если элемент почти по центру, то вероятно он должен быть строго по центру.
Если есть подозрение, что в каком-то месте макета сбился шрифт, то скорее всего он действительно сбился, и вместо него должен использоваться другой.
Если несколько цветов, используемых в макете, незначительно отличаются HEX-кодом и неотличимы на глаз, то вероятно это должен быть один цвет.
Инструменты для работы с pixel-perfect:
Одним из лучших инструментов для pixel-perfect верстки является плагин PerfectPixel. (в гугл хром).

👆 От себя, старайтесь отойти от привычки "двигать все элементы маржинами", для размеров часто нужно использовать проценты + padding

Если не было опыта, ставим галочку только изи!
Сайт который научит вас программировать
Выбираете количество недель, и сколько времени готовы уделить, и идёте по этому плану
https://www.techinterviewhandbook.org/grind75

А я опять с новостями. После казино буду делать сайт для знакомого с Латвии по солнечным батареям и наверное потихоньку можно будет учить вопоосы к собесам. 😋

Полезная стать из официальной доки, советую прочитать, нашёл для себя много полезного :)
https://developer.mozilla.org/ru/docs/Learn/Common_questions/Design_for_all_types_of_users

Представляю вашему вниманию, новый актальный reset css
https://github.com/elad2412/the-new-css-reset/blob/main/css/reset.css

Отличная почти актуальная шпаргалочка по js https://frontend-stuff.com/blog/javascript-cheatsheet/

Знакомый сделал сайт для подготовки к собеседованиям на фронт разраба
Проверяйте, оценивайте :)
https://interviewmasters.ru/

Серия книг you dont know js https://github.com/azat-io/you-dont-know-js-ru

Очередной годный сайт с алгоритмами
https://neetcode.io/

Самый топ способ изучить redux - начать просмотр видосиков от улби:
Смотрим первые 5 видосов, пробуем сами на практике периодически подсматривая, если что-то не получается. После того как пощупали "голый redux", переходим к RTK (redux-toolkit) Советую начать без ts, обосрался в первый раз достаточно с типизацией. После rtk, накатываем ts и внедряем Redux где только можем.
Основная концепция "сторов" не использовать где они не нужны (там где маленькая вложенность, пропускаем эту концепцию и задрачиваем новую технологию.
После всего этого, когда появляется больше времени, открываем доку и читаем особенности библиотеки!
P.S. Данный подход к обучению не претендует на уникальность, просто мне было максимально легко. Справился с голым redux без особых проблем.
https://www.youtube.com/watch?v=5Qtqzeh5FeM&list=PL6DxKON1uLOHsBCJ_vVuvRsW84VnqmPp6&index=1

Прекрасный курс по некст js на 18 часов
https://www.youtube.com/watch?v=6fNy0iD3hsk