Андрей

Трудно - и с каждым годом будет все сложнее и хуже. С каждым годом растет объем пула "минимально-необходимых для программиста компетенций" . Каждый год появляются какие-то новые фреймворки, инструменты, фишки - которые по идее должны облегчать и упрощать разработку - но на деле вырастают непреодолимой стеной между тобой и "реальным миром веб-разработки". Потому что ты стареешь, а технологии молодеют.

Я бы картинку нарисовал, но там очень уж нецензурный вид получается ;-)

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

Уже сейчас чтобы тебя считали верстальщиком/программистом/фронтэндером/бэкэндером - надо знать в 2 раза больше технологий, чем 2 года назад. Этакий Закон Мура наоборот. Да вы сами просто посмотрите эти списки "компетенций"!

Читаешь список требований к "Web-программистам" и видишь, что месяц за месяцем, год за годом HR-ы и те, кто там им задачи ставит, вписывают в требования все больше умных словечек, которые они сами услышали и не понимают, зачем оно им нужно и нужно ли? Все ближе и ближе ситуация подходит к "Если бы водителей принимали на работу как програм.... В 2010 году это была "шутка юмора". Сейчас это уже почти реальность.

Пример хотите?

Одна государственная организация выставила список требований к "веб-программисту". При зарплате в 35000 рублей он должен уметь чуть ли не МКС программировать и чуть ли не кластера из сотен серверов настраивать. А на деле основной задачей человека будет - таскать проекторы из аудитории в аудиторию, чистить мышки студентам, переставлять winxp и изредка, раз в полгода - добавлять статью на сайт гос.организации. Откуда информация? Связался с человеком, которому 45, который в этой организации работает уже 18 лет. Ему стаж капает, а деньги он зарабатывает совсем в другом месте.

Что уж говорить об организациях коммерческих? Особенно тех, для которых веб-программист - и чтец, и жнец, и на дуде игрец?

Но это все лирика и крик души. Извините.

И да, к 35-40-45 годам по мнению "молодых и амбициозных IT-специалистов" ты должен обладать строго определенным списком компетенций как в профессии, так и по жизни (к примеру, я столнулся с отказом в приеме на позицию программиста потому что у меня нет... автомобиля. Зачем программисту автомобиль? Ну там сложная и длинная логическая цепочка, сводящася к "раз у тебя нет автомобиля - ты лох, а лохи нам не нужны").
Мне кажется, проблема в том числе и в том, что подавляющее большинство этих самых "молодых и амбициозных" специалистов совершенно не думают о своем будущем. Нет, я не про то будущее, которое "куда я пойду, когда закончу вот этот крутой проект". Я о реальности. В их понимании 35 лет - это недостижимо далёкое будущее, а до 50 они не доживут (а если и доживут - то в мечтах тимлидами в гугле).

Соответственно "молодые и амбициозные специалисты" с презрением смотрят на людей, которые отдали 15 лет разработке определенной платформы, платформы, которую сейчас тщится заменить какой-то пул новых технологий. По их мнению - все что старше 5 лет - ненужное устаревшее говно мамонта. А те, кто не знают появившуюся полгода назад технологию - отставшие от жизни ламеры.
Also, Эффект Даннинга—Крюгера тут работает в полную силу.

Резюмирую: трудно, если у тебя нет в резюме стапятисот сделанных проектов. И чем дальше - тем сложнее и труднее будет. Но тебе может повезти - если ты компетентный специалист в узкой области (даже если она 'legacy'). Или ты можешь найти синекуру - гос.организацию, в которой ты присоединишься к когорте таких же скинутых с паровоза прогресса "молодыми и амбициозными". Не переживай, через 20 лет скинут их. А ты останешься.

Вот только кушать хочется сейчас. Хотя бы просто хлебушка.

location.reload() ?

class="custom__button black__button login__forgot reg__button right__part mob-full__width"

На вопрос верстальщику что это такое: "Это бэм"

Вам нагло соврали. Это говнокод.

Понять BEM

В общем решение такое:
Создаем служебную директиву:

import {Directive, Input} from '@angular/core';

@Directive({
    selector: '[scroll]'
})
export class ScrollDirective {

    constructor() {
    }

    @Input('scroll')
    set appScroll(isReady: boolean) {
        if (isReady)
            this.ngForCallback();
    }

    ngForCallback() {
        $('.owl-carousel').owlCarousel({
            loop: true,
            margin: 10,
            responsiveClass: true,
            autoWidth: false,
            navText: ["Предыдущий", "Следующий"],
            responsive: {
                0: {
                    items: 1,
                    nav: true
                },
                600: {
                    items: 3,
                    nav: false
                },
                1000: {
                    items: 5,
                    nav: true,
                    loop: false,
                    margin: 20
                }
            }
        });

        console.log('run');
    }
}

И в шаблоне:

.....
<div class="owl-carousel owl-theme">
    <div class="item" *ngFor="let t of test; let l=last" [scroll]="l ? true : false">
        <h4>{{t?.name}}</h4>
    </div>
