Forwarded from FrontEndDev
Разработка реактивного гамбургер-меню с помощью React-хуков, TypeScript, и styled-components.
https://medium.com/javascript-in-plain-english/create-your-own-hamburger-menu-using-react-hooks-typescript-and-styled-components-4b2797c4d193
https://medium.com/javascript-in-plain-english/create-your-own-hamburger-menu-using-react-hooks-typescript-and-styled-components-4b2797c4d193
Medium
Reactive hamburger on the menu 🍔
Create your own hamburger menu using React, hooks, TypeScript, and styled-components.
Forwarded from FrontEndDev
recoiljs.org
A state management library for React.
Forwarded from FrontEndDev
Настройка TypeScript для современных проектов на React с использованием Webpack и Babel
https://www.smashingmagazine.com/2020/05/typescript-modern-react-projects-webpack-babel/
https://www.smashingmagazine.com/2020/05/typescript-modern-react-projects-webpack-babel/
Smashing Magazine
Setting TypeScript For Modern React Projects Using Webpack — Smashing Magazine
In this article, Blessing Krofegha introduces Typescript, a superscript of JavaScript that presents the static type feature for spotting common errors as developers codes, which enhances performance, hence results in robust enterprise applications. You’ll…
Forwarded from FrontEndDev
Полный обзор решений для валидации форм React
https://blog.logrocket.com/the-ultimate-roundup-of-react-form-validation-solutions/
https://blog.logrocket.com/the-ultimate-roundup-of-react-form-validation-solutions/
Forwarded from FrontEndDev
Все, что нужно знать о Concurrent Mode в React в 2020 году
https://medium.com/javascript-in-plain-english/everything-you-need-to-know-about-react-concurrent-mode-in-2020-826af48c1f37
https://medium.com/javascript-in-plain-english/everything-you-need-to-know-about-react-concurrent-mode-in-2020-826af48c1f37
Medium
Everything You Need to Know About React Concurrent Mode in 2020
Some exciting changes are coming
Forwarded from FrontEndDev
Подробно о React Router. Часть 1 — основы роутинга, типы и динамические страницы
https://medium.com/@stasonmars/1c159cca6fea
https://medium.com/@stasonmars/1c159cca6fea
Medium
Подробно о React Router. Часть 1 — основы роутинга, типы и динамические страницы
В этой серии статей вы подробно и доходчиво узнаете о том, как работает Router в React, как его можно использовать и другие интересные…
Forwarded from FrontEndDev
Как сделать React-приложение прогрессивным веб-приложением (PWA)
https://felixgerschau.com/how-to-make-your-react-app-a-progressive-web-app-pwa/
https://felixgerschau.com/how-to-make-your-react-app-a-progressive-web-app-pwa/
Felixgerschau
How to Make your React App a Progressive Web App (PWA) | Felix Gerschau
Explaining the most important concepts around PWAs followed by a step by step tutorial, using Webpack, Workbox and TypeScript.
Forwarded from FrontEndDev
12 советов по внедрению TypeScript в React-приложениях
https://habr.com/ru/company/tinkoff/blog/505488/
https://habr.com/ru/company/tinkoff/blog/505488/
Хабр
12 советов по внедрению TypeScript в React-приложениях
TypeScript — стандарт современной фронтенд-разработки. Согласно исследованиям State of JavaScript, TS вызывает явный интерес у программистов. По данным опроса за...
Forwarded from FrontEndDev
Уязвимости безопасности в React, которые вы никогда не должны игнорировать
https://www.simform.com/react-security-vulnerabilities-solutions/
https://www.simform.com/react-security-vulnerabilities-solutions/
Forwarded from FrontEndDev
5 альтернатив React Redux в 2020 году
MobX определенно стоит попробовать 😉
https://blog.bitsrc.io/redux-react-alternatives-c1733793a339
MobX определенно стоит попробовать 😉
https://blog.bitsrc.io/redux-react-alternatives-c1733793a339
Medium
5 Alternatives to React Redux in 2020
Reducing boilerplates and cutting out the middleman with Redux alternatives for React applications.
Forwarded from FrontEndDev
Подробно о React Router - часть 2. Свежий перевод от Стаса Багрецова.
https://medium.com/@stasonmars/ae5ce427d438
https://medium.com/@stasonmars/ae5ce427d438
Medium
Подробно о React Router. Часть 2 — параметры запроса, 404 страница и передача пропсов компоненту роута
Часть 2. Параметры запроса, 404 страница и передача пропсов компоненту роута.
Forwarded from FrontEndDev
YouTube
Рефакторинг реализации Dropdown
Пример рефакторинга реализации Dropdown Menu на хуках и компонентах React.
Рассматриваются хуки useState, useRef, useEffect, кастомный хук, именование переменных.
Beginner-friendly контент :)
Отзывы от моих студентов: https://bit.ly/Mkdev-ivan-kleshnin …
Рассматриваются хуки useState, useRef, useEffect, кастомный хук, именование переменных.
Beginner-friendly контент :)
Отзывы от моих студентов: https://bit.ly/Mkdev-ivan-kleshnin …
Forwarded from FrontEndDev
useSWR – "моя новая любимая библиотека React".
Она позволяет извлекать данные из API или другого внешнего источника, сохранять их в кэше, а затем рендерить.
Какие проблемы она решает и парочка примеров использования в статье.
https://habr.com/ru/company/otus/blog/506158/
Она позволяет извлекать данные из API или другого внешнего источника, сохранять их в кэше, а затем рендерить.
Какие проблемы она решает и парочка примеров использования в статье.
https://habr.com/ru/company/otus/blog/506158/
Хабр
useSWR – моя новая любимая библиотека React
Перевод статьи подготовлен в преддверии старта курса «React.js разработчик». Последние несколько месяцев я работаю над приложением на NextJS. С каждой неделе...
Forwarded from FrontEndDev
Великий раскол в import: проясняем неопределенность с импортом в Typescript или почему надо писать
https://habr.com/ru/company/otus/blog/507104/
* as React from 'react'
https://habr.com/ru/company/otus/blog/507104/
Хабр
Великий раскол в import: проясняем неопределенность с импортом в Typescript
Перевод статьи подготовлен в преддверии старта курса «Разработчик React.js» Я довольно долго работаю с typescript, и у меня было много проблем с тем, чтобы р...
Forwarded from FrontEndDev
React Hook Form VS Formik - что выбрать для работы с формами
https://blog.bitsrc.io/react-hook-form-vs-formik-form-builder-library-for-react-23ed559fdae
https://blog.bitsrc.io/react-hook-form-vs-formik-form-builder-library-for-react-23ed559fdae
Medium
React Hook Form VS Formik
A comprehensive comparison of the two libraries, with examples.
Forwarded from Просто: разработка via @like
Статья о наиболее важных концепциях рендеринга в React, том как он решает повторно выполнить рендеринг компонента. Также очень интересная часть о том, как оптимизировать производительность рендеринга вашего приложения React
https://felixgerschau.com/react-rerender-components
https://felixgerschau.com/react-rerender-components
Felixgerschau
When does React re-render components? | Felix Gerschau
React re-rendering explained and how to optimize React's re-render performance
5 способов документировать React-компоненты
Компоненты делают код гибким и переиспользуемым. Документированные компоненты к тому же делают его понятным и поддерживаемым. Поэтому документируйте ваши компоненты - в 2020 это даже необязательно делать вручную!
Cтатья рассматривает 5 популярных сервисов для удобной работы с компонентами:
👉 Bit
👉 React Styleguidist
👉 React-Docz
👉 React-docgen
👉 Storybook
Примеры установки и использования прилагаются 😉
Читать: https://blog.bitsrc.io/5-ways-to-document-react-components-in-2020-ecf60f24dee8
#tools #components #react
Компоненты делают код гибким и переиспользуемым. Документированные компоненты к тому же делают его понятным и поддерживаемым. Поэтому документируйте ваши компоненты - в 2020 это даже необязательно делать вручную!
Cтатья рассматривает 5 популярных сервисов для удобной работы с компонентами:
👉 Bit
👉 React Styleguidist
👉 React-Docz
👉 React-docgen
👉 Storybook
Примеры установки и использования прилагаются 😉
Читать: https://blog.bitsrc.io/5-ways-to-document-react-components-in-2020-ecf60f24dee8
#tools #components #react
Forwarded from FrontEnd книги для программистов
React Native - Building Mobile Apps with JavaScript
Автор: Vladimir Novick
Год издания: 20
Скачать книгу
#react #english #middle
Автор: Vladimir Novick
Год издания: 20
Скачать книгу
#react #english #middle
Правильный ответ: Все объявления корректны
Свойство content допускает использование самых разных значений и даже их комбинацию.
Пример: https://codepen.io/mohnatus-the-lessful/pen/MWKvRpy
Документация: https://developer.mozilla.org/ru/docs/Web/CSS/content
Подробный разбор свойства content читайте в статье Вот что я не знал о content.
#css
Свойство content допускает использование самых разных значений и даже их комбинацию.
Пример: https://codepen.io/mohnatus-the-lessful/pen/MWKvRpy
Документация: https://developer.mozilla.org/ru/docs/Web/CSS/content
Подробный разбор свойства content читайте в статье Вот что я не знал о content.
#css
CodePen
css content property
...