Frontend
September 9, 2020
Материалы для изучения
В этой статье собраны полезные ресурсы, а так же библиотека для веб-разработки
Статья будет дополняться по ходу времени
Базовые вещи
- https://html5book.ru/
- https://learn.javascript.ru/
- https://developer.mozilla.org/
- https://www.w3schools.com/
- https://metanit.com/
Mobile first
- https://medium.com/@mrmrs_/mobile-first-css-48bc4cc3f60f
- https://teletype.in/@vellnes/css-mobile-first
Адаптивные изображения
- https://developer.mozilla.org/ru/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images
- https://css-tricks.com/a-guide-to-the-responsive-images-syntax-in-html/
- https://css-tricks.com/responsive-images-css/
БЭМ
Препроцессоры
Вебпак
ID для интерактивных элементов и кнопок
Block + Flex + Grid
- https://css-tricks.com/snippets/css/a-guide-to-flexbox/ (оригинал)
- https://habr.com/ru/post/467049/ (перевод)
- https://habr.com/ru/company/digital-ecosystems/blog/321244/
- https://css-tricks.com/snippets/css/complete-guide-grid/
- https://developer.mozilla.org/ru/docs/Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout
- https://medium.com/@stasonmars/%D0%B2%D0%B5%CC%88%D1%80%D1%81%D1%82%D0%BA%D0%B0-%D0%BD%D0%B0-grid-%D0%B2-css-%D0%BF%D0%BE%D0%BB%D0%BD%D0%BE%D0%B5-%D1%80%D1%83%D0%BA%D0%BE%D0%B2%D0%BE%D0%B4%D1%81%D1%82%D0%B2%D0%BE-%D0%B8-%D1%81%D0%BF%D1%80%D0%B0%D0%B2%D0%BE%D1%87%D0%BD%D0%B8%D0%BA-220508316f8b
- https://ishadeed.com/article/website-headers-flexbox/
Custom elements
Image optimization
Font converter
Производительность
Page test
- https://www.webpagetest.org/
- https://developers.google.com/speed/pagespeed/insights
- https://gtmetrix.com/
- https://yellowlab.tools/