Prettier работающий под любой ОС из консольки.
1. В package.json в scripts добавляем:
"prettier": "cross-env prettier --write 'src/**/*.{js,ts,tsx}'",
2. npm run prettier
3. ??????
4. PROFIT!!!
#css #prettier #windows

Восстановление удаленных/потерянных/проебанных коммитов/веток в git:
git reflog
git reset head@{номер из reflog}
#git #reglog

https://docs.google.com/presentation/d/1hvnPpsJo44BTPfJx28CV95vqk_dt6na1awUbk0kmZYM/edit#slide=id.g3e31444916_0_48
#html5 #details

https://www.checklist.design
#design #ui #ux #ui/ux

Как переименовать файл с помощью mv без необходимости вводить путь дважды? Я джва года искал этот способ!
mv screens/Suppliers/Card/Presence/{фдд,all}.csv
#unix #bash #mv #magick #tips #lifehack #shell

FiraCode - шрифт с лигатурами. Легко устанавливается на Mac и работает под VS Code.
https://github.com/tonsky/FiraCode
#fonts #font #ide #vscode #fira

Быстро ставим fzf плагин для oh-my-zsh, чтобы иметь мега-крутой поиск по истории команд в консольке нажатием на Ctrl+R:

(линк: https://github.com/junegunn/fzf)

brew install fzf

echo export FZF_BASE=/usr/local/opt/fzf >> .zshrc

#terminal #console #macos #mac #iterm #zsh #ohmyzsh #fzf #shell #zsh #bash

Самый функциональный шелл для консоли это, несомненно, zsh и легендарный конфиг для него: https://github.com/robbyrussell/oh-my-zsh
Тут есть всё: плагины, и мощное автодополнение всего и вся, алиасы для git, npm, yarn... а так же огромный набор темок.
1. Устанавливаем сам zsh
sudo apt-get install zsh
или
brew install zsh
2. Затем oh-my-zsh
sh -c "$(curl -fsSL https://raw.githubusercontent.com/robbyrussell/oh-my-zsh/master/tools/install.sh)"
Во время установки будет запрошен пароль - для установки zsh как шелл по-умолчанию, затем перезагружаем компьютер или делаем логаут и заходим в систему заново для применения изменений.
3. Мой список используем плагинов, оставляем по желанию:
plugins=(git node emacs python cp command-not-found colorize fzf brew cabal docker docker-compose dotenv gitignore iterm2 npm perl vscode ufw sudo stack screen zsh-autosuggestions)
Ищем соответствующую строчку в ~/.zshrc и обновляем.
3.1. Чтобы заработал zsh-autosuggestions, устанавливаем его отдельно:
git clone https://github.com/zsh-users/zsh-autosuggestions $ZSH_CUSTOM/plugins/zsh-autosuggestions
3.2. Чтобы заработал fzf, далем как здесь:
https://t.me/node_modules/56

#terminal #console #macos #mac #iterm #zsh #ohmyzsh #fzf #shell #zsh #bash

zsh-autosuggestion, по нажатию на Ctrl+E вбивает всю строку

Мощная темка под oh-my-zsh и iterm для настоящих космонавтов https://github.com/denysdovhan/spaceship-prompt 🌚🌚💫

0. А ЗАЧКМ? Умеет подсвечивать текущий статус git репозитория, версию node, docker и еще кучу всякого интересного.

1. Сперва инсталлим powerline шрифт https://github.com/powerline/fonts например любимый мною Fira Code https://t.me/node_modules/53 :
brew tap homebrew/cask-fonts
brew cask install font-fira-code

2. Настраиваем iterm для работы с новым шрифтом:
Жмем Cmd+, → Вкладка Profiles → Слева в списке Default → Вкладка Text → Выбираем для Font и Non-ASCII Font Fira Code → Чекаем галочки Use ligatures.

3. Ставим темку:
git clone https://github.com/denysdovhan/spaceship-prompt.git "$ZSH_CUSTOM/themes/spaceship-prompt"
ln -s "$ZSH_CUSTOM/themes/spaceship-prompt/spaceship.zsh-theme" "$ZSH_CUSTOM/themes/spaceship.zsh-theme"

4. Обновляем конфиг ~/.oh-my-zsh:
ZSH_THEME="spaceship"

#terminal #console #macos #fonts #iterm #ohmyzsh

Вот так выглядит spaceship темка в репозитории с проектом на ноде.

➜ code
zsh: command not found: code
Знакомо? Можно не гуглить.
Открываем vscode, жмем Shift+Cmd+P, пишем shell, выбираем install.
Готово!
Теперь открываем vscod прямо из консольки с проектом:
code .

#vscode #macos #terminal #shell

Аналог библиотеки Parsec для Haskell теперь и для JavaScript - Parsimmon!

Это полноценные комбинаторные парсеры, совместимые с FantasyLand. Для тех кто не в курсе - эта штука позволяет компактно описывать сложные грамматики, например синтаксический анализатор JSON будет состоять примерно из 100 строк.

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

Линк: https://github.com/jneen/parsimmon

#parsing #parser #parsec #парсер

Иструкция как написать красивый dropdown по наведению на табы, как в меню сайта stripe.com

Очень актуально для многих сайтов.

https://lokeshdhakar.com/dev-201-stripe.coms-main-navigation/

#css #design #stripe #dropdown

Interactive React Lifecycle Methods diagram

http://projects.wojtekmaj.pl/react-lifecycle-methods-diagram/

Только вот устарела уже. Надо форкнуть и дописать.
Неинтереактивная, но зато актуальная версия: https://github.com/dluc/react-components-lifecycle

#react #lifecycle #diagram

Redux Ducks альтернативный подход к созданию масштабируемых redux-приложений

#react #redux #design #architecture #patterns #structure

https://github.com/erikras/ducks-modular-redux

React Hooks Lifecycle Diagram

#react #hooks #lifecycle #diagram

https://wavez.github.io/react-hooks-lifecycle/

Гайд от автора typesafe-actions по использованию TypeScript с React/Redux.

Cheatsheet по типам в React’е, типы для типичных React/Redux паттернов вроде render props, шпаргалки по конфигам и прочие FAQ.

Обязателен к изучению всем, кто пишет на React+TS.

Link: https://github.com/piotrwitek/react-redux-typescript-guide

#react #redux #typescript #guide #faq

Использование Babel совместно с Typescript.

TS занимается проверкой типов в фоне, Babel же выпиливает все типы из кода и собирает проект, словно это JS. Очень удобно и быстро.

https://iamturns.com/typescript-babel/

#typescrpt #babel

Набор хелперов для redux: action creators, reducers, constants - все с типами и без бойлерплейта.

https://github.com/piotrwitek/typesafe-actions

#redux #typescript