Друзья, всем отличного субботнего настроения 😉

А я уже подготовил и опубликовал для вас запись прошедшего стрима (от 25 мая) с материалами по параллаксу, чтобы выходные вы провели с пользой! 😎

Для тех, кто приобретал участие — запись здесь 😉

P.S. Не забудьте авторизироваться в клубе с главной страницы "войти в Личный кабинет" с той почты, с которой вы приобретали участие.

Как всегда лазил по великому и всемогущему интернету и нашел много чего полезного для вас, что слегка скрасит, а может быть и сильно упростит вам жизнь как при вёрстке, так и в повседневной жизни 😎

Несколько интересных сервисов, которыми я хочу с вами поделиться:

1. Великолепный сервис Color Thief который поможет вам определиться с цветовой гаммой вашего проекта по фотографии. Сервис покажет преобладающие цвета, которые вы сможете взять "пипеткой", или же посмотреть с помощью F12 в панели разработчика, проинспектировав нужный кружочек с цветом.

2. Small Dev Tools поможет в форматировании вашего кода, приведения в нужный вид по стандартам написания, а так же поможет декодировать разные форматы (UTF-8, BASE64, JSON и т.д.). Так же помимо этого присутствует много плюшек, например, генерация собственных QR-кодов! Очень полезный сервис для продвинутых пользователей.

3. Забавный генератор аватарок (VK, Telegram, куда угодно) PFP Maker который может сгенерировать, обработать и украсить вашу фотографию дополненным контентом.

4. Storytale — это база картинок 3D и иллюстраций, которые вы можете скачать бесплатно, а некоторые за простую регистрацию на проекте, и пользоваться в своё удовольствие в ваших проектах.

#полезные_сервисы

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

🌟 Новость №1:
Я объявляю ежегодные летние каникулы в клубе Train IT с 15 июня по 15 июля.

В этом месяце, 14 июня, у меня будет день рождения 🥳 И я немного ломаю реальность и хочу в честь своего дня рождения подарить подарки вам! Для всех, у кого доступ заканчивается не раньше 15 июня 0:00 (и не заморожен), я подарю +30 дней доступов к имеющимся направлениям в подписке!

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

❗️Акция с подарочным месяцем закончится 14 июня в 23:59. Начисление подарочных дней состоится 15 июня в течении дня.


🌟 Новость №2:
Я буду продолжать выпускать посты и радовать вас полезными фишками и секретами. А так же я работаю над своими новыми продуктами, в частности для тех, кто хочет углубить свои знания в HTML/CSS/JS в тесном сотрудничестве со мной. Речь идёт о моей практической экспериментальной группе, где мы отработаем основы и азы вёрстки с моей обратной связью и выходом на связь в онлайн-формате 😏

Так же я буду видоизменять свой клуб. Доделывать ступени тренажера дальше и превращать его в машину обучения с интереснейшей вовлечённостью в виде геймификации.

Вот такой пост-анонс получился. Желаю всем тёплого лета 😉

Друзья, сегодня мой 34й день рождения!🥳🥳🥳

Я рад, что мне удалось собрать такое тёплое комьюнити, и безумно счастлив приносить пользу и вклад в наше с вами сообщество и индустрию EdTech в целом ☺️

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

🎈Так же хочу напомнить, что акция +30 дней доступов в подарок от меня закончится сегодня в 23:59. Так что если вы хотите успеть получить в подарок +30 дней к текущим доступам, вы ещё успеваете это сделать, приобретая доступы с главной страницы клуба 😉

Летние каникулы в клубе Train IT начнутся с 15 июня и продлятся до 15 июля.

Зачисление подарочных доступов произойдет 15 июня в течение дня.

Ну а я пошел праздновать 😂

Предвыходная уличная познавательная магия 😅

Сделал интересную декоративную фишку для кнопки формы, и хочу поделиться ею с вами.

