Size: a a a

Типичный Верстальщик

2020 May 20
Типичный Верстальщик
​​Визуализация промисов и Async/Await 🙈

Приходилось ли вам сталкиваться с JavaScript кодом, который… работает не так, как ожидается? Когда функции выполняются в произвольном, непредсказуемом порядке, или выполняются с задержкой. Одна из главных задач промисов — упорядочение выполнения функций.
Мое ненасытное любопытство и бессонные ночи окупились сполна — благодаря им я создала несколько анимаций. Пришло время поговорить о промисах: как они работают, почему их следует использовать и как это делается.

Читать - https://habr.com/ru/post/501702/

#javascript
источник
Типичный Верстальщик
Время новостей!

Мы обновляем базовый курс по вёрстке сайтов! 🔥

Это уже третий крупный апдейт нашего обучающего продукта. Предыдущее обновление повлекло за собой изменение теоретической базы и практики.

В этот раз мы делаем сильнейший упор на практику, т.к. теоретическая база за это время практически (что удивительно) не изменилась. Она по-прежнему актуальна.

➖➖➖

Окей, что же изменится ???

Мы полностью изменим систему работы над практикой. Работа с PSD постепенно уходит в прошлое, всё чаще Figma выходит на первый план.

Большинство веб-дизайнеров начинают рисовать макеты в Figma и иных подобных приложения (Sketch, Adobe XD), поэтому так важно узнать об этой программе ЗАРАНЕЕ.

Но это не значит, что PSD полностью неактуально. Не переживайте. Работу с PSD мы сохраним в продвинутом курсе, но его обновим уже к июлю, после базового.

➖➖➖

САМОЕ ВАЖНОЕ ‼️

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

Большинство бесплатных макетов, которые можно скачать в свободном доступе ужасны: они имеют отвратительный дизайн, который стыдно будет показать будущему заказчику или работодателю.

Мы решили эту проблему, поэтому сайты будут супер-конфеткой! 🍬

➖➖➖

И да, я не оговорилась. Макетов будет несколько.

1️⃣ Большой учебный макет, в котором мы предоставим два отображения: под большие устройства и мобильные. Это решит проблему с пониманием темы работы над адаптивом.

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

➖➖➖

2️⃣ Макет для дипломной работы. Аналогично будет два режима отображения: большие и мобильные устройства. Выделаем 2 недели на выполнение верстки этого макета для закрепления материалов с курса.

➖➖➖

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

Новичок может ошибиться с выбором и слишком долго сидеть над работой, а еще хуже - расстроиться, если что-то не получается. Поэтому, предоставляя вам качественный макет, МЫ РЕШАЕМ ЭТО.

➖➖➖

Давайте я покажу пример, как может выглядеть макет в Figma, в котором отрисовано два состояния: https://i.imgur.com/d1JoYDh.png

Это пример макета сайта Frontend Blok http://frontendblok.com/ который как я рассказывала ранее скоро дополнится новым страницами (ориентировочно в июне). Точно также мы будем работать с макетом для базового курса.

➖➖➖

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

1. Самостоятельный тариф: 7900 рублей (вместо 4900)
2. Полный тариф с куратором: 12900 рублей (вместо 9900)
3. Индивидуальный тариф: 34900 рублей (вместо 30000)

💪🏻 Последний тариф только для тех, кому нужна полная поддержка после курсы: поиск заказов на фрилансе или трудоустройство (зависит от цели).

✏️ Программа курса тут https://tpverstak.ru/training/

Если остались вопросы по обновленному курсу, пишите мне @annblok
источник
2020 May 21
Типичный Верстальщик
​​Как начать учиться программированию и не остановиться на полпути 😎

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

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

Читать - https://techrocks.ru/2020/05/15/how-to-start-and-keep-learning-to-code/

#work
источник
Типичный Верстальщик
Только 3 дня скидки 30% на Базовый курс по вёрстке 3.0 ‼️

Мы полностью переработали практику. Теперь ты научишься верстать макеты Figma на HTML и CSS, отрисованные специально под курс, за 20 уроков.

~ ~ ~

Макетов будет несколько:

✅ Большой учебный макет, отрисованный под большие и мобильные устройства. Это решит проблему с пониманием того, как создаются адаптивы.

✅ Макет для дипломной работы. Аналогично будет два режима отображения: большие и мобильные устройства. После курса вам будет дано 2 недели на вёрстке для закрепления теоретических материалов.

