Дмитрий Лаврик | Продвинутая вёрстка по сетке smartgrid (2017) PCRec

Дмитрий Лаврик | Продвинутая вёрстка по сетке smartgrid (2017) PCRec

---

Автор (режиссер): Дмитрий Лаврик
Жанр: Вёрстка, HTML/CSS, flex-box

Описание:
Бесит адаптивная вёрстка? Или мучаешься с bootstrap? Тебе помогут:
#css3 #calc #less #scss #npm #gulp #autoprefixer #новая супер сетка

Этот курс для тех, кто:
- Владеет основами вёрстки, в том числе, адаптивной
- Периодически бесится при создании адаптивной вёрстки
- Хочет освоить крутейший инструмент и стать мастером

Продолжительность: 14:03:56
Качество видео: PCRec

Видео: AVC/H.264, 1680-1280x1048-720, ~484-497 kbps
Аудио: AAC, 2 ch, 128~158 kbps Скриншоты:


Время раздачи: 24/7 (круглосуточно) (до появления первых 3-5 скачавших)

Если вам нравится раздача, не забудьте нажать

Раздача в формате "как есть". Это значит, что материалы раздаются в том виде, в котором были получены релизером.
Просьбы что-то заменить/докачать/перекачать и добавить в раздачу будут проигнорированы.

Материалы предоставлены пользователем, который пожелал остаться анонимным. Все благодарности за предоставление материала вы можете выразить в комметнариях (думаю, он это прочтёт).
Если хотите поблагодарить меня за подготовку релиза, то нажмите .

Налетай!

Большущее спасибо!

Есть кто использовал Susy и этот smartgrid? Какая разница между ними?

УРААА!!! спасибо за слив )))

верстал пару проектов на смарт гриде, инструмент отличный и гибкий

вся сетка на флексах. ну и какая тут кроссбраузерность

Добавлено спустя 16 минут 5 секунд:

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

спасибо..посмотрю для интереса !

church30 писал(а):

вся сетка на флексах. ну и какая тут кроссбраузерность Добавлено спустя 16 минут 5 секунд: сколько смотрю этого лаврикова, каждый раз одно и тоже. половину основ не раскрывает, чтобы никогда не было полного понимания, оставшуюся половину жует по полчаса, что можно сказать за 5 минут. темы чуть сложнее вообще не затрагивает, зазывая тем самым на более расширенный курс. А темы нормальной сложности применимые на практике не знает в принципе, из-за своей низкой квалификации.

зачем ты вводишь людей в заблуждение?

во первых: "сетка на флексах" - это вранье, в смарт гриде есть фолбэки на флоат. например примесь .row-float(), так что если ты не разобрался, не нужно вводить людей в заблуждение.

во вторых: кроссбраузерность, идем на caniuse и смотрим:
flex
calc

как видим, всё зеленое, плохая поддержка лишь у старых IE браузеров, под которые уже никто толком не верстает, допустим заказчики уже не просят поддержку старых браузеров (IE9-10) а если лично вы верстаете под такие старые браузеры, которые официально майкрософт прекратили поддерживать, то я советую вам научиться убеждать заказчика, что верстать под эти браузеры давно уже не нужно, ибо их процент использования очень маленький, вот статистика

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

посмотрел курс. ну что могу сказать, за бесплатно - хорошо, с учетом того, что всё это я уже знал: галп, нпм, сетки, флексы, даже смарт грид юзал без курса, просто посмотрев исходники и пару видео на ютубе от лаврика. ну а щас лучше разобрался, и сделал свою сборочку галпа получше немного. что и вам советую, вы же не платите, поэтому всегда делайте скидку на это, и не засирайте сильно, а то уже не первый раз вижу как люди ничего не ценят, качают бесплатно ещё и засирают, это просто максимальный уровень наглости. сетка хорошая, хоть и есть свой минус, пока не знаю как решить, ибо допустим я не могу сделать на мобилках отступы у контейнера по 10px а на пк по 30px, тупо появляется горизонтальный скролл, даже в курсе у лаврика это заметно, не понимаю как он закрывает на это глаза, ибо это можно сказать не маленький минус сетки, хоть и можно сделать везде отступы допустим по 15px и на мобилках и на пк, но часто бывает такое что на мобилках отступ поменьше, ибо там ширина 320px и по 15px отступы делать не очень, лучше по 10, что бы под контент побольше места осталось, надеюсь лаврик этот момент поправит, тогда сетка будет вообще без косяков, для себя ещё вынес хорошие примеси для адаптивки, что бы в ручную медиа запросы не писать, удобно, так что советую ознакомиться, и пжл, не верстайте на флоатах, бутстрап 3 уже давно мертв, переходите хотя бы на бс4 или смарт грид

PacoOfficial01 писал(а):

бутстрап 3 уже давно мертв, переходите хотя бы на бс4 или смарт грид

