Веб-страница
22.1K subscribers
2.18K photos
561 videos
2 files
4.46K links
Всё по фронтенду, бэкенду и девопсу в одном месте

Разместить рекламу: @tproger_sales_bot

Правила общения: https://tprg.ru/rules

Другие каналы: @tproger_channels

Сайт: https://tprg.ru/site

Регистрация в перечне РКН: https://tprg.ru/64ai
Download Telegram
​Декларативная валидация данных с помощью функционального программирования и rule-based подхода

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

Подробнее:

https://bespoyasov.ru/blog/declarative-rule-based-validation/
👍11🔥4
​Ускоренное руководство по Fullstack Web3 с ASS (Anchor, Solana и Svelte)

Про Web3 сегодня слышали, пожалуй все, кто связан с IT. Многие пророчат ему светлое будущее и ожидают, что он заменит привычные стандарты работы сети на децентрализованный вариант. Поэтому имеет смысл познакомиться с ним поближе уже сейчас. Эта статья поможет вам разобраться с Web3 на практическом примере, а именно на приложении с популярным стеком Anchor, Solana и Svelte:

https://dev.to/0xmuse/accelerated-guide-to-fullstack-web3-with-ass-anchor-solana-and-svelte-1mg

#web3
❤9👍6😁1
​Распространённые заблуждения о наследовании в JavaScript

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

https://medium.com/devschacht/eric-elliott-common-misconceptions-about-inheritance-in-javascript-f6137fc3a45a

#javascript
👍6😁3👎1
​Как быстро задать уникальный стиль для каждого элемента списка

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

Но на самом деле списки можно сделать более привлекательными, добавив каждому элементу свою иконку. И для этого не потребуются даже псевдоклассы или псевдоэлементы. Посмотрите сами:

https://devdojo.com/basharath/style-each-list-item-css

#css
👍38😁1
​Полное руководство для начинающих по npm

Это действительно большое руководство по npm, которое подробно отвечает на множество вопросов, возникающих у новичков. Руководство состоит из девяти глав, каждая из которых представляет собой отдельную статью с примерами и различными нюансами.

Изучить можно здесь:

https://css-tricks.com/a-complete-beginners-guide-to-npm/

#npm
👍18
​Более 20 полезных компонентов для Vue

Хотите сделать интерфейс вашего приложения на основе Vue уникальным и привлекательным? Сегодня существует множество готовых компонентов, которые позволят вам не только достигнуть желаемого, но и сэкономят ваше время.

Подробнее о них:

https://medium.com/js-dojo/20-useful-vue-js-components-2022-3bf9fbe5b556

#vue
👍8
​Как использовать шаблон проектирования «Адаптер» в React

Если, используя React, вам потребовалось подключить какую-то дополнительную библиотеку, то необходимо убедиться, что они будут нормально взаимодействовать. Для этого можно воспользоваться адаптером — шаблоном проектирования, который позволяет создать «оболочку» вокруг дополнительной библиотеки.

Как это сделать рассказали тут:

https://nuancesprog.ru/p/15479/

#javascript #react
👍9❤1
​5 популярных JavaScript календарей и планировщиков в 2022 году

Многие из нас в качестве одного из первых учебных проектов делали тудушку. Но если говорить о настоящем проекте, то реализовывать для него календарь или список дел с нуля та ещё морока, да и времени уйдёт порядочно. Вместо этого можно воспользоваться одним из уже готовых вариантов, которые предлагают широкий выбор возможностей и настроек, при этом легко интегрируются. Подробнее о них в этой статье:

https://proglib.io/p/5-populyarnyh-javascript-kalendarey-i-planirovshchikov-v-2022-godu-2022-03-05

#javascript
👍31🥰1👏1
​Создание приложения с помощью Electron и Vue

JavaScript — это не только веб-разработка. Сегодня с помощью него можно создавать и полноценные мобильные или десктопные приложения. Для этого есть Electron — среда JavaScript, позволяющая создавать кроссплатформенные приложения. А в связке с Vue это сделать ещё проще. Посмотрите, как веб-разработчик может без особых усилий сделать полноценное приложение:

https://blog.logrocket.com/building-app-electron-vue/

#electron #vue
👍23
​​Децентрализованная конфигурация webpack, или как упростить сборку проекта

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

https://habr.com/ru/company/funcorp/blog/538982/