~ ~ ~

Только 3 дня действуют скидки 30% на Базовый курс 3.0 ‼️

🔸 Самостоятельный тариф 5500 руб (вместо 7900)
🔸 Тариф с куратором 9000 руб (вместо 12900)
🔸 Индивидуальный тариф 24500 руб (вместо 30000)

После этого будет скидка 20%, через 3 дня 10% и еще через 3 дня цена будет 100%, т.е. без скидок. Самое время не упустить возможность, а воспользоваться ей!

~ ~ ~

✍🏻 Программа курса и возможность оплаты со скидкой возможна на сайте — https://tpverstak.ru/training/

Если вы являетесь участником учебной платформы http://frontendblok.com/, то можете приобрести курс со скидкой сразу там.

P.S. Если вы уже учились на Базовом курсе 2.0 и хотели бы пройти практику Базового курса 3.0, то напишите в ЛС @annblok вашу почту с учебной платформы и мы сделаем вам скидочку 40% 💙
источник
2020 May 22
Типичный Верстальщик
​​50 бесплатных ресурсов для создания веб-интерфейсов 😈

Представляем список полезных бесплатных ресурсов для создания веб-интерфейсов: иллюстрации, фото и видео, шрифты, цветовые палитры, иконки, анимации и прочие элементы.

Читать - https://proglib.io/p/50-besplatnyh-resursov-dlya-sozdaniya-veb-interfeysov-2020-05-16

#work
источник
Типичный Верстальщик
Pixel Perfect верстка сайтов на практике 🔥

Расскажу на практике, на какие моменты стоит обращать внимание при работе с плагином PerfectPixel или Pix to Pix для того, чтобы верстка соответствовала пиксель перфект.

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

#css
YouTube
😎 Pixel Perfect верстка сайтов на практике
🔥3 дня действует скидка 30% на Базовый курс 3.0 https://tpverstak.ru/training/
Старт обучения 8 июня (для учеников предыдущего потока действует скидка 40%)

Расскажу на практике, на какие моменты стоит обращать внимание при работе с плагином PerfectPixel или Pix to Pix для того, чтобы верстка соответствовала пиксель перфект.

Тайм-коды:
00:00 - Вступление
00:32 - Демонстрация блока и разметки для практики
01:59 - Плагины для работы с пиксель перфект
03:37 - Скидка 30% на Базовый Курс 3.0
06:37 - Верстка блока
17:57 - Использование плагина PerfectPixel
29:48 - Итоги

Шпаргалка Grid CSS — https://tpverstak.ru/grid/

Видео про единицы измерения:
https://youtu.be/dPzoBD2Z68A
https://youtu.be/ZuSIlE9jj2k

Видео о методах верстки: https://youtu.be/qbIR23K8hGE

Видео о Dev Tools: https://youtu.be/PDP9NNKtEuA

Купить ежедневник Frontend Book — https://tpverstak.ru/frontendbook
Задать вопрос про фронтенд или верстку — https://frontendhelp.me/ru

✅Поддержать канал — https://www.youtube.com/channel/UCn5wduCq2Mus0v85QZn9IaA/join…
источник
Типичный Верстальщик
Отзыв о Базовом курсе по вёрстке от Антона 🔥

Напоминаю, мы полностью переработали практику. На новом курсе, который стартует 8 июня ты научишься верстать макеты Figma на HTML и CSS.

Макетов будет два:

— Большой учебный макет, отрисованный под большие и мобильные устройства. Это решит проблему с пониманием того, как создаются адаптивы.

— Макет для дипломной работы. Аналогично будет два режима отображения: большие и мобильные устройства. После курса вам будет дано 2 недели на вёрстке для закрепления теоретических материалов.

~ ~ ~

❗️ У тебя есть 3 дня воспользоваться скидкой 30% на Базовый Курс 3.0

~ ~ ~

✍🏻 Программа курса и возможность оплаты со скидкой возможна на сайте — https://tpverstak.ru/training/

Если вы являетесь участником учебной платформы http://frontendblok.com/, то можете приобрести курс со скидкой сразу там.

P.S. Если вы уже учились на Базовом курсе 2.0 и хотели бы пройти практику Базового курса 3.0, то напишите в ЛС @annblok вашу почту с учебной платформы и мы сделаем вам скидочку 40% 💙
источник
Типичный Верстальщик
Скидка 30% не только на базовый, но и продвинутый курс 🔥