Бывает такая ситуация, что наш интернет барахлит, либо происходит слишком долгое ожидание от сервера самого ГК, и когда пользователь кликает на кнопку Оплатить/Записаться и т.д., то возможно длительное ожидание, в ходе которого пользователь не до конца понимает, формируется его заказ или нет. Да, Геткурс с недавних пор сделал значок загрузки на самой кнопке, но я предлагаю ещё больше разнообразить и показать пользователю, что его заказ формируется, и ему следует немного подождать, чтобы не было соблазна тыкнуть на кнопку формы ещё раз (и убить все процессы или задвоить заказ).

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

Порядок установки:
1. Поставьте вашему блоку с формой любой класс. У меня этот класс my-form
2. Поставьте скрипт в блок JavaScript под вашу форму:

$(function() {
let myForm = document.querySelector('.my-form'); // Здесь поменять класс на класс вашего блока
let formBtn = myForm.querySelector('.btn');

formBtn.addEventListener('click', function() {
this.innerHTML = ' Формируем заказ...';
this.style.backgroundColor = '#a0cfa0';
});
})

Обратите внимание, что если ваш класс у формы будет другим, то в вам в скрипте нужно поставить свой класс вместо .my-form 😎

Пользуйтесь 😊

#полезная_фишка

Проводите марафоны? Есть открытые уроки для всех зарегистрировавшихся? 😏

Тогда наверняка у вас есть красный значок уведомлений, который появляется каждый день, и там скапливается от 100 до 1000 а то и больше. И всё из-за открытых марафонов/уроков/вебинаров, где люди оставляют свою отметку, особенно если потом вам нужно всё это проверить и долго, нудно, утомительно протыкивать кнопку "Принять".

Поделюсь с вами небольшим лайфхаком, как сэкономить себе кучу времени, чтобы почистить ленту ответов. Всё благодаря кнопочке "Принять всё", которую я для вас подготовил. Она принимает все ответы, которые есть на текущей страницу ответов. Т.е. если у вас 8 страниц ответов, то по одному нажатию кнопки, вся текущая страница будет принята. Итого останется нажать её ещё 7 раз, т.к. ГК автоматически подтянет следующую страницу.

Устанавливать кнопку следует в Настройки аккаунта, в раздел "Счётчики и скрипты для BODY":

<script>
$(function() {
    if(window.location.href.indexOf('/teach/control/answers/unanswered') > -1) {
        $('.container').append(`
            <button class="btn btn-success accept-all" style="position: fixed; top: 20px; right: 20px;">Принять всё</button>
        `);
        
        $(function() {
            var acceptBtns = document.querySelectorAll('.btn[value="accepted"]');
    
            $('.accept-all').on('click', function() {
                acceptBtns.forEach(e => e.click());
            });
        });
    }
})
</script>

Кнопочка появится в вашей Ленте ответов справа сверху, примерно через 10 минут (зависит от загруженности сервера ГК, на котором располагается ваш проект) ✔️

#лайфхак #полезная_фишка

Всем отличных выходных 😎

Припоздавший мем подъехал. Знакомо? 😁

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

Прикреплю к этому посту два шаблона, а опрос будет ниже.

Голосование продлится до конца дня среды (5 июля). Думаю, многие уже догадываются, что это означает 😎

P.S. Если победит первый шаблон, то туда тоже обязательно прикрутим слайдер! 🎂

Жаркое голосование 😬
Сегодня в 18:00 остановлю голосование, и определим макет, который будем верстать.

Анонс предстоящей вёрстки будет в пятницу (7 июля). Не пропустите 🥺

А вот и тот самый анонс по итогу голосования! 😎

Победил макет "Книжный лендинг" (Шаблон-1). Именно его мы будем с вами верстать на очередном, уже 5-м по счёту стриме, в рамках клуба Train IT — Прожарке макетов. Стрим пройдёт 27 июля в 16:00.

⏩ Участвовать на стриме и посмотреть программу

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

Как и всегда, в данный момент действуют льготные цены до 24 июля 23:59:
Для счастливых обладателей GTFcard — 1790р.
Обычная льготная цена — 1990р.

А уже 25 июля цена изменится и станет 2590р. для всех.

⏩ Участвовать на стриме и посмотреть программу

И конечно же, если вы не сможете посетить эфир в этот день, то приобретая участие, запись стрима останется с вами навсегда в личном кабинете клуба Train IT.

