Консоль, часть III:

- Почти всегда флаги имеют короткую и длинные версии:
-d === —directory
-H === —derefernce-command-line
Разница в областях применения. Для команд в консоли удобнее применять короткие флаги, для bash-скриптов - более наглядные длинные.

- Из предыдущего пункта вытекает: понять смысл сокращенных флагов несложно и без мануала - часто они повторяют первые буквы своих полных версий. Pre-intermediate хватит за глаза.

- Некоторые опции принимают параметры, как функции - аргументы. Это выглядит, например, так:
$ command -c=parameter
$ commend -c parameter
Специфику таких опций всегда можно найти с помощью RTFM. :)

- Пример сложной команды:
ls -lS --time-style=long-iso /var
Что здесь происходит:
1. Задана команда ls.
2. Ей присвоены флаги:
-l
-S - сортировка с тонкой настройкой
—time-style - параметр -S, в свою очередь, принявший параметр "long-iso" (без кавычек!).
3. В конце передан путь к директории.
Как результат - файлы, отсортированные по размеру, с подробным выводом и специфичным форматированием времени.

P.S.: спасибо всем за фидбеки по ошибке с CLI. Вы супер! ✌️

#bash #shell

Консоль, часть VI:

- Команда cat [file] позволяет открыть и читать файл.

- Команда head [file] выводит первые десять строк файла. Флаг -n позволяет настраивать это значение:
head -n 2 file
...выведет две первые строки в файле.

- Команда tail выведет последние строки в файле. Ею же можно создать динамический вывод лога:
tail -f file
...будет выводить содержимое файла по мере его наполнения.

- Команда less - "пейджер" для чтения файлов. Загружает в память только видимую на экране часть в режиме рид-онли, поэтому работает быстрее cat.

- В less есть команда /. Она служит для поиска по файлу. Навигация по поиску:
f - вперед на страницу
b - назад на страницу
n - предыдущий результат поиска
N - следующий

#bash

UNIX - факты о файловой системе:

1. В UNIX только одно файловое дерево. Windows создает их несколько - на каждый физический или логический носитель.
2. Домашняя категория - это не корень системы, а директория пользователя. Из неё можно попасть в корень, перейдя на два уроня ниже.
3. В отличие от Windows, здесь расширения файлов - часть их имен.
4. Регистр имеет значение!

#Unix, #bash

JS: любопытные решения задач

- Найти сумму чисел от 1 до n короче всего не через цикл или рекурсию, а по уравнению Гаусса:
lastNumber * (lastNumber + 1) / 2;

- Самый короткий способ найти количество цифр в числе:
String(number).length;

- Кратчайший поиск индекса последнего вхождения числа в массив:
array.lastIndexOf(number);

#JS

Английский язык:

- Основная черта Present Continuous Time - настоящего текущего времени - в том, что в нем используются одновременно вспомогательный глагол и основной и окончанием -ing:
...I am swimming - сейчас я плыву;

- Present Simple - простое настоящее время - служит для указания регулярных действий:
...I code my pet projects twice a week.

- Структура предложения в Present Simple:
подлежащее + глагол + остальные части предложения.

- Для Present Simple характерны слова-маркеры, указывающие на периодичность действия: twice a week, everyday, never и т.д.

#english #grammar

Английский язык, part two:

Для утвердительных предложений во втором лице и единственном числе в Present Simple есть простое правило с одним исключением. Для забавы проиллюстрирую на псевдокоде:

if( verb (глагол) ends with -o, -s, -sh, -ch, -tch, -x, -z ) {
verb += es;
} else if (verb ends with a consonant (согласная) + y) {
verb += ies;
} else {
verb += s;
}

Словом, исключения из правила "добавь -s" в simple present делаются для:
- гласной -o и ряда шипящих и звонких звуков,
- сочетания "согласная + y".

Для примера:
- He makes great code on Mondays and bad on else days;
- It plays sad music every morning;
- She flies at Moscow every year;

#english #present_simple #grammar

Английский язык, part three:

- Отрицания в present simple строятся так:
Подлежащее + don't / doesn't + сказуемое и все остальное.
Например:
"I don't need to code backend today" - сегодня мне не нужно кодить бэкенд.

- Выражения don't и doesn's употребляются по правилу:
- I/You/We/They - don't
- He/She/It - doesn'n
"She does not commit anything" - она ничего не коммитит.

- В выпросительных предложениях Do/Does избавляются от not и перемещаются в начало предложения:
"Do you listen "Radio JS?" - cлушаешь "Радио JS"?

- В Present Simple для I//You/We/They ничего не добавляем к глаголу:
"I like cherry ice cream".

