Стайлгайд по красивым и информативным сообщениями коммитов
https://gist.github.com/stephenparish/9941e89d80e2bc58a153
#git #styleguide #коммиты
https://gist.github.com/stephenparish/9941e89d80e2bc58a153
#git #styleguide #коммиты
Gist
Git Commit Message Conventions
Git Commit Message Conventions. GitHub Gist: instantly share code, notes, and snippets.
🌚🌚🌚
> 'yoba' && 'peka' === 'peka'
< true
> let f = (x) => x * 2
> f`22`
< 44
> 'yoba' && 'peka' === 'peka'
< true
> let f = (x) => x * 2
> f`22`
< 44
switch как вариант if-а:
switch (true) {
case Boolean(someString.match('yoba')):
return 'It is Yoba!';
case Boolean(someString === '666'):
return 'It is devil!';
default:
return 'idn';
}
switch (true) {
case Boolean(someString.match('yoba')):
return 'It is Yoba!';
case Boolean(someString === '666'):
return 'It is devil!';
default:
return 'idn';
}
Пересечение (intersection) типов в TypeScript:
https://gist.github.com/Ibro/262ee343ea3a2a244ec76b44f6723713
#typescript #types #intersection #типы
https://gist.github.com/Ibro/262ee343ea3a2a244ec76b44f6723713
#typescript #types #intersection #типы
Gist
TypeScript - intersection types simple example
TypeScript - intersection types simple example. GitHub Gist: instantly share code, notes, and snippets.
Объемный курс по тестированию приложений на реакте. Еще действует хорошая скидка: всего $12 вместо 100. Если надо и на скидку не успеется, могу поделиться аккаунтом или выкачать видео.
https://www.udemy.com/react-tdd/
#react #test #testing #jest #enzyme
https://www.udemy.com/react-tdd/
#react #test #testing #jest #enzyme
Udemy
React - Mastering Test Driven Development
Upgrade your React skills with Test Driven Development! Jest, Enzyme, Redux, middleware, ES6, & more!
Двигай лягушку
@
Изучай flexbox
Важнейшее нововведение CCS3 на интерактивных примерах https://flexboxfroggy.com/
#css #flexbox #css3 #grid
@
Изучай flexbox
Важнейшее нововведение CCS3 на интерактивных примерах https://flexboxfroggy.com/
#css #flexbox #css3 #grid
Flexboxfroggy
Flexbox Froggy
A game for learning CSS flexbox
Гайд как правильно расставлять margin и padding
https://habrahabr.ru/post/340420/
#css #margin #padding
https://habrahabr.ru/post/340420/
#css #margin #padding
Хабр
Организация отступов в верстке (margin/padding)
Цель этой статьи не усложнить простые вещи, а акцентировать внимание на известных стандартах, о которых почему-то забывают. Важно соблюдать осмысленную структу...
Подборка на русском по теме react+redux.
1. Коротко о том, что такое flux-архитектура и причем тут redux. С картинками :)
https://habrahabr.ru/company/hexlet/blog/268249/
2. Примеры имплементации flux-архитектуры или "пишем свой redux". Читать для понимания как работает и как оно примерно выглядит изнутри.
https://code.tutsplus.com/ru/tutorials/getting-started-with-the-flux-architecture-in-react--cms-28906
http://css-live.ru/articles/vnikaem-v-mexanizmy-redux-delaya-svoyo-xranilishhe-store.html
3. Пример использования redux в связке с react:
https://getinstance.info/articles/react/learning-react-redux/ простейший пример
https://maxfarseer.gitbooks.io/redux-course-ru/content/ более подробный и глубокий
4. Также понадобится библиотека для работы с сайд-эффектами, одна простейших это redux-thunk, одна из мощнейших - redux-saga:
https://github.com/rajdee/redux-in-russian/blob/master/docs/advanced/AsyncActions.md
Немного про саги: https://www.moscowjs.ru/talk/redux-saga-na-steroidah и https://github.com/redux-saga/redux-saga/blob/master/README_ru.md но лучше читать документацию.
5. И еще никуда без reselect: https://medium.com/devschacht/neil-fenton-improving-react-and-redux-performance-with-reselect-40f1d3efba89
1. Коротко о том, что такое flux-архитектура и причем тут redux. С картинками :)
https://habrahabr.ru/company/hexlet/blog/268249/
2. Примеры имплементации flux-архитектуры или "пишем свой redux". Читать для понимания как работает и как оно примерно выглядит изнутри.
https://code.tutsplus.com/ru/tutorials/getting-started-with-the-flux-architecture-in-react--cms-28906
http://css-live.ru/articles/vnikaem-v-mexanizmy-redux-delaya-svoyo-xranilishhe-store.html
3. Пример использования redux в связке с react:
https://getinstance.info/articles/react/learning-react-redux/ простейший пример
https://maxfarseer.gitbooks.io/redux-course-ru/content/ более подробный и глубокий
4. Также понадобится библиотека для работы с сайд-эффектами, одна простейших это redux-thunk, одна из мощнейших - redux-saga:
https://github.com/rajdee/redux-in-russian/blob/master/docs/advanced/AsyncActions.md
Немного про саги: https://www.moscowjs.ru/talk/redux-saga-na-steroidah и https://github.com/redux-saga/redux-saga/blob/master/README_ru.md но лучше читать документацию.
5. И еще никуда без reselect: https://medium.com/devschacht/neil-fenton-improving-react-and-redux-performance-with-reselect-40f1d3efba89
Habr
Flux в картинках
Нам в Хекслете нравится ReactJS и Flux. Нам кажется, что это правильное направления развития. Мы любим функциональное программирование и чистые функции, и когда сложные архитектуры упрощаются за счет...
Наиболее исчерпывающие курсы на английском по реакт-редаксу по от самого создателя редакса - Дэна Абрамова
https://egghead.io/courses/getting-started-with-redux
https://egghead.io/courses/building-react-applications-with-idiomatic-redux
#react #redux #courses #course #egghead
https://egghead.io/courses/getting-started-with-redux
https://egghead.io/courses/building-react-applications-with-idiomatic-redux
#react #redux #courses #course #egghead
egghead
Fundamentals of Redux Course from Dan Abramov
In this comprehensive tutorial, Dan Abramov - the creator of Redux - will teach you how to manage state in your React application with Redux.
State man...
State man...
Как перестать страдать из-за обилия точек и сделать из
вот это
?
Другими словами — настроить поддержку абсолютных путей.
1. tsconfig.json для TypeScript, jsconfig.json для JS:
2. webpack.config.js
где
3. package.json
Настройка автоимпортов в WebStorm:
File → Settings → Code Style → Typescript → Import → Use path relative to tsconfig.json
или для JS:
File → Settings → Code Style → JavaScript → Import → Use path relatives to the project
Если вдруг не заработало:
ПКМ на папке src → mark directory → as resource root
Vscode, atom, sublime дополнительной настройки не требуют.
#webpack #javascript #typescript #webstorm #import #autoimport #absolutepath
import * as actionCreators from '../../../../../store/actions';вот это
import * as actionCreators from 'features/auth/store/actions';?
Другими словами — настроить поддержку абсолютных путей.
1. tsconfig.json для TypeScript, jsconfig.json для JS:
"baseUrl": "./src"2. webpack.config.js
resolve: {
modules: ['node_modules', srcPath]
}где
srcPath абсолютный путь до директории src.3. package.json
"baseDir": "src"Настройка автоимпортов в WebStorm:
File → Settings → Code Style → Typescript → Import → Use path relative to tsconfig.json
или для JS:
File → Settings → Code Style → JavaScript → Import → Use path relatives to the project
Если вдруг не заработало:
ПКМ на папке src → mark directory → as resource root
Vscode, atom, sublime дополнительной настройки не требуют.
#webpack #javascript #typescript #webstorm #import #autoimport #absolutepath
Окончательный ответ на вопрос, как же все-таки следует передавать коллбеки в компонент.
https://habrahabr.ru/company/tuturu/blog/348584/
#react #performance
https://habrahabr.ru/company/tuturu/blog/348584/
#react #performance
Хабр
Как избежать проблем с производительностью при создании React-приложений
О производительности react React не зря считается очень производительным фреймворком. Он позволяет создавать быстрые динамические страницы с большим количеством...