Важные моменты:
❕ Если вы владелец GTFcard, но на странице вы видите цену, не соответствующую владельцу карты, сперва авторизуйтесь в проекте под вашим аккаунтом, имеющим GTFcard.
❕ Если вы авторизованы, являетесь владельцем GTFcard и всё равно видите несоответствующую цену, то убедитесь, что у вас подключён клуб Train IT в вашем аккаунте Клуба Магии, чтобы получить соответствующие преимущества.
❕ Если у вас уже был аккаунт в клубе Train IT, пожалуйста, так же авторизуйтесь с него или восстановите пароль, чтобы корректно совершить покупку. Слияние двух аккаунтов чревато потерей доступов ко всему, что у вас было ранее.

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

Не многие обращают внимание на то, что ширина самого контейнера, содержащего контент в Фигме, зачастую существенно отличается от ширины контейнера Геткурса, у которого есть ограничение в 1170px (плюс по 15 пикселям маргина/паддинга по бокам). И тут встаёт вопрос: как всё это уместить в пределы Геткурса?

Некоторые люди сдадутся и будут делать всё в соответствии с контейнером ГК. Но мы-то с вами не такие, правда же? 😉 Мы попросту изменим ширину контейнера и сделаем её такой же на всей странице, как и в макете. Делается это сверхпросто и быстро.

Предположим, что в Фигме контейнер самого контента имеет ширину в 1400px. А мы помним, что контейнеры Геткурса под контент составляют 1170px в ширину. Ставим CSS-блок в самый верх вашей страницы и просто добавляем туда следующее:

.my-container,
.container {
max-width: 1400px !important;
}

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

#лайфхак

Какие ваши ощущения, когда вам прилетает макет в Фигме со сложными элементами, которые, как кажется, нереально собрать на Геткурсе? Хочется при этом передать макет "более опытному" товарищу, а у вас самих опускаются руки?

Если вам знакомы эти ощущения, то мой стрим 27 июля в 16:00 специально для вас 😎

⏩ Участвовать на стриме и посмотреть программу

Путём голосования был выбран макет "Книжного лендинга", который мы будем верстать в прямом эфире с кучей сложных элементов и нестандартных блоков. Я научу вас грамотному подходу к сложным макетам, правильной вёрстке и стилизации таких элементов. Постепенно избавимся от страха подобных макетов, ведь мы его прожарим в свойственной мне манере в прямом эфире! 😎

В данный момент действуют льготные цены до 24 июля 23:59:
Для счастливых обладателей GTFcard — 1790р.
Обычная льготная цена — 1990р.

А уже 25 июля цена изменится и станет 2590р. для всех.

⏩ Участвовать на стриме и посмотреть программу

Так же, если вы не сможете посетить эфир в этот день, то приобретая участие, запись стрима останется с вами навсегда в личном кабинете клуба Train IT 🔥

P.S. Важные моменты по GTFcard смотрите в закреплённом посте в самом низу сообщения.

Всем хорошего вечера, и отличных выходных ☺️
Держите пятничный мемасик!

P.S.: Обновляю телеграм на мобильном, буду тестировать сторисы 😏

⏰ Хотел напомнить, что до окончания действия льготной цены на стрим "Прожарка макетов" осталось всего 3 дня! (до 24 июля 23:59)

⏩ Участвовать на стриме и посмотреть программу

Вас ждёт куча приёмов вёрстки по макету из Фигмы на платформе Геткурс, а так же секреты и фишки построения сложных элементов, которыми я с радостью поделюсь с вами 😊

Напоминаю, что стрим состоится 27 июля в 16:00. Если вы не сможете присутствовать в нашей ламповой тусовке в онлайне, то приобретая участие, запись стрима останется с вами навсегда в личном кабинете клуба Train IT.

⏩ Участвовать на стриме и посмотреть программу

И последнее напоминание 😉
Осталось менее 3-х часов до окончания действия льготной цены!

⏩ Участвовать на стриме и посмотреть программу

Буду ждать всех на стриме 27 июля в 16:00 😎