- Для запоминания правил удобно деление:
He/she/it || anything else
Можно произность как "хишиит" (почти как кришнаит).

#english #present_simple #grammar

Английский язык, part four:

- Have got / has got - оборот, употребляемый в Present Simple, когда говорим:
1. О внешности: i have got yellow eyes.
2. О принадлежащих вещах: we have got a health potion.
3. О болезнях: he has got a stomachache.
Здесь же применяется правило "хишиит": говоря "he", употребляем "has".

- Can и may - глаголы, смысл которых - обозначать возможность:
- can - физическая возможность, вероятность;
- may - возможность "юридическая", то есть, о которой мы просим.
Так, например, "may I join your party?" будет грамотнее, чем "can I join...". "You may cast this spells" будет означать разрешение, "you can..." - констатацию.
А еще can - Это банка :)

- would like - выражение, которое обозначает предпочтения или желания:
"I would like to read to read this React Handbook";
"Would you like a cup of get the fuck out?" >:D
"He wouldn't like to use jQuery because he hates it"

#english #present_simple #grammar

Английский язык, part five:
Неопределенные артикли

- Артикль "a" произошел от слова "one". Из этого вытекает правило: он употребляется только:
- с исчисляемыми существительными,
- в единственном числе.
Его разновидность "an" употребляется для существительных, начинающихся с гласной буквы.

- Другие правила употребления a:
- указание на неуникальный экземпляр какого-то предмета:
"a pen" - обычная ручка, "the pen" - конкретно та ручка с микки маусом;
- первое упоминание предмета в речи (во второй раз - уже the):
"I see a white rabbit. The rabbit is dead";
- указание принадлежности человека к какой-либо группе или профессии:
"He is a programmer".

- Артикль "the" употребляется, если:
- предмет уже употреблен в речи (см. пример с дохлым зайцем);
- речь идёт об уникальном предмете - например, планета Земля или единственный на всю игру уник в MMО;
- речь о конкретном предмете в текущем контексте: "look at the sword in the rock";
- речь о неисчисляемом конкретном предмете.

- Артикли НЕ употребляются, когда:
- речь о концепции, чем-тов целом, а не конкретном проявлении: "Math is hard", "codres are clever";
- речь о временах года, днях, неделях и т.д. в общем (не о конкретных).

#english #articles #grammar

Английский язык, part six:

Некоторые разговорные выражения, которые мне по вкусу. Пригодятся на работе и в непринужденной беседе.

- In a way: "в каком-то смысле";
- Deal!: "по рукам, идёт!"
- I'm afraid so: "боюсь, что так"
- Not a bit: "ничуть"
- Most unlikely: "вряд ли"
- Quite so: "в целом верно"

- I couldn't catch the last word: "не уловил последнее слово"
- It's new for me: "для меня это в новинку"
- So that's there the troule lies!: "так вот оно что!"

- And so on and so forth: "и так далее"
- First of all: "прежде всего"
- Such as: "например"

Бонус:
- Are you nuts? "поехал штоле?"
- Don't give a fuck: "да мне похер"
- Let's beat shit out (someone): "пойдем-ка наваляем (кому-то)"

#english #лексика

Английский язык, part seven:
This & that

Как и в языках программирования, в английском есть слово this - а еще похожее на него that. Различаются они примерно как наши "это" и "то", но есть нюансы.

Определяющее различие - принцип отдаления:
- This используют, чтобы указать на что-то близкое - как в пространстве, так во времени и даже для эмоциональной дистанции.
- That - наоборот.
"May I look at that library?" - мог бы я взглянуть на ту библиотеку (которую мы ранее обсуждали)?
Just look at this code!" - глянь только на этот код!

This - сейчас, этот, текущий момент, рядом, о человеке.
That - прошлое (даже ближайшее), тот, далеко, о вещи.

У this и that есть форма множественного числа:
This == These;
That == Those;

This и that используются в расхожих выражениях. That, пожалуй, чаще:
"That's it, the code is working now" - ну все, (этот) код (сейчас) работает.
"That's OK";
"That's the point"
и т.д.

#english #this

React, заметки об архитектуре и другое:

- В идеале, каждый Реакт-компонент должен находиться в отдельном каталоге. Это роднит компонентный подход с БЭМ, где блок - не что иное как разбитая на собственные файлы структура.

- Файлы стилей должны называться так же, как и название компонента.

- В проекте отдельным каталогом должны содержаться юнит-тесты.