</div>
.....

Судя по консоли ( console.log('run') ) срабатывает всего один раз...

"position: absolute" при ре-рендере триггерит одновременно 3 слоя (лейаут, paint, composite), что для браузера очень трудозатратно (https://csstriggers.com/)

в таким случаях для позиционирования лучше юзать transform: translate, он триггерит только "paint".
+ можно навесить will-change, чтобы подготовить браузер к перерисовке.
+ можно заставить браузер производить рендеринг на GPU - transform: translateZ(0);

Вам не нужно каждый элемент оборачивать в ReactCSSTransitionGroup.

Попробуйте так:

return (
  <ReactCSSTransitionGroup
    component="section"
    className="cart"
    transitionName="example"
    transitionEnterTimeout={5000}
    transitionLeaveTimeout={3000}
  >
    {items.map(item => <CartItem key={item.id} item={item} />)}
  </ReactCSSTransitionGroup>
);

ну и, конечно, у вас должен быть описан css example-enter и example-leave, как в документации

Добрый день.

Представим ваш action creator (функцию), которая на success возвращает успешную авторизацию, например:

$.ajax(url...
  success(data) { dispatch({type: AUTH_SUCCESS, data }) })

Кто мешает сделать так?

$.ajax(url...
  success(data) { 
    dispatch({type: AUTH_SUCCESS, data }) 
    loadUserCart(data.user_id) // <- еще один action creator
})

Суть уже понятна? Мы после успешной авторизации юзера, вызываем сразу же следующий экшен-крейтор:

function loadUserCart(id) {
  return (dispatch) => {
    
    dispatch({ type: CART_REQUEST }) // получается, это событие вызовется сразу после успешной авторизации, практически мгновенно

    
    $.ajax(urlForCartUpdate...
      success(data) { 
        dispatch({type: CART_SUCCESS, data })
    })  
  }
}

Далее вы в компоненте с корзиной, настраиваете показ прелоадера, и вуаля! Получается, для юзера, без задержек, как только он авторизовался - у корзины будет крутиться прелоадер. Юзеру все понятно, он занимается своими делами. Как только "данные подъехали" - вы скрыли прелоадер и показали ему необходимые данные по корзине.

нужно сначала сделать AJAX-запрос, а по его результатам уже рендерить корзину

Именно это мы и сделали.

P.S. не знаю, требуется ли это, но на всякий случай укажу, что чтобы сделать прелоадер в шаблоне, вам нужно в редьюсере корзины создать какое-нибудь поле (флаг), например isLoading и устанавливать его в true когда получите action с типом CART_REQUEST, и false для CART_SUCCESS. Таким образом, вы сможете сделать банальный if в шаблоне рендера и показывать либо разметку прелоадера, либо разметук с данными корзины.

=== вторая часть ===

В компонентах-контроллерах есть только функция connect() со своими функциями-аргументами, которые передают данные в представление. Как-то реагировать на изменения состояния такие компоненты не умеют (я ведь не ошибаюсь в этом?).

Еще как умеют, в этом и суть. Вы в mapStateToProps передаете в общем случае:

{
  ваше_название_поля: reduxStore.название_редьюсера
}

В частном случае, может выглядеть так:

function mapStateToProps(state) {
  return {
    rate: state.rate,
  }
}

После того, как вы "подписались" на изменения в state.rate, (а это, если говорить об частном случае, скорее всего reducer с названием rate), ваш "приконекченный" компонент всегда будет получать новые props при изменении в редьюсере. Следовательно, будет вызываться функция render. Само собой - можно хоть сколько "редьюсеров подключить" к одному компоненту.

Имейте ввиду, что все здесь написано для понимания простым русским языком, на самом деле, так как вы используете компонент Provider на самом верхнем уровне вашего приложения, он прокидывает необходимые props вниз. Ваши connect(Компоненты) умеют реагировать на изменение необходимых props => реакт вызывает рендер, так как "пришли новые props".

Сильно не вникал, но кратко, чтобы передать один компонент в дргой и там его отрисовать, следует передавать компонент через функцию и вызывать её там, где надо отобразить.
Там где отрисовывается Parent

let component = () => ( <ComponentChild /> );
...
<Parent child={ component } />

Внутри Parent в методе

render(){
   return( 
      { this.props.child && this.props.child() }
   )
}

Как-то так. Таким образом определять какой компонент будет отрисовываться можно где-то вверху дерева в умном компоненте, а вниз глупым компонентам-отобразителям передавать его как props через параметр-переменную-функцию.

Вакансий в разы меньше. Но нужно понимать, что компании, кто пишет на java/.net cтабильней в силу объема, плюс задачи достаточно последовательные. Так что 5-10 вакансий на .net могут перекрывать, 40-50 вакансий на php/python/ruby.

Так что если возьмешь место, можно там 3-5 лет стабильно работать.