Оба курса стартуют 8 июня. Базовый курс обновлен, продвинутый курс обновится на следующем потоке, НО после обновления продвинутый также поднимется в цене. Это ваш шанс урвать отличную возможность!

Ссылки для оплаты:
Базовый курс — https://tpverstak.ru/training/
Продвинутый курс — https://tpverstak.ru/training-profi/

Если вы являетесь участником учебной платформы http://frontendblok.com/, то можете приобрести курс со скидкой сразу там.

P.S. Если вы уже учились на Базовом курсе 2.0 и хотели бы пройти практику Базового курса 3.0, то напишите в ЛС @annblok вашу почту с учебной платформы и мы сделаем вам скидочку 40% 💙
источник
2020 May 23
Типичный Верстальщик
30% скидка на курсы по верстке до конца выходных! 🔥

Скидка распространяется на Базовый курс 3.0 и Продвинутый курс 2.0. Старт обучения 8 июня.

Каждый курс длится месяц + даем 2 недели на верстку дипломного проекта.

В базовом курсе мы верстаем макеты Figma —> HTML и CSS.
В продвинутом курсе используем PSD —> HTML, SCSS и Gulp.

Ознакомиться с программой курса и оплатить его можно тут:
✅ Базовый курс 3.0 — tpverstak.ru/training/
✅ Продвинутый курс 2.0 — tpverstak.ru/training-profi/

P.S. Если вы являетесь учеником учебной платформы http://frontendblok.com/, то можете приобрести курс со скидкой сразу на платформе.

P.P.S. Если ранее вы учились на Базовом курсе 2.0 и хотели бы перейти на версию 3.0, то для вас действует скидка 40% 💙
источник
2020 May 24
Типичный Верстальщик
​​6 языков программирования нового поколения, на которые стоит обратить внимание 👽

Список из 6 достаточно перспективных языков программирования, на которые стоит обратить внимание. Список собрал KV.BY.

Читать - https://techrocks.ru/2020/03/15/programming-languages-of-new-generation/

#work
источник
Типичный Верстальщик
Несколько выводов о том, как справиться с Pixel Perfect 🔥

Недавно я записывала видео-практику о том, как работать с плагином PerfectPixel (ссылка на видео выще), но думаю не помешает обозначить несколько выводов в виде поста.

✅ Для работы с пиксель перфект используйте плагины для браузеров PerfectPixel или Pix to Piix;
✅ Если верстаете на ретине экране используйте Pix to Pix или сохраните макет в размере x2 и добавьте его в PerfectPixel;
✅ Если вы соблюдаете общую структуру и в одном из блоков вдруг оказалось, что отступ незначительно отличается от предыдущих таких же блоков, то можно на это закрыть глаза, если глобально это ни на что не влияет.
✅ Дизайнеры тоже люди и способны ошибаться при отрисовке макета, имейте это в виду
✅ Соблюдение каждого пикселя крайне важно при работе с кнопками, иконками и иных меленьких элементах.
✅ Можете фиксировать макет в плагине PerfectPixel, нажав на замочек. Это позволит открывать инспектор кода Dev Tools, не отключая плагина. В противном случае, чтобы открыть инспектор кода, потребуется отключить плагин и снова включить, потому что Dev Tools может открыть изображение макета в коде.
✅ Несколько пользователей под видео отметило, что им удобнее использовать режим инверсии. Попробуй и ты этот метод, если понимаешь, что родные цвета не подходят тебе для отслеживания элементов.
источник
Типичный Верстальщик
tpverstak
30% скидка на курсы по верстке до конца выходных! 🔥

Скидка распространяется на Базовый курс 3.0 и Продвинутый курс 2.0. Старт обучения 8 июня.

Каждый курс длится месяц + даем 2 недели на верстку дипломного проекта.

В базовом курсе мы верстаем макеты Figma —> HTML и CSS.
В продвинутом курсе используем PSD —> HTML, SCSS и Gulp.

Ознакомиться с программой курса и оплатить его можно тут:
✅ Базовый курс 3.0 — tpverstak.ru/training/
✅ Продвинутый курс 2.0 — tpverstak.ru/training-profi/

P.S. Если вы являетесь учеником учебной платформы http://frontendblok.com/, то можете приобрести курс со скидкой сразу на платформе.