#webpack
👍4👎1
По скольким пунктам совпадение у вас?
😁60🤔6👍5💩5🥰1
​​Различные способы включения комментариев на ваш статический сайт

Сегодня существует множество способов добавить на ваш сайт комментарии. Это и специализированные сервисы типа Disqus, и комментарии из Вконтакте или Twitter, и проекты с GitHub и многое другое.

Подробнее о каждом способе, их плюсах и минусах можно узнать в этой статье:

https://darekkay.com/blog/static-site-comments/
👍8
​​Что такое Chromium без Chrome

Chrome основан на Chromium с открытым исходным кодом. Chrome — это Chromium с дополнительными функциями Google. Как и Яндекс.Браузер, но уже с дополнительными функциями от Яндекса, или Edge с функциями от Microsoft. Казалось бы, всё просто, но это не так. На самом деле в Chromium гораздо больше функций, завязанных на Google, чем это необходимо, например для Яндекс. И если вы хотите создать свой браузер на Chromium, то готовьтесь к тому, что вам придётся вычистить достаточно много функционала, чтобы получить чистую основу. Подробнее:

https://css-tricks.com/what-is-chromium-without-chrome-on-top/

#chromium
👍22
This media is not supported in your browser
VIEW IN TELEGRAM
Котёнок с клубком

Этот милый котёнок, повисший на клубке, сделан и анимирован без применения JavaScript. Все части композиции сделаны на HTML и стилизованы с помощью SCSS.

Посмотреть код подробнее можно тут:

https://codepen.io/davidkpiano/pen/Xempjq

#codepen #html #css
🔥94👍12👎2
​​Почему пользовательские хуки React могут снизить производительность вашего приложения

Для приложений, чувствительных к производительности, пользовательские хуки React могут очень легко стать самым большим убийцей производительности, если они не написаны и не используются очень осторожно. Почему так происходит и что с этим делать, узнаете здесь:

https://www.developerway.com/posts/why-custom-react-hooks-could-destroy-your-app-performance

#react
👍16👎1
Java уже знает, а со скриптом в процессе разберётся
😁123👍3👎1
​​Полное руководство: Хуки жизненного цикла Angular

Экземпляр компонента в Angular имеет жизненный цикл, который начинается, когда Angular создает экземпляр класса компонента и отображает представление компонента вместе с его дочерними представлениями, а заканчивается, когда Angular уничтожает экземпляр компонента и удаляет его обработанный шаблон из DOM.

В Angular возможно взаимодействовать с компонентами в определённый этап их жизненного цикла, для этого существуют хуки. Как они работают и как ими пользоваться рассказывают здесь:

https://indepth.dev/posts/1494/complete-guide-angular-lifecycle-hooks

#angular
👍11😁2
Bulma против Tailwind CSS: какая альтернатива Bootstrap лучше?

Многие слышали или работали с Bootstrap — CSS-фреймворком, который упрощает разработку, избавляя от необходимости писать лишние CSS стили. Если раньше он был незаменимым инструментом для решения этой задачи, то сегодня у него есть альтернативы, или даже конкуренты. Bulma и Tailwind CSS — два популярных фреймворка, которые пытаются превзойти Bootstrap и избавить разработчиков от некоторых его недостатков.

Какой из них справляется с этим лучше, узнаете в этой статье:

https://blog.logrocket.com/bulma-vs-tailwind-css-better-bootstrap-alternative/

#css #tailwind
👍18❤3🔥1
Полезный совет по условным выражениям JSX

Условные выражения могут быть полезны при работе с JSX, но не всегда ведут себя так, как вы рассчитывали или привыкли при работе с обычным JS. О некоторых нюансах и полезных советах, которые стоит помнить, рассказал Владимир Клепов в своей статье:

https://thoughtspile.github.io/2022/01/17/jsx-conditionals/

#react #jsx
👍24
​​Актуальность TypeScript в 2022 году

Если верить статистике, то TypeScript пережил бурный рост популярности и сейчас находится на плато стабильности. Будет ли его популярность расти неизвестно, ведь даже Microsoft уже высказывается за добавление аннотации типов в ванильном JS. А как мы знаем именно за это TypeScript и ценится. Но если возможность указания типов появится в JS, то нужен ли будет TS?

Автор этой статьи решил порассуждать на эту тему. С его выводами можно ознакомиться здесь:

https://css-tricks.com/the-relevance-of-typescript-in-2022/

#typescript
👍17