Получи случайную криптовалюту за регистрацию!

ежица-разработчица

Логотип телеграм канала @front_hedgehog — ежица-разработчица Е
Логотип телеграм канала @front_hedgehog — ежица-разработчица
Адрес канала: @front_hedgehog
Категории: Софт, приложения
Язык: Русский
Количество подписчиков: 84
Описание канала:

про frontend

Рейтинги и Отзывы

2.00

2 отзыва

Оценить канал front_hedgehog и оставить отзыв — могут только зарегестрированные пользователи. Все отзывы проходят модерацию.

5 звезд

0

4 звезд

0

3 звезд

0

2 звезд

2

1 звезд

0


Последние сообщения

2022-11-10 19:38:28
Установка пакетов, использование npm, yarn

Привет! При разработке проекта часто нужны сторонние программы (packages). Например, сборщики проекта, оптимизаторы контента.

How to use it?

Написала инструкцию по использованию менеджеров пакетов (в общих чертах, самые основные команды).

Только об npm и yarn, с pnpm у меня пока нет опыта. Важно: протестировано пока только в Windows, в Linux могут быть какие-то особенности.

Документация:
npm
yarn
pnpm
64 viewsНадежда Вильбоа, edited  16:38
Открыть/Комментировать
2022-11-07 11:51:17
Emmet Abbreviation

Как я верстала раньше? — Я набирала символ за символом:
...

С emmet я набираю:
.content-wrapper и получаю
с нужным классом
ul.categories-list>li.categories-list__item*3 и получаю список с классом и тремя вложенными пунктами с классами
в стилях dn - получаю display: none;
в стилях m10-20 получаю margin: 10px 20px;

Важно: после ввода нажимаем Enter

Работает без установки плагинов в:
- Vs Code,
- PHP Storm,
- WEB Storm,
но в каких-то редакторах, возможно, может потребоваться установить плагин Emmet Abbreviation

Документация: https://docs.emmet.io/abbreviations/
Еще две статьи-руководства:
https://skillbox.ru/media/code/uskoryaem-vyerstku-ispolzuya-emmet/
https://code.visualstudio.com/docs/editor/emmet
101 viewsНадежда Вильбоа, edited  08:51
Открыть/Комментировать
2022-11-05 13:22:42 Галерея, адаптивная сетка
По мотивам видео с галереей игровых картинок, сделала свою версию:

500 блоков случайного цвета
каждый второй - вертикальный, каждый пятый - горизонтальный
адаптивная сетка, grid

Опубликованная страница
Открытый репозиторий
99 viewsНадежда Вильбоа, edited  10:22
Открыть/Комментировать
2022-11-05 12:43:34
input[type="range"], кроссбраузерные стили
Тип инпута, в котором значение выбирается с помощью ползунка:

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

Существуют генераторы стилей для этого элемента — генератор ниже позволяет задать стили с префиксами для:
всего инпута: общую высоту и класс
track, trumb, progress: цвет, цвет границы, размер, цвета для состояний :hover и :active, в том числе градиент
другие параметры

https://toughengineer.github.io/demo/slider-styler/slider-styler.html
97 viewsНадежда Вильбоа, edited  09:43
Открыть/Комментировать
2022-11-04 22:29:51
#ит_юмор
91 viewsНадежда Вильбоа, edited  19:29
Открыть/Комментировать
2022-11-02 18:09:00 Верстка, базовый код
Вы создали index.html и style.css, как быстро написать заглавные теги? — VS Code позволяет это сделать за 1 минуту!

В index.html введите восклицательный знак и нажмите Tab. У вас есть базовые теги.
Теперь в конце , перед закрывающим введите link:css - вы только что подключили стили.






Document





108 viewsНадежда Вильбоа, edited  15:09
Открыть/Комментировать
2022-11-02 15:04:25 Типы данных js, NaN
NaN не равен самому себе. Мы нашли её! Штука, которая не равна сама себе, она существует!
Если при вычислениях произошла ошибка, или например неудачно преобразовали строку в число, мы можем получить значение NaN.
Если мы поставим проверку, на равенство(1) или не равенство(2) вычислений NaN, то мы получим бесполезную проверку, потому что условие никогда не будет верно(1) или всегда будет выполняться(2). Потому что NaN не равен NaN.
Не верите? console.log(NaN === NaN);

При этом, есть функция isNaN, с помощью которой можно проверить, что что-то равно NaN.
isNaN(NaN) равен true.

Документация: https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/NaN
102 viewsНадежда Вильбоа, edited  12:04
Открыть/Комментировать
2022-11-02 14:58:28 Галерея, адаптивная верстка
Есть три типа блока: длинный, узкий, маленький. Фон у каждого картинка, содержимого нет. Задача: сделать адаптив, т.е. верстку с сохранением пропорций при изменении ширины экрана.
При добавлении картинок она перестраивается так, чтобы внешний вид сохранялся.
Подробный разбор, длительность видео 1 час:


89 viewsНадежда Вильбоа, edited  11:58
Открыть/Комментировать
2022-10-31 00:43:54
#ит_юмор
89 viewsНадежда Вильбоа, edited  21:43
Открыть/Комментировать
2022-10-28 19:58:16 Песочница с кодом
Если нужно просто проверить какие-то гипотезы, бывает нужен онлайн-редактор кода.
В данном редакторе вы можете выбрать фреймворк и работать, как с приложением на react, vue и тд, чистый js, возможно с версткой, bootstrap, scss, jquery и многое другое
https://playcode.io/
95 viewsНадежда Вильбоа, edited  16:58
Открыть/Комментировать