Переключаем режим редактирования для всего документа

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

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

document.designMode="on"

👉 @byFrontDeveloper | #лайфхак

Emmet Cheat Sheet — сайт-шпаргалка для Emmet. Здесь собраны все аббревиатуры и формулы, при написании которых раскрываются большие куски кода, а это очень ускоряет разработку сайта.

🔗 Ссылка: https://docs.emmet.io/cheat-sheet/

👉 @byFrontDeveloper | #ресурс

Всплывающее уведомление с индикатором выполнения

Реализовано на HTML, CSS и JS

🔗 Код: Codepen

👉 @byFrontDeveloper | #код

Учим Flexbox, уничтожая зомби - это же надо было так заморочиться :)

Изначально ценник на этот курс/игру был $179, сейчас в свободном доступе

🔗 Ссылка: https://flexboxzombies.com/p/flexbox-zombies

👉 @byFrontDeveloper | #игры

Мини курс по Fullstack-разработке [2023]

В этом плейлисте вы разработаете Fullstack приложение на NestJS, ReactJs, PostgreSQL,TypeScript.

📺 Cсылка на курс: YouTube

👉 @byFrontDeveloper | #курсы #Fullstack

Разработка веб-приложений на WordPress. 2-е издание

Авторы: Б. Мессенленер, Д. Коулман
Год: 2021

🔗 Скачать книгу

👉 @byFrontDeveloper | #книги

Уверен, каждый начинающий HTML-верстальщик, время от времени задаётся вопросом, можно ли вкладывать какой-либо HTML-тег в другой. Например, можно ли вложить img или div в тег абзаца p

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

🔗 Ссылка: https://caninclude.glitch.me/

👉 @byFrontDeveloper | #ресурс

Animate.css — это библиотека готовых к использованию кроссбраузерных анимаций для ваших проектов

🔗 Ссылка: https://animate.style/

👉 @byFrontDeveloper | #ресурс

Animated Movie Card

Реализовано на HTMLи CSS

🔗 Код: Codepen

👉 @byFrontDeveloper | #код

JavaScript Visualizer 9000 — потрясающий инструмент, позволяющий наглядно видеть порядок выполнения JavaScript кода

Можно выбрать из предлагаемых примеров или запустить выполнение своего кода (думаю, часто встречали такие задачи - "в каком порядке выполнится код?")

Очень полезно для понимания JavaScript в целом

🔗 Ссылка: https://www.jsv9000.app/

👉 @byFrontDeveloper | #ресурс

Система контроля версий - GIT

Искали полный курс по GIT? Вы его нашли. Step-by-step на простых примерах вы узнаете все необходимое

📺 Cсылка на курс: YouTube

👉 @byFrontDeveloper | #курсы #GIT

Retro Gadgets — это симулятор для инженера - программиста, где вы собираете совершенно любой гаджет. Программируете вы все это дело на языке Lua, во встроенном редакторе и после чего, загружаете код на виртуальный ЦП

🔗 Ссылка: https://www.retrogadgets.game/

👉 @byFrontDeveloper | #игры

TypeHero — платформа для изучения TypeScript на практике с готовыми задачами и возможностью создания собственных задач

🔗 Ссылка: https://typehero.dev

👉 @byFrontDeveloper | #ресурс

Анимация смены текста

Реализовано на HTML, CSS и JS

🔗 Код: Codepen

👉🏿 @byFrontDeveloper | #код

TIS-100 - это логическая игра, где вы выступаете в роли программиста на Assembler, пытающегося исправить код компьютерной системы с одноименным
названием

🔗 Ссылка: https://gamestracker.org/torrents/0-0-0-7488-20

👉🏿 @byFrontDeveloper | #игры

Гид по JavaScript для начинающих - это невероятно титанический труд, да еще и в бесплатном доступе. Гид написан на простом английском - дополнительная мотивация и возможность подтянуть свой английский:)

🔗 Ссылка: https://wesbos.com/javascript

👉🏻 @byFrontDeveloper | #ресурс

Git и GitHub для начинающих [2024]

В этом плейлисте ознакомитесь с системой контроля версий и научитесь с ней работать. Будете использовать Git, а хранить свои репозитории будете на GitHub. Подробно и на примерах покажут как работать с Git и GitHub

📺 Cсылка на курс: YouTube

👉 @byFrontDeveloper | #курсы

Шпаргалка по БЭМ, на которой можно наглядно посмотреть структуру часто используемых компонентов вёрстки, и варианты наименования таких компонентов и их дочерних элементов

🔗 Ссылка: https://9elements.com/bem-cheat-sheet/

👉🏻 @byFrontDeveloper | #ресурс