- C помощью Webpack можно укоротить пути к файлам компонентов (импортировать по-умолчанию). Для этого:
1. Создаем в папке компонента файл index.js (или с таким же названием, как корневой файл проекта)
2. Прописываем импорт и экспорт:
import MyComponent from './my-component';
export default MyComponent;
3. Убираем дублирование названия файла компонента в корневом файле проекта.
Если Webpack будет ругаться на отсутствие файлов, может помочь рестарт скриптов.

- Компоненты-классы от функциональных отличаются возможностью хранить состояние.

- Если импортировать компонент через деструктуризацию:
import React, { Component } from 'react'
...то не придётся писать в компоненте-классе extends React.Component: вместо этого можно будет написать просто Component.

- Экспортировать компоненты можно, объявляя export default прямо перед объявлениями этих компонентов.

#React #архитектура #webpack

JS - Map/WeakMap, Set/WeakSet

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

- WeakMap - аналог Map, который гарантированно удаляется сборщиком мусора после удаления ссылок на объекты, добавленные в коллекцию.

- Set создает множества:
const s = new Set([0, 1, 2, 3]);
Его weak-аналог отличается тем же, чем и в случае с Map.

#JS

React: безопастность и полезные приемы

- В Реакте нельзя напрямую обновлять State. Для этого используется функция setState. В неё напрямую можно передавать новые значения полей объекта State... Но не всегда это выбор джедая.

Представим простой метод, который при событии переключает булево значение в state поля компонента. Проще всего написать его так:

this.setState({
field: !this.state.field
})

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

Наилучший способ - передавать в setState другую функцию, которая будет получать Statе, когда тот тот уже полностью обновлен и готов принять противоположное значение:

this.setState(state => {
return {
field: !state.field
}
})

Короче: если метод ссылается на предыдущее значение поля - переключает true/false, увеличивает значение, меняет в зависимости от текущего, - надо передавать в setState функцию. Иначе можно просто передавать объект.

#React #приемы_разработки

React: кастомные события, иерархия и другое

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

На одном из звеньев мы ловим классическое DOM-событие вроде onClick, и кастомное событие обрабатывается.

Концепция однонаправленных потоков типов данных очень важна для Реакта и будет рассмотрена позже (наверное).

- Компонент-функцию можно легко переделать в класс, если переместить её JSX вместе с return в метод render класса.

- В новом JS появился метод массива findIndex. Возвращает элемент массива, соответствующий условию. Вкусный сахар.

- В целом, в Реакт любое использование мутабельных методов - антипаттерн. В любом месте.

- Если поле State - массив, и задача - удалить элемент, решение может быть таким:
1. Получаем любым немутабельным методом первую часть - от начала до удаляемого индекса.
2. Примерно так же получаем остаток - от удаляемого + 1 элемента до конца.
3. Склеиваем.
4. Возвращаем новый массив в State.

#React

Командная строка - grep:

Grep - поисковик по директориям и файлам. Ищет по строкам или регулярным выражениям.

Запрос выглядит, например, так:

$ grep something .file

Команда вернет все вхождения паттерна something в файле .file.

Греп принимает множество опций. Из них особо часто применяются опции контекста и рекурсивного обхода.

- Опции контекста:
-B, -A, -C
Они же
—before-context
—after-context
—context
В свою очередь, эти опции принимают числа. Они задают количество строк, которые консоль выведет до, после или по обе стороны от искомой строки.

- Опции обхода:
-R - опция рекурсивного обхода директорий со всеми поддиректориями. Полезно, если неизвестен файл для поиска, но известна директория.
-Rn - рекурсивно обойдет директории, а заодно укажет номер строки, где совпадение найдено.

Примеры:
$ grep -C 2 something .file
$ grep -R something directory

#bash

Командная строка - Vim, Nano
...или как перестать бояться тупиков в Git и начать жить

- В редакторах Linux, в которые входит и Vim, используется навигация через CTRL + {key}. Например, CTRL + X закроет редактор.

- В подсказках CTRL обозначается как символ ^. Соответственно, Git сам объясняет, как выйти из редактора.

