Forwarded from Простой JavaScript | Программирование
Object.freeze
Статический метод Object.freeze() замораживает объект. Замораживание объекта предотвращает расширение и делает существующие свойства недоступными для записи и настройки. Замороженный объект больше нельзя изменить: нельзя добавить новые свойства, нельзя удалить существующие свойства, нельзя изменить их перечисляемость, конфигурируемость, возможность записи или значение, а прототип объекта нельзя переназначить.
#практика
Статический метод Object.freeze() замораживает объект. Замораживание объекта предотвращает расширение и делает существующие свойства недоступными для записи и настройки. Замороженный объект больше нельзя изменить: нельзя добавить новые свойства, нельзя удалить существующие свойства, нельзя изменить их перечисляемость, конфигурируемость, возможность записи или значение, а прототип объекта нельзя переназначить.
#практика
Forwarded from JavaScript test
Использование класса для работы с элементами DOM
Класс
JavaScript test
Класс
DOMHelper содержит методы для скрытия и отображения элементов на веб-странице.JavaScript test
Forwarded from Frontender's notes [ru]
🔍Увеличиваем свою производительность в WebStorm / PhpStorm c помощью шаблонов
В этой статье я расскажу, как можно сократить рутинную работу написания кода, используя шаблоны для создания файлов.
Читать...
В этой статье я расскажу, как можно сократить рутинную работу написания кода, используя шаблоны для создания файлов.
Читать...
Forwarded from Веб-страница
Как создать и развернуть библиотеку компонентов Vue в NPM
Если вы в разных проектах используете одну и ту же систему дизайна, эффективнее и быстрее иметь библиотеку компонентов, на которую можно ссылаться для всех ваших компонентов в разных проектах.
В этой статье автор подробно разобрал, как использовать этот лайфхак на практике:
https://habr.com/ru/articles/678274/
#vue
Если вы в разных проектах используете одну и ту же систему дизайна, эффективнее и быстрее иметь библиотеку компонентов, на которую можно ссылаться для всех ваших компонентов в разных проектах.
В этой статье автор подробно разобрал, как использовать этот лайфхак на практике:
https://habr.com/ru/articles/678274/
#vue
Forwarded from Будни разработчика (Sergey Bekharsky)
#статья дня
Скорее даже заметка от Софии Валитовой о порядке применения трансформаций в CSS, но концентрация знаний зашкаливает. В чём же весь вопрос?
Как вы можете помнить, не так давно все современные движки браузеров стали поддерживать определение трансформаций не только в правиле transform, но и в индивидуальных. То есть:
может быть записано как:
Но так ли это на самом деле? И да и нет. В первом случае порядок важен, во втором — нет, он всегда будет
Подробнее — в заметке Софии. Вообще у неё очень много полезного выходит, глубоко копает в спеки.
#css #transform #бородач
Скорее даже заметка от Софии Валитовой о порядке применения трансформаций в CSS, но концентрация знаний зашкаливает. В чём же весь вопрос?
Как вы можете помнить, не так давно все современные движки браузеров стали поддерживать определение трансформаций не только в правиле transform, но и в индивидуальных. То есть:
transform: translateX(20px) rotate(40deg) scale(1.5);
может быть записано как:
translate: 20px;
rotate: 40deg;
scale: 1.5;
Но так ли это на самом деле? И да и нет. В первом случае порядок важен, во втором — нет, он всегда будет
translate👉rotate👉scale. И, естественно, повторяющиеся правила будут схлопнуты. Подробнее — в заметке Софии. Вообще у неё очень много полезного выходит, глубоко копает в спеки.
#css #transform #бородач
Forwarded from Frontend по-флотски 👨💻
This media is not supported in your browser
VIEW IN TELEGRAM
form-sizing: content — одна строчка для авторесайза textarea 😏
На просторах твиттера нашёл свойство form-sizing, но ни MDN, ни caniuse ничего по нему не выдаёт, проверил, и оно работает в Chrome Canary, будем следить🥺
Хотелось бы уже избавиться от JS костылей для контроля высоты
На просторах твиттера нашёл свойство form-sizing, но ни MDN, ни caniuse ничего по нему не выдаёт, проверил, и оно работает в Chrome Canary, будем следить
Хотелось бы уже избавиться от JS костылей для контроля высоты
textarea
CodePenPlease open Telegram to view this post
VIEW IN TELEGRAM
Yes, here are 3 ways to create a multiple layout system with Vue 3
https://itnext.io/3-ways-to-create-a-multiple-layouts-system-vue-3-b24c0736b7bb
#coding
#vue
https://itnext.io/3-ways-to-create-a-multiple-layouts-system-vue-3-b24c0736b7bb
#coding
#vue
Medium
Yes, here are 3 ways to create a multiple layouts system with Vue 3
Layouts are the foundations of medium-to-large websites ou apps.
Forwarded from Senior Frontend Developer | JavaScript, React, HTML & CSS
Измерение веб-перформанса в Airbnb
Какие метрики и каким образом фронтенд-разработчики в Airbnb используют для оценки производительности своего сервиса.
🌐 Ссылка на источник
Какие метрики и каким образом фронтенд-разработчики в Airbnb используют для оценки производительности своего сервиса.
Please open Telegram to view this post
VIEW IN TELEGRAM
Forwarded from FrontEndDev
Разработка приложений для всех категорий пользователей
Основные принципы веб доступности. Как семантическая верстка, дополнительные атрибуты элементов и инструменты для тестирования доступности помогут вам в этом.
https://www.sitepoint.com/designing-for-all-the-basics-principles-of-web-accessibility/
Основные принципы веб доступности. Как семантическая верстка, дополнительные атрибуты элементов и инструменты для тестирования доступности помогут вам в этом.
https://www.sitepoint.com/designing-for-all-the-basics-principles-of-web-accessibility/
Архитектура универсальных веб-приложений
Смелый доклад Глеба Михеева на Innopolis Frontend Meetup о том, почему нативная разработка не нужна, что нет смысла разрабатывать сервисные проекты на нативном стеке, сжигая десятки миллионов, усложняя CI/CD и все процессы выкатки релизов. Смотрите доклад, если интересны ответы на вопросы:
🔸Как натянуть веб на мобилку?
🔸Как это работает?
🔸Какие основные сомнения и сопротивления возникают у разработчиков и какие изменения потребует ваша архитектура, чтобы разрабатывать универсальные веб-приложения?
Смелый доклад Глеба Михеева на Innopolis Frontend Meetup о том, почему нативная разработка не нужна, что нет смысла разрабатывать сервисные проекты на нативном стеке, сжигая десятки миллионов, усложняя CI/CD и все процессы выкатки релизов. Смотрите доклад, если интересны ответы на вопросы:
🔸Как натянуть веб на мобилку?
🔸Как это работает?
🔸Какие основные сомнения и сопротивления возникают у разработчиков и какие изменения потребует ваша архитектура, чтобы разрабатывать универсальные веб-приложения?
YouTube
Innopolis Frontend Meetup: Архитектура универсальных веб-приложений (Глеб Михеев)
Мы боимся разрабатывать универсальные приложения, которые и сайт и мобилка и десктопное приложение
А что если я скажу, что нативная разработка не нужна? Что она мертва, и практически нет никакого смысла разрабатывать сервисные проекты на нативном стеке…
А что если я скажу, что нативная разработка не нужна? Что она мертва, и практически нет никакого смысла разрабатывать сервисные проекты на нативном стеке…
Forwarded from Инструменты программиста
NeoBrutalismCSS — новый взгляд на веб-дизайн
Данный CSS-фреймворк воплощает эстетику необрутализма в веб-разработке, предлагая простой и минималистичный подход к стилизации ваших веб-проектов
Инструмент создан с акцентом на простоту, позволяя избавиться от сложности изучения множества имён классов, как в других фреймворках
Он следует минималистичному подходу, применяя основные стили, основанные на семантике HTML, что делает его удобным для быстрого начала работы и создания современной, необруталистской эстетики
Стоимость: #бесплатно
#web #CSS
Данный CSS-фреймворк воплощает эстетику необрутализма в веб-разработке, предлагая простой и минималистичный подход к стилизации ваших веб-проектов
Инструмент создан с акцентом на простоту, позволяя избавиться от сложности изучения множества имён классов, как в других фреймворках
Он следует минималистичному подходу, применяя основные стили, основанные на семантике HTML, что делает его удобным для быстрого начала работы и создания современной, необруталистской эстетики
Стоимость: #бесплатно
#web #CSS
Forwarded from Laravel World
Запускаем PHP прямо в браузере с помощью WebAssembly
https://www.amitmerchant.com/portable-php-in-the-browser-using-webassembly/
https://www.amitmerchant.com/portable-php-in-the-browser-using-webassembly/
20_JavaScript_Abbreviation_Techniques_To_Improve_Efficiency_by_Xiuer.pdf
4.5 MB
20 методов сокращения JavaScript для повышения эффективности
Сокращение кода — это компромисс между производительностью и удобочитаемостью.
Читайте подробнее, если вас не раздражает что-то вроде этого:
Сокращение кода — это компромисс между производительностью и удобочитаемостью.
Читайте подробнее, если вас не раздражает что-то вроде этого:
let arr = [12, null, 0, 'xyz', null, -25, NaN, '', undefined, 0.5, false];File Validation using MD5 and SHA-256 in Node.js
https://www.linkedin.com/pulse/file-validation-using-md5-sha-256-nodejs-emerson-souza/
#coding
#node
https://www.linkedin.com/pulse/file-validation-using-md5-sha-256-nodejs-emerson-souza/
#coding
#node
Linkedin
File Validation using MD5 and SHA-256 in Node.js
The Crypto Library in Node.js is a core module that offers cryptographic functionalities, including hashing algorithms like MD5 (Message Digest Algorithm 5) and SHA-256 (Secure Hash Algorithm 256-bit).
Forwarded from Node.JS [ru] | Серверный JavaScript
🛍Автоматическая публикация npm пакета из gitlab ci/cd
В этой статье я расскажу как реализовать автоматическую публикацию npm пакета в cicd gitlab, с помощью каких инструментов мы генерируем CHANGELOG файл и обновляем версию package.json.
Читать...
В этой статье я расскажу как реализовать автоматическую публикацию npm пакета в cicd gitlab, с помощью каких инструментов мы генерируем CHANGELOG файл и обновляем версию package.json.
Читать...
Forwarded from Веб-страница
Веб-компоненты в 2023
Большинство фронтенд-разработчиков не понимают, что такое веб-компоненты и зачем они нужны. Стандарту уже несколько лет, но разработчики продолжают его игнорировать.
Автор, который занимается веб-разработкой уже 20 лет и сейчас возглавляет команду по созданию открытой платформы на основе веб-компонентов, решил поделится опытом и раскрыть мифы об этой технологии.
#html #dom
Большинство фронтенд-разработчиков не понимают, что такое веб-компоненты и зачем они нужны. Стандарту уже несколько лет, но разработчики продолжают его игнорировать.
Автор, который занимается веб-разработкой уже 20 лет и сейчас возглавляет команду по созданию открытой платформы на основе веб-компонентов, решил поделится опытом и раскрыть мифы об этой технологии.
#html #dom
Object Oriented Programming Expert With TypeScript
https://github.com/jafari-dev/oop-expert-with-typescript
#coding
#typescript
https://github.com/jafari-dev/oop-expert-with-typescript
#coding
#typescript
GitHub
GitHub - jafari-dev/oop-expert-with-typescript: A complete guide for learning object oriented programming pillars, SOLID principles…
A complete guide for learning object oriented programming pillars, SOLID principles and design patterns with TypeScript! - jafari-dev/oop-expert-with-typescript
15 Killer Websites for Web Developers.pdf
2.5 MB
🤩 15 полезных сайтов, которые упростят вашу работу и не только: подборка для фронтенд-разработчика
✹ Визуализация регулярных выражений JavaScript
✹ Документация для разработчиков: онлайн + офлайн
✹ cdnjs: поиск библиотек с открытым исходным кодом
✹ Фотосток с огромной коллекцией изображений
✹ Интеллектуальное сжатие WebP, PNG и JPEG
✹ Удаление фона изображения
✹ Создание красивых изображений с исходным кодом
✹ Подбор палитры цветов для разработки дизайна
✹ Тестирование и демонстрация сниппетов на основе HTML, CSS и JavaScript
✹ Иконки с открытым исходным кодом
✹ Проверка совместимости CSS и JavaScript в различных популярных браузерах
✹ Создание файла README
✹ Проверка производительности сайта
✹ Редактирование фотографий
✹ Подборка иллюстраций без лицензии
👉 Читайте подробнее на Medium или в PDF
✹ Визуализация регулярных выражений JavaScript
✹ Документация для разработчиков: онлайн + офлайн
✹ cdnjs: поиск библиотек с открытым исходным кодом
✹ Фотосток с огромной коллекцией изображений
✹ Интеллектуальное сжатие WebP, PNG и JPEG
✹ Удаление фона изображения
✹ Создание красивых изображений с исходным кодом
✹ Подбор палитры цветов для разработки дизайна
✹ Тестирование и демонстрация сниппетов на основе HTML, CSS и JavaScript
✹ Иконки с открытым исходным кодом
✹ Проверка совместимости CSS и JavaScript в различных популярных браузерах
✹ Создание файла README
✹ Проверка производительности сайта
✹ Редактирование фотографий
✹ Подборка иллюстраций без лицензии
👉 Читайте подробнее на Medium или в PDF
🤔 После выхода достаточно революционной в плане добавления Composition API версии Vue 3.0 более чем три года назад, каких-либо серьезных изменений от команды Evan You в самом фреймворке больше не было. Только стандартные багфиксы, оптимизация и робкие попытки стать с TypeScript ближе.
💡Основное внимание переключилось на экосистему — Vite, Nuxt, VitePress, Pinia и другие. В то же время, отчетливо заметно масштабирование работы не вглубь, а вширь. Интересы команды уже давно явно выходят за пределы фреймворка.
📈 Об этом и идет речь в статье. Автор разбирается с трендами развития Vite, Anthony Fu и VitePress, анализирует тренды/рынок вакансий и рекомендует перевод книги «Vue.js 3 — Шаблоны проектирования и лучшие практики».
💡Основное внимание переключилось на экосистему — Vite, Nuxt, VitePress, Pinia и другие. В то же время, отчетливо заметно масштабирование работы не вглубь, а вширь. Интересы команды уже давно явно выходят за пределы фреймворка.
📈 Об этом и идет речь в статье. Автор разбирается с трендами развития Vite, Anthony Fu и VitePress, анализирует тренды/рынок вакансий и рекомендует перевод книги «Vue.js 3 — Шаблоны проектирования и лучшие практики».