Frontend.school() | изучаем HTML, CSS, JavaScript вместе!
1.21K subscribers
550 photos
66 videos
3 files
252 links
Крутым фронтендером не рождаются — им становятся на канале @frontend_school!

Наш чат: @frontend_school_chat
Наша флудилка: @frontend_school_flud

Другие проекты: t.me/addlist/dIq-3zEMMugwZTgy

Мы в VK: vk.com/frontend_school

Связь: @jellyjail
Download Telegram
@frontend_school #полезное

CSSBattle

Полезный сайт для тренировки навыков вёрстки. Ваша задача сверстать рисунок, используя только html и css. Размер рисунков фиксированный - 400х300.

С помощью этого сервиса вы сможете играючи прокачать свой скилл и показать другим игрокам чего вы стоите!

Перейти
Какое значение CSS-свойства float отсутствует?
Anonymous Quiz
62%
both
34%
none
3%
right
1%
left
This media is not supported in your browser
VIEW IN TELEGRAM
@frontend_school #интересное

Диммерный выключатель

Сегодня предлагаем вам ознакомиться с кодом следующего проекта, а именно диммерного выключателя света. Каждый раз перезагружая страницу вы получите разный цвет освещения, а поворот выключателя меняет степень освещения. Посмотрите, как он реализован с использование Pug - Stylus - JS.

CodePen
@frontend_school #статья #JavaScript

Как правильно выбрать фронтэнд framework или почему нельзя верить сравнению фреймверков

Каждый кто изучает JavaScript рано или поздно приходит к вопросу «Какой же фреймворк выбрать для изучения?» Каждый специалист будет советовать тот, с которым работает он и поэтому его оценка будет не объективна. Так что же делать?

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

Читать статью
С помощью какого HTML-элемента можно добавить код JavaScript?
Anonymous Quiz
6%
<javascript>
88%
<script>
6%
<js>
0%
<scripting>
This media is not supported in your browser
VIEW IN TELEGRAM
@frontend_school #интересное

Дизайнерская чаша

Чаша, может, и не блещет дизайном, но зато она может помочь вам в создании уникального и приятного дизайна вашего сайта! С помощью HTML-препроцессора Pug, CSS-препроцессора Stylus, JS библиотеки Jquery и толики магии эта чаша по клику выдаст вам пару цветов.

CodePen
Что будет выведено в консоль при выполнении кода, представленного на изображении выше?
Anonymous Quiz
20%
true true
34%
true false
16%
false true
30%
false false
@frontend_school #статья #JavaScript

Полное понимание синхронного и асинхронного JavaScript с Async/Await

Когда только начинаешь програмировать на JS всё может показаться простым и понятным. Задачу можно даже нарисовать в виде блок-схемы. Но когда углубляешься дальше или начинаешь работать над реальным проектом оказывается, что не всё так просто. Появляются какие-то асинхронные запросы, которые то ли ждут что-то, то ли делают. В этой статье вы во всех подробностях изучите этот вопрос и сможете без труда использовать синхронные и асинхронные запросы.

Читать статью
This media is not supported in your browser
VIEW IN TELEGRAM
@frontend_school #интересное

Kill The King

Сегодня предлагаю вам ознакомиться с очередной игрой. Суть просто - убивай приспешников короля, подбираясь к нему всё ближе и ближе. Из особенностей стоит отметить наличие звука и даже голосов у персонажей, а также приятную графику для подобного проекта.

CodePen
@frontend_school #статья #CSS

Вёрстка на Grid в CSS. Полное руководство и справочник

С появление CSS Flex, а также Grid верстать сайты стало гораздо проще. Многие "костыли" перестали быть необходимы, а адаптивность теперь стала простой как никогда раньше. Эта статья является подробным, а главное, понятным руководством по использованию CSS Grid.

Читать статью