Webchic - frontend, backend, ci/cd
995 subscribers
273 photos
22 videos
1.11K links
Канал о Web разработке, для фронтов и full stack.

По рекламе @adtgassetsbot
Admin: @Aleksei

🐍Python - @python_lounge
👨‍💻Другие языки - @cccoding
🥷Хакер/ИТ безопасность - @it_ha
Download Telegram
​​Вместо background лучше использовать background-color , если требуется поменять только цвет фона. В целом разницы никакой но на code review могут придираться

🔴 Не так
.example {
background: tomato;
}

✅ Вот так
.example {
background-color: tomato;
}
​​console.trace();

Выводит трассировку стека в консоль.

function foo() {
function bar() {
console.trace();
}
bar();
}
foo();

В консоли отобразится следующая трассировка:

bar
foo
<anonymous>
​​HTML <base> Тэг

<base> тег определяет базовый URL для всех относительных URL - адресов в документе.
В документе может быть только один единственный <base> элемент, и он должен находиться внутри элемента <head>.

Пример:
<head>
 <base href="https://www.some-website.com/">
</head>

<body>
<img src="images/stickman.gif">
<a href="article/about-us">About us</a>
</body>
​​Проверка наличия свойства в объекте JS

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

Чтобы узнать, определен ли в объекте некоторый ключ, нужно использовать оператор in.

const person = { name: 'John Doe', salary: 1000 };
console.log('salary' in person); // true
console.log('age' in person); // false

Он возвращает true или false, в зависимости от того, удалось ли найти требуемое поле.
​​UI-компоненты для React: топ-10 библиотек и фреймворков

Пользовательский интерфейс — это «вау!»-фактор любого приложения. Что касается React-приложений, UI может быть довольно сложным. В этой статье мы собрали лучшие библиотеки и фреймворки, содержащие компоненты UI для React-приложений. Они точно пригодятся вам при создании пользовательских интерфейсов.

Читать...
​​☕ Angular must die: фреймворк обходится компаниям в миллиарды долларов

Angular усложняет разработку UI и увеличивает расходы компаний. Пора от него избавиться?

Статья
​​Самопаркующаяся тачка в 500 строк кода
С помощью генетического алгоритма натренируем тачку парковаться самостоятельно.

Статья
​​DOM, который построил Chrome. Или не построил? Или не Chrome? Или не DOM?

Обычный, теневой, виртуальный, инкрементальный… Как получилось, что простой программный интерфейс доступа к элементам веб-страниц обзавелся таким количеством «родственников»? Чем современные фреймворки не устраивает стандартная объектная модель документа или просто DOM? Что и как на самом деле отрисовывает браузер в процессе рендера веб-страницы?

Статья
​​☕ ТОП-10 актуальных книг по JavaScript на русском языке: от новичка до профессионала

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

Статья
Webchic - frontend, backend, ci/cd pinned «​​🔥🔥Toп 8 Расширений VSCode. 1. JavaScript (ES6) Code Snippets - предоставляет сниппеты кода JS, TS, Vue, React и HTML. 2. Live Server - обеспечивает просмотр вашего веб-приложения в реальном времени прямо в редакторе. 3. Prettier - Code formatter - выполняет…»
​​🔥🔥Toп 8 Расширений VSCode.

1. JavaScript (ES6) Code Snippets - предоставляет сниппеты кода JS, TS, Vue, React и HTML.

2. Live Server - обеспечивает просмотр вашего веб-приложения в реальном времени прямо в редакторе.

3. Prettier - Code formatter - выполняет форматирование кода JS, CSS и HTML.

4. Better Comments - создаёт более понятные и удобные для чтения комментарии.

5. Bracket Pair Colorizer - Это расширение позволяет идентифицировать совпадающие скобки по цвету.

6. Path Intellisense - Это расширение ускоряет разработку за счет автозаполнения имен файлов при импорте.

7. Debugger for Chrome - Это расширение добавляет дебаггер прямо в IDE.

