[Перевод] 30 секунд CSS

[Перевод] 30 секунд CSS

Предлагаем вашему вниманию коллекцию полезных CSS-сниппетов, в которых вы можете разобраться за 30 секунд, а то и быстрее. Читать дальше →

Подробнее
[Перевод] Использование CSS-grid при проектировании пользовательских интерфейсов

[Перевод] Использование CSS-grid при проектировании пользовательских интерфейсов

CSS-grid — это отличный инструмент для создания макетов страниц контентно-ориентированных сайтов, включающих в себя большие фрагменты текста и другие материалы. Кроме того, эта технология имеет огромное значение и для великого множества традиционных пользовательских интерфейсов веб-приложений. В материале, перевод которого мы сегодня публикуем, Джош Мариначчи рассказывает о том, как использовать CSS-grid для проектирования макетов страниц. Речь пойдёт о страницах, которые способны…

Подробнее
Дайджест свежих материалов из мира фронтенда за последнюю неделю №303 (19 — 25 февраля 2018)

Дайджест свежих материалов из мира фронтенда за последнюю неделю №303 (19 — 25 февраля 2018)

Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него. Читать дальше →

Подробнее
[Перевод] Медиа-запросы в адаптивном дизайне 2018

[Перевод] Медиа-запросы в адаптивном дизайне 2018

В июле 2010 года я написала статью «Как использовать CSS3 медиа-запросы для создания мобильной версии вашего сайта» для журнала Smashing. Спустя почти восемь лет эта статья по-прежнему очень популярна. Я решила вернуться к этой теме, поскольку теперь у нас есть такие методы компоновки, как Flexbox и CSS Grid. В этой статье мы рассмотрим современные методы использования медиа-запросов в адаптивном дизайне, а также рассмотрим, что может произойти в будущем. Читать дальше →

Подробнее
Открытый вебинар «Особенности языка JavaScript»

Открытый вебинар «Особенности языка JavaScript»

Всем бобра! Переработали тут по заявкам слушателей программу курса по JavaScript: дописали смежные темы типа сборщиков, тестовых фреймворков плюс догнали чуток изучения подходов по ООП + SOLID, паттерны и ещё мелкие разные изменения. По этому поводу провели достаточно интересный открытый вебинар на тему «Особенности языка JavaScript», где Юрий Дворжецкий рассказывал и показывал (а ещё и спрашивал) основные отличия языка, идиомы JS. Как всегда ждём вопросы, пожелания, тапки.

Подробнее
Разработка изоморфного RealWorld приложения с SSR и Progressive Enhancement. Часть 2 — Hello World

Разработка изоморфного RealWorld приложения с SSR и Progressive Enhancement. Часть 2 — Hello World

В предыдущей части туториала мы узнали что такое проект RealWorld, определились целями туториала, выбрали стек технологий и написали простой веб-сервер на Express в качестве основы для изоморфного фронтенда. В этой части, мы допилим серверную часть и напишем изоморфный «Hello World» на Ractive, а также соберем все это с помощью Webpack. Читать дальше →

Подробнее
Уязвимости вашего приложения

Уязвимости вашего приложения

Актуальны ли ещё угрозы XSS? Прошло около 20 лет с тех пор, как Cross Site Scripting (XSS) появился как вид атаки. С тех пор мы получили богатый опыт и знания, защита наших сайтов стала намного сложнее, а многочисленные фреймворки были призваны оберегать нас от ошибок. Но последние данные показывают совсем другую картину: в первых кварталах 2017 года количество сообщений об XSS-атаках и количество найденных уязвимостей выросло в несколько раз. В этом хабропосте мы расскажем, как страшно…

Подробнее
Дайджест свежих материалов из мира фронтенда за последнюю неделю №302 (12 — 18 февраля 2018)

Дайджест свежих материалов из мира фронтенда за последнюю неделю №302 (12 — 18 февраля 2018)

Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него. Читать дальше →

Подробнее
[Из песочницы] Sublime Text 3 жив. (Настройка и работа)

[Из песочницы] Sublime Text 3 жив. (Настройка и работа)

Sublime Text 3 — кроссплатформенный текстовый редактор. Краткий гайд для начинающих работать в sublime и в сфере вёрстки. Тут собрано всё самое необходимое и важное. (По ссылкам найдёте больше, если это нужно) Будем рассматривать его для Вёрстки на Pug / Less, где нам не нужен огромный функционал отладки. Поэтому именно этот редактор (по моему мнению) побеждает своих конкурентов как в скорости работы так и в функционале. 1. Установка программы и контроль за дополнениями (Package…

Подробнее
Разработка изоморфного RealWorld приложения с SSR и Progressive Enhancement. Часть 1 — Введение и выбор стека

Разработка изоморфного RealWorld приложения с SSR и Progressive Enhancement. Часть 1 — Введение и выбор стека

Весной 2017 года Eric Simons, со-основатель учебного проекта Thinkster, анонсировал проект «RealWorld» — демо приложение и спецификация к нему. Проект объявил своей целью выйти за рамки привычных «todo»-демок для более прикладного сравнения и изучения возможностей различных фреймворков и технологий, а также подходов к разработке и способов решения задач. Читать дальше →

Подробнее
10 IT-героев по версии Кодабры: Веб-разработка

10 IT-героев по версии Кодабры: Веб-разработка

В этом году в преддверии весны, Кодабра совместно со школой «Летово» проводит конкурс, посвященный программированию, робототехнике и VR — «IT-герои». По этому замечательному поводу мы решили рассказать Хабру, кто же для нас самих является героем, на кого мы ориентируемся при обучении детей профессиям нового века, а перед кем снимаем шляпу за их вклад в популяризацию и развитие технологий. Эта статья будет посвящена выдающимся людям, повлиявшим на становление Web 2.0 и его победное шествие

Подробнее
[Перевод] Функция random() у гуглобота работает абсолютно детерминированно

[Перевод] Функция random() у гуглобота работает абсолютно детерминированно

Я проводил некоторые эксперименты, как Googlebot разбирает и рендерит JavaScript, и наткнулся на несколько интересных вещей. Первое — то, что функция Math.random() в Googlebot выдаёт полностью детерминированные серии чисел. Я написал маленький скрипт, который использует этот баг для точной идентификации гуглобота: Источник При первом вызове Math.random() из гуглобота результат всегда будет 0,14881141134537756, второй вызов всегда вернёт 0,19426893815398216. Скрипт по ссылке выше просто…

Подробнее