P.P.S. Если ранее вы учились на Базовом курсе 2.0 и хотели бы перейти на версию 3.0, то для вас действует скидка 40% 💙
Последний раз напоминаю вам, что сегодня действуют максимальные скидки на обучение 😊 Подробности в этом сообщении
источник
2020 May 25
Типичный Верстальщик
​​Лучшие JavaScript библиотеки, о которых вы должны знать 😎

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

Читать - http://rapprogtrain.com/article/59

#javascript
источник
2020 May 26
Типичный Верстальщик
🔝 Топовый Вечный! По смехотворной цене! 🔝

8 ГБ RAM / 4x4.5 ГГц CPU / 80 ГБ NVMe / 500 Мбит/сек / anti-DDoS

Размещение в лучшем московском дата-центре Datapro, подключение к каналу 500 Мбит/сек, выделенный IPv4 адрес, защита от DDoS.

🔥Спешите узнать подробней и заказать
источник
Типичный Верстальщик
​​6 лучших инструментов для веб-разработки 😎

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

Читать - http://rapprogtrain.com/article/49

#work
источник
Типичный Верстальщик
​​ТОП-10 книг по PHP: от новичка до профессионала 😈

Книги с высокими оценками, посвященные языку PHP и PHP-фреймворкам. Расставлены в порядке возрастания сложности, обобщены указанные читателями преимущества и недостатки.

Читать - https://proglib.io/p/top-10-knig-po-php-ot-novichka-do-professionala-2020-05-24

#php
источник
2020 May 27
Типичный Верстальщик
Сегодня последний день действия 20% скидки на курсы по вёрстке 🔥

Базовый курс обновлен, продвинутый обновится на следующем потоке, что также повляется на рост цен. Предупрежден, значит вооружен ⚡️

✅ Тарифные планы Базового курса 3.0:
1. Самостоятельный тариф: 6300 рублей (вместо 7900)
2. Полный тариф с куратором: 10300 рублей (вместо 12900)
3. Индивидуальный тариф: 27900 рублей (вместо 34900)

✅ Тарифные планы Продвинутого курса 2.0:
1. Самостоятельный тариф: 3900 рублей (вместо 4900)
2. Полный тариф с куратором: 7900 рублей (вместо 9900)
3. Индивидуальный тариф: 27900 рублей (вместо 34900)

На базовом курсе изменена практика. Теперь мы будем работать в Figma, а на продвинутом курсе останется работа с PSD. Макеты для нового базового курса специально отрисованы для нашего курса в двух версиях: большие экраны и мобильные.

Макетов будет несколько.

1️⃣ Большой учебный макет, в котором мы предоставим два отображения: под большие устройства и мобильные. Это решит проблему с пониманием темы работы над адаптивом. На предыдущем курсе был предоставлен макет только для больших устройств и мне приходилось буквально на пальцах показывать, как расставлять блоки.

2️⃣ Макет для дипломной работы. Аналогично будет два режима отображения: большие и мобильные устройства. Выделаем 2 недели на выполнение верстки этого макета для закрепления материалов с курса.

Обучение на каждом курсе длится месяц + дается 2 недели на выполнение дипломного проекта.

👉 Оплатить базовый курс — https://tpverstak.ru/training/
👉 Оплатить продвинутый курс — https://tpverstak.ru/training-profi/

P.S. Если вы являетесь учеником учебной платформы http://frontendblok.com/, то можете приобрести курс со скидкой сразу на платформе.

P.P.S. Если ранее вы учились на Базовом курсе 2.0 и хотели бы перейти на версию 3.0, то для вас действует скидка 40% 💙
источник
Типичный Верстальщик
​​Кто такой Deno, и почему о нём все говорят? 👽

Deno – это новая runtime-среда для JavaScript и TypeScript от создателя Node.js. Многие считают, что это крутая штука. В статье вкратце объясняют, что же есть в Deno такого хорошего.

Читать - https://proglib.io/p/kto-takoy-deno-i-pochemu-o-nem-vse-govoryat-2020-05-21

#node
источник
2020 May 28
Типичный Верстальщик
​​Touch slider на JavaScript 🙈

Автор рассказывает о том, как сделать touch события для слайдера (и не только).

Читать - https://habr.com/ru/post/501258/

#javascript
источник
2020 May 29
Типичный Верстальщик
11 прагматичных советов для разработчиков-джуниоров 😎

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

Читать - https://techrocks.ru/2020/05/22/11-career-tips-for-junior-developers-1/

#work
источник