8. Git Lens - это плагин VSC, расширяющий возможности git.
​☕️ Распространенные алгоритмы и структуры данных в JavaScript: основные понятия и работа с массивами

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

статья
​Бандлинг всего того, что не относится к обычному JavaScript-коду

Предположим
, вы работаете над веб-приложением. В таком случае весьма вероятно то, что вам приходится иметь дело не только с JavaScript-модулями, но и с самыми разными другими ресурсами. Это и веб-воркеры (их тоже пишут на JavaScript, но они обособлены от обычного кода фронтенда), и изображения, и стили, и шрифты, и WebAssembly-модули, и иные материалы, входящие в состав сайта.

Статья
​🕸 7 технологий веб-разработки, на изучение которых я зря потратил время

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

Статья
React: простое и эффективное решение для управления состоянием приложений


В
этом небольшом "туториале" я хочу показать вам, как реализовать простое, но эффективное решение для управления состоянием React-приложений.
Немного забегая вперед, скажу, что решение получилось чуть менее производительным, чем "классическое" сочетание хука useReducer() и инструментов, предоставляемых Context API (которые, собственно, и составляют ядро решения).

Статья
PWA: управление service-worker'ом

То есть, код service worker'а более стабилен по сравнению с кодом приложения и во многих случаях для его "обновления" достаточно программно обнулить кэш-хранилище браузера и обновить "понимание того, к какому ресурсу какую стратегию применять" - обновить конфигурацию service worker'а. А для этого нужно приложению нужно иметь возможность каким-то образом управлять состоянием service worker'а и передавать ему данные, что осложняется тем, что приложение и service worker работают в различных потоках.

Статья
​Самосохраняющийся компонент выбора

Недавно
Бхарат Рави опубликовал статью о директиве самосохраняющегося select-элемента на InDepth. Это интересная концепция изолирования логики в директиве, что в целом идея хорошая.
Однако в этом случае у меня есть сомнения, которые я хочу подсветить. Я предлагаю свою версию компонента, исправляющую эти моменты. Начнем с того, что назовем проблемы текущего решения.

Статья
​Обзор Chrome DevTools. Решаем основные задачи веб-разработчика

Возможности Chrome DevTools огромны. С их помощью можно изменять анимацию, проверять доступность, отлавливать ошибки, следить за производительностью сайта и выполнять многие другие задачи. Но на начальных этапах обучения веб-разработке не обязательно разбираться со всеми функциями. Достаточно знать набор базовых инструментов, который понадобится для решения повседневных задач.

Статья
99% людей живут как унылые овощи. Почему?

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

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

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

г) Вы НИКОГДА не страдаете, способны полюбить и разлюбить кого угодно просто по желанию.

Каждый пункт — естественное состояние человека... Которое у вас ОТНЯЛИ.

Верните Реальную Свободу — прямо сейчас подпишитесь на канал https://t.me/freeman365

Начните с ядерного очищения информационного пространства с этим постом.

Этот отбитый парень пробует на себе ВСЁ, что вы читали в якобы «духовной» литературе, а потом просто закинули на полку.

Весь бред про «блаженное блаженство», «утренние медитации», «эффективность, продуктивность» и прочую «асознаность» он переводит на конкретный практический язык: https://t.me/freeman365
​Сколько стоит держать 100 запросов в секунду в Azure на .NET Core MVC и MSSQL

Эта
пятничная история началась еще пять лет назад. Один мой друг, который в то время помогал запускаться разным стартапам, пожаловался на производительность базы данных, размещенной в Azure. По его словам, они провозились почти все выходные, но добиться приемлемого времени отклика от БД им не удалось, несмотря на все попытки. Даже переход на существенно более дорогой тариф не принес ощутимых результатов. Помню, я тогда еще подумал, что было бы неплохо протестировать все это самому, но времени не было и идея осталась не реализованной, хотя сам разговор я запомнил хорошо.
Статья
​Fast Reverse Proxy как альтернатива Ngrok

Создание общедоступного URL в сети интернет к вашему локальному проекту

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