Вот, вроде, отлично начали, а такую бяку в конце бросили...

Ну как бутстрап 3 может быть мертв, если 4 в альфе уже 2 года? Согласен, что нужно понемногу перебираться на 4, особенно для новых проектов, но чтоб "бутстрап 3 - мёртв" - это околесица какая-то, особенно вместе с "уже давно".

Лично я воспринимаю данный подход к верстке как инструмент. imho, инструменты нужно использовать там, где они подходят лучше других, а не "забивать гвозди перочинным ножом" и засовывать свою любимую отвертку "во все поля".

Almighty937 писал(а):

PacoOfficial01 писал(а): бутстрап 3 уже давно мертв, переходите хотя бы на бс4 или смарт грид Вот, вроде, отлично начали, а такую бяку в конце бросили... Ну как бутстрап 3 может быть мертв, если 4 в альфе уже 2 года? Согласен, что нужно понемногу перебираться на 4, особенно для новых проектов, но чтоб "бутстрап 3 - мёртв" - это околесица какая-то, особенно вместе с "уже давно". Лично я воспринимаю данный подход к верстке как инструмент. imho, инструменты нужно использовать там, где они подходят лучше других, а не "забивать гвозди перочинным ножом" и засовывать свою любимую отвертку "во все поля".

Сори что задело, я понимаю что не приятно, но это не значит что всё бс3 уже запрещено юзать, нет, он просто устарел.. я сам начинал с бс3, это моя первая сетка. Не зря же новая версия бутстрапа построена на флекс боксах, ибо это современный способ верстки, хотя этим флексбокам уже больше 3 лет, но из за старых браузеров актуален он стал только в 2017, многие ещё на флоатах верстают, я знаю, но пора уже переходить на флексы, ведь все мы знаем о косяках и минусах флоатов, особенно невозможность нормально выровнять элемент по центру. Сейчас спокойно можно использовать flexbox, не нужно костыльными способами ровнять элемент по центру, ты просто задаешь 2 свойства и у тебя элемент становится четко по центру, а так же не нужно зас#рать HTML лишними классами типа .row, col-md-3, плодить лишние элементы.. всю стилизацию лучше оставить для CSS препроцессоров, все эти стили сетки можно инклюдить в CSS, даже в бутстрапе вроде такой функционал есть.. это не сложно, обертке задаешь .row-flex() а элементам .col() и .size(4) и в ряд встанет 3 элемента, в итоге HTML остается чистый. Хотя я сам норм отношусь к бс, особенно 4, у каждого способа есть конечно свои минусы, но думаю смарт грид это норм инструмент, когда дизайн по сетке сделан, а не тяп ляп..

Кстати, вчера помоему я вроде писал об одном минусе смарт грида, типа когда я хочу сделать отступы у контейнера на пк по 30px а на мобилках по 10px, и появлялась горизонтальная полоса прокрутки, я решил это вызовом примеси у обертки, у которой задан .row-flex() - например если мы поставили 10px отступ на мобилках (xs экран) то нужно прописать .xs(margin, 0 -10px); и всё, горизонтальная полоса пропадет, но лучше Лаврику конечно добавить этот функционал в саму сетку, ибо даже на курсе видно этот момент) не знаю почему никто эту тему не поднимал, по крайней мере я не видел, но благо всё решается быстро, одним свойством, а то прям на душе фигово было, вроде всё отлично, но маленькое ограничение было, нельзя было разные отступы у контейнера задать, в зависимости от экрана (xs, sm, md, lg)

Ну а так че, инструментов дофига, юзайте какой хотите, и пофиг, главное что бы вы сами ощущали себя норм

Насколько актуальна данная система после выхода Бутстрапа4?

mogambo писал(а):

Насколько актуальна данная система после выхода Бутстрапа4?

выскажу личное мнение: актуальность, конечно упала. Но и подобная сетка не особо нужна: можно успешно верстать без неё, используя инлайновые элементы и флексбокс

ybeliaev писал(а):

mogambo писал(а): Насколько актуальна данная система после выхода Бутстрапа4? выскажу личное мнение: актуальность, конечно упала. Но и подобная сетка не особо нужна: можно успешно верстать без неё, используя инлайновые элементы и флексбокс

Сетка smart-grid не конкурировала с бутстрапом и актуальность не упала. Smart-grid на миксинах, бутстрап на классах. Другой подход. Сетки на миксинах были и раньше, но они сильно раздували css из-за огромного количества @media в css. Автор курса просто нашёл в недрах npm плагин, который все @media в css совмещает и понял что так css раздуваться не будет))). Ну, действительно, с таким подходом можно верстать на миксинах не мусоря в css.

Моё скромное мнение. Сетка smart-grid вполне юзабельный инструмент, а на этом курсе автор по сути продаёт её документацию))) и теорию по флексам для новичков, чтоб понимали как сеткой пользоваться.