Всех с началом рабочей недели!

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

До завтрашнего дня вы можете приобрести курс по следующим ценам:
Полный тариф — 3500 руб.
Самостоятельный тариф — 2000 руб.

С завтрашнего дня цены повысятся до 4500 руб. и 2500 руб. соответственно.

На выбор два курса: базовый или продвинутый.
Программа базового уровня: https://goo.gl/fvB8zC
Программа продвинутого уровня: https://goo.gl/58v3yg

Коротко:
— Если хотите учиться с нуля, то рекомендую начать с базового курса. На практике верстаем при помощи HTML и CSS;
— Если уже есть определенные навыки и теоретическая база, то переходите сразу на продвинутый. На практике верстаем при помощи HTML и SCSS.

Чтобы записаться или задать вопросы, пишите мне @annblok

Колоночная сетка для веб-дизайнеров

Пару часов назад мне пожаловались, что на канале много рекламы и совсем нет годноты. Что ж, довольно странно это слышать, особенно, когда ты готовишь практический видеокурс о Grid CSS 😅

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

Ссылка — http://gridcalculator.dk/#/1140/12/30/15

Чтобы скачать PNG, жмите на кнопку Other внизу страницы.

Пока я допиливаю интерактивную шпаргалку по Grid CSS, тут подъхали две новости из мира FrontendHelp.

Первое.
Теперь вопрос можно задать двумя способами: либо оставляете ссылку с http:// или https:// префиксом, либо кликаете на кнопку "Без ссылки". Иначе валидатор вас не пропустит. Посмотреть как это работает можно тут — https://i.imgur.com/OZ0NHiG.jpg

Второе.
Теперь вы можете оценивать ответы. Это касается не только новых вопросов, но и предыдущих. Для этого достаточно зайти в раздел "Мои вопросы" и оценить ранее закрытые задачи. Посмотреть как это примерно работает можно тут — https://i.imgur.com/OW5M45C.png

На этом пока все. Ушла делать шпору дальше 🙋

Интерактивная шпаргалка Grid CSS

Ловите шпаргалку по Grid CSS, которая удобно показывает как работает каждое свойство. Если есть какие-то замечания или пожелания, пишите, поправим.

Ссылка — https://tpverstak.ru/grid/

Griddy — сервис для автоматического создания грид-сетки с кодом

Раньше, когда не было галпов и коал, мы обходились сервисами, которые автоматически генерируют кроссбраузерные стили для box-shadow, filter и прочим свойствам CSS. Время идёт, все меняется и на смену уже приходят гриды.
Добавляйте в сохранёнки огнищенский сервис.

Ссылка — http://www.griddy.io/

Опрос-тайм.

У вас есть профиль в Linkedin?

Традиционно и внезапно делюсь IT-стикерами 🔥

Angular, React или Vue?

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

Думаю, многим будет интересно.

Друзья, наверняка многие из вас уже знают, что в скором времени выйдет серия моих уроков по Grid CSS на канале LoftBlog, поэтому вам наверняка интересно будет узнать, что у них есть чат сообщества — https://t.me/loftblog

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

Макеты PSD для практики

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

Собрала для вас все ссылки с макетами, которые публиковала на канале.

20 крутых PSD макетов для верстки (часть 1) — https://tpverstak.ru/free-psd-website-templates/

20 крутых PSD макетов для верстки (часть 2) — https://tpverstak.ru/20-free-psd-website-templates/

Бесплатные макеты PSD для верстки — https://tpverstak.ru/psd-for-practice/

PSD макеты для вёрстки сайтов — https://tpverstak.ru/psd-mockups/

Бесплатные макеты PSD многостраничных сайтов — https://tpverstak.ru/multipage-psd/

Бесплатные макеты PSD для практики Grid CSS — https://tpverstak.ru/psd-grid-css/

#psd

Книга о Git

Есть несколько вариантов изучения Git. Например, зайти на сайт или скачать PDF / Epub на свой планшет с сайта. Выбрать русский или язык оригинала. Лови всевозможные варианты.

en — https://git-scm.com/book/en/v2
ru — https://git-scm.com/book/ru/v2

#git

В чем разница между Float, Flexbox и Grid CSS?

Давайте поговорим о разнице между Float / Flexbox / Grid и о том, когда их уместнее всего использовать в CSS и возможно ли смешивать эти свойства для позиционирования элементов?
Расскажу коротко о предназначении каждого и их короткой истории с примерами вёрстки. Ставь лайк, если это видео показалось тебе полезным и не скучным 🔥

Смотреть — https://youtu.be/azQRYYdKt8I

В чем разница между Float, Flexbox и Grid CSS?

Из этой статьи ты узнаешь о разнице между Float, Flexbox и Grid. Также разберем, когда их уместнее всего использовать в CSS и возможно ли смешивать эти свойства для позиционирования элементов.

Читать — http://tpverstak.ru/float-flex-grid-css/

Давайте взаимодобавление в друзья устроим на Linkedin?

Ранее я проводила опрос и как оказалось, что у нас немало тех, кто занимается своими профилями на Linkedin и тех, кто просто зарегистрирован там.

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

Мой профиль — https://www.linkedin.com/in/annblok/

Чтобы всё было по-честному и добавлялись не только ко мне, прикрепляю комментарии. Оставляйте ссылки на свои профили там. Ну что, погнали? 🔥

Шпаргалка по основам JavaScript

Если вам лень проходить курсы по JS, изучать онлайн-книгу learn.javascript или уже завтра нужно идти на собеседование в качестве верстальщика, то эта шпаргалка для вас. Вся необходимая информация разложена по полочкам. Изучение статьи займет не более 10 минут.

Смотреть — https://telegra.ph/Osnovy-JavaScript-10-19

#js

В плагине jQuery найдена уязвимость, которая поставила серверы под угрозу

jQuery File Upload — самый заплюсованный jQuery-проект на GitHub после самого фреймворка, у него насчитывается более 7800 форков, он интегрирован с сотнями, если не с тысячами, различных проектов, включая CMS, CRM, интранет-решения, плагины для  WordPress, аддоны для Drupal, компоненты Joomla и так далее. Фактически, уязвимость в jQuery File Upload может угрожать множеству платформ, установленных в самых разных местах.

Читать далее — https://xakep.ru/2018/10/19/jquery-file-upload/

Опрос. Важно мнение каждого!

Вам было бы интересно приобрести в подарок или для себя-любимого ежедневник, где по мимо каждодневных записей (например, завершить заказ N, доделать правки сайта W, изучить новую тему по Vue и пр.), были бы информативные страницы по веб-разработке? Например, шпора по Grid CSS, JS, Gulp и пр.?

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

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

Выберите нужную кнопку. Помогите Анне понять, насколько это актуально.

Сервис, который позволяет посмотреть, как будет выглядеть сайт на популярных устройствах

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

Ссылка — http://www.responsinator.com/

The Front-End Checklist 📒

Интерактивный список для отметок своего прогресса изучения по темам и просмотра общего результата по разделам. Удобно, обязательно сохраните в закладки.

Смотреть — https://frontendchecklist.io