HamSter

99% что резюме хлам.
Upd:
Заголовок содержит JavaScript и React, при этом в опыте работы написано что ты верстальщик. Диссонанс. Советую поправить опыт работы.

В опыте работы слово простой убери, нафига себя принижать?
В заголовке убери Junior, сейчас 95% hr'ов сразу закрывают резюме не прочитав тело.
В теле нет никаких деталей. Твое резюме не дает никакого представления о твоем уровне.
Например "Git". Что Git? Ты знаешь про gitflow? Сможешь сделать rebase? Или ты просто фичачишь все в одну ветку? По остальным пунктам примерно тоже.
Например вместо
"Опыт работы на ReactJS и Redux"
можно было бы написать
"Владею ReactJS и Redux на уровне реализации <интернет-магазина> пример <ссылка на проект>"
Первая формулировка не дает никакого представления о том что ты можешь сделать. Вторая несет хоть какую-то информационную нагрузку.

Отличное понимание принципов ООП.

Убери если не хочешь чтобы тебя разнесли на первом же собесе.

"VK
https://vk.com/barisondsilinc"
Серьезно? Как ты до этого догадался?
"опыт работы на фрилансе HTML верстке (до санкционные времена) "
До санкционные времена? Это в 2013ом? Нафиг это работодателю? И для опыта работы есть соответствующий раздел.

"Неоконченное высшее образование"
Ты че, студент? И ты открыто пишешь об этом в резюме? Тебе точно работа нужна?

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

Можно сделать простой эффект на css

Можно более сложный на WebGl

Просто уберите eslint из зависимостей, он идёт вместе с CRA.

почему вы всегда забываете, что блоки вы можете плодить как угодно и где угодно. вкладывать блоки внутрь блоков тоже сколько угодно.
в твоем случае, если у тебя меню получается слишком громоздким, то сделай из него отдельный независимый блок.
который даже к header может не относиться. т.е. внутри .top-header у тебя будет блок .main-navigation или .main-menu
и использовать уже сможешь его не только в хедере, а где угодно.

Мутации - строго синхронные короткие процедуры, содержащие только логику смены состояния.
Экшены - возможно асинхронные процедуры, относящиеся к бизнес-логике и вызывающие мутации для смены состояния.
Так что вы всё делаете правильно. Бизнес-логика - открыть меню. Для этого надо сменить состояние, установив для меню статус "открыто".
Если завтра вам понадобится перед открытием меню делать его предзагрузку с сайта, вы поменяете экшен, а мутация останется как есть.

Это новый функционал в Хроме 58. В консоли сверху переключите уровень оповещений с Verbose на Info, если они вас беспокоят.

Вот здесь, например, делал когда-то такую вещь (блок "Этапы создания корпоративного сайта").



Идея, вкратце:

1. Элементы размещаете просто в сетку с помощью inline-block/float/flex/grid - как привычнее.
   
2. Родителю задаёте относительное позиционирование, в него помещаете абсолютный элемент на всю ширину/высоту с небольшим запасом, на котором будете рисовать SVG.
   
3. Как нарисуется - на js считаете ключевые точки (координаты), через которые нужно провести линии.
   
4. Динамически рисуете SVG по вашим ключевым точкам.
   О том, какие варианты вообще есть, можно почитать на MDN, например.
   Выглядеть это будет примерно так:
   
   
   
   В вашем случае рекомендую использовать кривые Безье. Здесь мне нужно было сделать полукруг, поэтому я использовал дуги, у вас же просто статичная величина закругления.
   
5. На ресайз окна считаете ключевые точки заново и перерисовываете SVG.
   
6. Опционально заморачиваетесь и добавляете сверху ещё один путь, который по скроллу будет "заполняться"
   

Это в целом чёрная магия, можно полдня убить, но красиво :)
Если это всё очень сложно, то просто картинкой вставьте, высоту элементов фиксируйте, и меняйте картинку для адаптивных вариантов.

Готовых вариантов тут в общем-то вы вряд ли найдёте, нужно взять и разработать.
У меня была идея оформить это в какую-то библиотеку, но как и все остальные идеи - и ныне лежит в туду-листе на 60+ пунктов. :)

Держи, немного поправил один из своих старых набросков.

Принцип работы примерно, как описал Максим Морев в своем ответе.

1)let arr = str.split(' ');
Возьмет строку, в данном случае 'aa bb cc aa bb aa', разобьет на части используя пробел как разделитель. В результате получим:
let arr = ['aa', 'bb', 'cc', ' aa', 'bb', 'aa']
2) Следующий кусок кода просто произведет подсчет одинаковых частей.

return arr.reduce((acc, rec, index) => {
    return (typeof acc[rec] !== 'undefined')
      ? { ...acc, [rec]: acc[rec] + 1 }
      : { ...acc, [rec]: 1 }
  }, {});

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

Что собственно происходит:
-typeof acc[rec] !== 'undefined' проверит есть ли в объекте 'acc' ключ 'rec'.
- и если мы уже встречали такой( например когда "aa", но уже во второй раз ), тогда изменить значение этого ключа прибавив 1.{ ...acc, [rec]: acc[rec] + 1 }
- если же такого ключа еще не было, то создадим его со значением 1, ибо он в первый раз попался{ ...acc, [rec]: 1 }

Вот официальная схема. Родители детям через props, назад через events.


1) Пример объявления child в template родителя

<child :somedata="data1" @bestEventEver="someMethod"/>

-передаешь данные из переменной родителя data1 чилду в пропс somedata.
-вешаешь метод родителя someMethod для обработки кастомного ивента 'bestEventEver', приходящего из чилда

2) В child вызываешь this.$emit('bestEventEver', 'params pam pams')

Есть сокращения этого для простых случаев через :v-model и .sync, читай официальный гайд

Но если, например, мне нужно, чтобы текст при изменении динамически менялся не только в textarea, но и в другом, изначально не связанном с textarea компоненте

Если нужно общение не уровня родитель-ребенок, а все со всеми, вот варианты

var gulp = require('gulp');
var browserSync = require('browser-sync').create();
var sass = require('gulp-sass');

gulp.task('sass', function(done) {
    gulp.src("scr/scss/*.scss")
        .pipe(sass())
        .pipe(gulp.dest("scr/css"))
        .pipe(browserSync.stream());


    done();
});

gulp.task('serve', function(done) {

    browserSync.init({
        server: "src/"
    });

    gulp.watch("scr/sass/*.sass", gulp.series('sass'));
    gulp.watch("scr/*.html").on('change', () => {
      browserSync.reload();
      done();
    });
  

    done();
});

gulp.task('default', gulp.series('sass', 'serve'));

Попадал на этот баг. Как удалось выяснить (ReferenceError: primordials is not defined) это баг который возникает на версии node.js >= 12 версии, при работе с gulp версии 3.9.1 и ниже. Как пофиксить не нашел - пришлось откатить версию node.js до последней 11 версии
ps. дополню ответ ) найдено решение без необходимости понижения версии node.js https://timonweb.com/javascript/how-to-fix-referen...