On: I can only think that modern front end development...

[cutler]

But in this case, which isn't atypical, it WAS easier in jQuery. Much easier. I had it working fine with jQuery but wanted to see if I could make it work with React. Here's the full component: https://gist.github.com/polydevuk/96d89642f114707b2f1a0cc316...

[codethief → cutler]

That doesn't look bad to me, though. Pretty much 90% of the code is just HTML, anyway, and I doubt it would be much shorter in jQuery.

If you allow me a few comments on the code:

> .then(res => { setYou(res[form.name1].planets) ; setOther(res[form.name2].planets) })

setYou, setOther will usually each trigger a re-rendering. It would be better to store them together if they're always changed together.

> .then(res => document.getElementById('results').style.visibility = 'visible')

You might want to look into `useRef()` here.

> <select {...register('region2')} onChange={ e => setRegion2(e.target.value) }>

This is what I meant in my earlier comment: Each change will now cause a re-rendering of the entire component. I think it would be better to split up the code here and move the <select> tags into a separate component with separate state. This component would then only tell your parent component about a state change once both region1 and zone1 have been set.

[cutler → codethief]

Great advice. Thanks. Somehow I think it proves my point, though - that SPA frameworks lead to endless complexity making the whole front-end industry the province of senior developers.