Нашёл на habr статью (https://habr.com/ru/company/ruvds/blog/448916/), в которой мне дали объяснение по этому поводу.
И вот что я почерпнул. Можно конечно использовать Flex для всего, но в более сложных макетах страниц это приведёт к большим сложностям с манипуляцией с блоками в 2d мерном пространстве, создание дополнительных контейнеров, регулирование отступов, дополнительных расчётов с calc. А оно как я понял из данной статьи в общем и целом то и не нужно. А ещё из приятного это, то что можно в некоторых случаях избежать использования медиа запросов для отзывчивого макета, с помощью некоторых функций Grid. Но и Grid не идеален, к примеру автоматического выравнивания элементов относительно их количества в строке.
Выбор инструмента в общем зависит от глубины ознакомления с их возможностей, что только возможно через долгую практику использования обоих. Гриды — для каркаса сайта, флексы — для контента, это ещё одно интересное предположение, которым я возможно воспользуюсь.
Понимание работы инструмента Grid я вроде понял, и приступил к практическому изучению на freeCodeCamp. Параллельно с этим применил полученные знания, тестируя их для собственной странички. Вроде даже что-то получилось.
Описывать Grid смысла особого нет, всё то что мне удалось понять о CSS Grid можно найти на странице CSS Tricks (https://css-tricks.com/snippets/css/complete-guide-grid/), где вся информация представлена в виде таблицы, с кратким удобным описанием.
Из всего представленного в Grid мне не понятна почему у меня не работает grid-auto-columns (https://codepen.io/kirill-filippov-the-flexboxer/pen/gOWEJap),. Если кто вкратце опишет, буду благодарен.