- Главное отличие Vim - у него есть разные режимы:
- режим команд (по-умолчанию)
- режим редактирования: войти - клавиша i, выйти - ESC или ^[
- Визуальный режим
- Режим командной строки.

- Как выйти из Vim?!!1 - вопрос миллионов.
Есть два основных выхода:
1. ^X
2. :q в режиме команд.

А выйти с сохранением можно через :wq.

#bash

Bash - управление потоками

Вывод программ можно не только выводить на экран, но и писать в файл. И наоборот. Делается это операторами:

< > >>

< - выводит на экран;
> - записывает в файл (с перезаписью)
>> - добавляет в существующий файл

Эти операции связаны с потоками ОС. Вот эти потоки:
STDIN (файловый дескриптор 0) (прием данных в процесс)
STDOUT (ф.д.1) (вывод данных из процесса)
STDERR (ф.д.2) (вывод ошибок)

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

Еще один, очень важный оператор для консольных команд - это пайп. Выглядит он как вертикальная черта: " | ".
Его задача - передавать данные из одной программы в другую на манер конвейера.
Пайп применяется, потому что, как и в NodeJS, UNIX придерживается принципа атомарности программ. Лучше соединить несколько grep пайпом, чем усложнять сам grep.

Пример:

$ grep hello | grep world // выведет все совпадения по hello и world

#bash

Структуры данных: заметки

- Двухсвязный список может быть выгоднее массива: любые операции вставки и удаления занимают в нём время О(1). Но, в зависимости от данных, можно обойтись односвязным списком или просто массивом.

- Поиск в связанном списке равен О(n), если не прибегать к дополнительному индексированию и другим трюкам.

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

- Реализовать стек можно с помощью массива или односвязного списка. Я делал и обычной строкой :)

- В деревьях есть понятие "листового узла" - это узлы, не имеющие потомков.

- Закономерность в деревьях: ребер в дереве всегда равно количеству узлов минус 1. Так получается, потому что к любому из узлов (кроме корня) ведет один указатель.

- Глубина узла дерева - это количество ребер, которое нужно пройти, чтобы добраться до узла. Например, у корня глубина - 0: на него ничего не указывает.

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

- Свойства двоичного дерева:
1. Максимальное количество узлов на уровне высоты: 2^уровень.
2. Максимальное количество узлов дерева: (2^высота дерева)-1.
3. Высота дерева по количеству узлов: log2(n+1)-1

- Деревья бывают сбалансированными и несбалансированными. Сбалансированные деревья максимально заполнены. Это важно, потому что высота дерева прямо влияет на количество операций поиска по нему. Максимальная заполненность - это состояние, когда разница между правым и левым поддеревьями не меньше константного числа (обычно, 1).

- Хранить деревья в памяти можно по-разному:
1. Обычное дерево можно хранить в связанном списке.
2. Complete binary tree - дерево, в котором все узлы, кроме листовых, заполнены, и дерево расширяется слева - допустимо хранить в массиве.

#структуры_данных

Мотивация. Как двигаться вперед.

Пост не в формате канала, но касается нашей профессии не меньше нюансов программирования.

Многим знакома ситуация, когда любимая работа превращается в рутину, сомнения связывают руки и ты не растешь, как раньше. В таком положении важно не отдаваться ситуации, а вовремя оглядеться и изменить обстановку - внутри, снаружи или все сразу. За полтора года в IT заметил вот что. Я развиваюсь как профессионал и личность, когда:

1. Побеждаю. Решил сложную задачу, освоил технологию, убедил руководителя внедрить её. Даже маленькая победа - источник личной силы. Чем больше смог, тем проще достинуть еще большего.

2. Работаю для людей. Когда код решает реальные задачи - он меняет мир. Когда код видят коллеги, говорят о нём, он меняет их. Я всегда в выигрыше: критика оттачивает, похвала - дает больше сил.

3. Наслаждаюсь процессом. Будущее непредсказуемо. Размышления, устарела ли технология и востребована ли профессия, - гадания на кофейной гуще. Можно без лишних эмоций анализировать, выбирать перспективные направления. А эмоции - оставить для программирования. Технологии воплощают мои идеи. Каждая строка кода приносит удовольствие, удовольствие дает силу. Это прекрасно.

Создать для себя такие условия не слишком сложно. Если не дается - дробим на подзадачи и осиливаем маленькими шажками. Чувство от наполовину выполеннной задачи, казавшейся еще вчера неодолимой, невозможно переоценить.

#мотивация

React, заметки:

- React.Fragment - обертка для элементов, которая используется, когда нельзя использовать <div> - например, в списках и таблицах. Имеет коротку запись <> ... </> (пока поддерживается малым количеством инструментов, не рекомендуется).

- Жизненный цикл компонента в Реакт - это очередь событий, которые происходят с компонентом. Как и в WP, для этих событий есть хуки:

1. componentDidMount() - срабатывает, когда компонент отрендерен как ДОМ-объект.
2. componentDidUpdate() - срабатывает при обновлении состояния компонента. Используется, например, для получения данных по АПИ. Предпочтительно делать это в нём, а не в конструкторе.
3. componentWillUnmount - перед удалением ДОМ-элемента.
4. componentDidCatch() - ловит ошибку, под которую не подготовлен обработчик.

#React #жизненный_цикл