Frontend.school() | изучаем HTML, CSS, JavaScript вместе!
1.2K 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
​​Что нового ожидать в ES2021

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

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

@frontend_school #статья #JavaScript
​​Вы можете создавать эти элементы, не используя JavaScript

Необязательно каждый раз плодить кучу JS-кода, если можно сделать то же самое, используя только HTML и CSS. Это не только может снизить нагрузку на сайт, но и избавит от проблем, когда пользователь отключает работу JS в браузере.

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

@frontend_school #статья #JavaScript
​​Что такое @font-face на самом деле

В этой статье вы узнаете, как правильно подключать локальные шрифты к вашему сайту. Статье небольшая, но крайне полезная!

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

@frontend_school #CSS
​​9 полезных плагинов VS Code для вёрстки

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

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

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

@frontend_school #статья
Нас таким не напугать. Правда ведь?

@frontend_school #юмор
​​Как заменить все одинаковые подстроки в строке на JavaScript

Представим, что у вас есть строка var str = "Test abc test test abc test test test abc test test abc" и вам нужно заменить все подстроки abc. Метод replace не подойдёт, ведь он заменит только первую подстроку. Как тогда это сделать? Расскажут и покажут в этой статье.

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

@frontend_school #статья #JavaScript
​​Забудьте про div, семантика спасёт интернет

Существует два типа верстальщиков — те, кто используют только div и те, кто использует семантическую вёрстку. Сразу скажем, вторые круче! И в этой статье вы узнаете почему.

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

@frontend_school #статья #HTML
This media is not supported in your browser
VIEW IN TELEGRAM
Когда пытаешься следовать туториалу.

Кстати, сегодня выложим интересный туториал для любителей игр.

@frontend_school #юмор
Flappy Bird и Doodle Jump на JavaScript

Помните эти некогда популярные игры? Кто-то, возможно, в них играет до сих пор. В этом видео автор пошагово вам покажет, как реализовать такие игры на JavaScript.

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

Смотреть видео

@frontend_school #видео #JavaScript #en
​​Что Такое JSON?

JSON (JavaScript Object Notation) — это формат для хранения и обмена информацией, доступной для чтения человеком. Он очень часто используется во фронтенде, если только его не заменяет какой-нибудь XML или YAML, но о них в другой раз.

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

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

@frontend_school #статья #JSON
Есть тут любители светлых тем? Признавайтесь!

@frontend_school #юмор
​​Фронтенд-разработчику: 10 направлений, в которых стоит развиваться в 2021 году

Сегодня недостаточно знать HTML, CSS и JavaScript, чтобы считаться хорошим фронтенд-разработчиком. Существует множество инструментов, которые упрощают создание фронтенда и которые нужно знать, чтобы быть востребованным специалистом.

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

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

@frontend_school #статья
Срочно! Как поставить Emmet на бумагу?!

@frontend_School #юмор
​​DevTools для «чайников»

Данная статья, прежде всего, обращена к тем, кто еще находится в самом начале своего пути к программистскому Олимпу.

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

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

@frontend_school #статья
This media is not supported in your browser
VIEW IN TELEGRAM
3D-самолёт

Интересный проект на CodePen, где автор создал анимацию полёта самолёта. Вы, кстати, можете менять направление полёта простым движением мышки, а клик переключает проект в ночной режим. Из интересного тут библиотека GSAP, а также использование препроцессоров Pug для HTML и Stylus для CSS.

CodePen

@frontend_school #интересное
​​Малоизвестные, но крутые атрибуты в HTML

Все знаю такие HTML-атрибуты, как src, href и прочие, которые применяет каждый фронтенд-разработчик. Но помимо них существуют ещё несколько любопытных, которые не так часто применяются и не так известны, как остальные. В этой статье вы узнаете о некоторых из них.

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

@frontend_school #статья #HTML
This media is not supported in your browser
VIEW IN TELEGRAM
Кнопка на Vue

Отличный пример работы реактивности во Vue — симпатичная кнопка с приятной анимацией. Можете посмотреть код и даже добавить его в свой проект.

CodePen

@frontend_school #интересное
​​БЭМ — соглашение по именованию в CSS

Вообще, БЭМ — это аббревиатура, которая представляет собой сочетание слов «блок», «элемент» и «модификатор». Эта методология предполагает определённый порядок наименования компонентов и вы наверняка столкнётесь с ней при реальной работе.

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

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

@frontend_school #статья #CSS