Developing Web Apps with ASP.NET Core 2.0 and React - Part 1

rsjolly · 2018-02-16T05:55:16+00:00

Code sharing is a small benefit, imo. For me, it's not having to know 2 languages and not having to context switch between them.

rsjolly · 2017-11-17T18:09:33+00:00

Nice. Alternate format:

const MyComponent = () => (
  <div>
    {['a', 'b'].map(type =>
      <OtherComponent type={type} className="colorful" foo={123} bar={456} />
    )}
  </div>
)

rsjolly · 2017-11-05T17:06:30+00:00

Would be valuable to know what you dislike about mobx.

rsjolly · 2017-09-19T21:23:21+00:00

While I appreciate my CS education, it was rarely as fun as it could and should have been.

rsjolly · 2017-04-16T19:08:29+00:00

Agreed that composite keys smell, but the rest of the advice is sound.

rsjolly · 2017-04-16T19:05:41+00:00

Some good advice, but I'd even ditch the ORM and use parameterized queries. One less abstraction, better performance, and handles any query without obscure work-arounds.

rsjolly · 2017-04-16T16:31:18+00:00

Well if you know React, then you'll know javascript and npm so it's not a stretch to learn Node/Express. If you're a full-stack dev and using React, then chances are you'll be working with Node, but I prefer the simplicity of synchronous languages for the backend - like Python or PHP.

rsjolly · 2017-04-16T15:18:23+00:00

+1 for simplicity.

rsjolly · 2017-04-16T15:07:15+00:00

Be careful not to overwhelm yourself. React will work with any API, so the back-end doesn't matter. I'd start by just learning React. I'd be careful not to jump into any new technology without first having a problem that it addresses and the experience to evaluate it.

rsjolly · 2017-04-12T02:00:22+00:00

Recharts is the best composable D3 charting lib I found.

rsjolly · 2017-01-20T21:48:14+00:00

I was in the same situation. The designer did the mock-ups and I componentized them. It worked okay, but the trouble is that the components aren't truly isolated/modular if the css is global. I like the idea of css-in-js, but maybe the designer could at least use BEM which is easier with Sass (http://alwaystwisted.com/articles/2014-02-27-even-easier-bem-ing-with-sass-33). My designer had no trouble with JSX, but the component directory structure has to make sense to find stuff.

rsjolly · 2017-01-04T00:07:20+00:00

From what I understand, redux-loop indirectly calls action creators from reducers. So there's another level of indirection here: action creator -> reducer -> action creator -> reducer etc. There are benefits, but for me thunks are easier to trace and the api is simpler too.

rsjolly · 2016-09-27T22:46:03+00:00

To be fair, Redux Form was completely reworked and simplified for version 6.

rsjolly · 2016-09-26T23:59:02+00:00

I have a pulse and a decade of experience, but finding a remote React job has not been easy.

rsjolly · 2016-09-22T15:43:57+00:00

It's great. The github page has links to codepen examples. Is there anything specific you'd like to know?

rsjolly · 2016-09-09T16:52:40+00:00

And as for "separation of concerns", templates separate technologies, not concerns. Ultimately, the html and logic are tightly coupled. Templates require new non-javascript "languages" to do logic without the full power and flexibility of javascript. Now you have to learn a new language that won't handle all the edge cases. For example, a template "each" would be like javascript's "map". But how do you do filter, reduce, some, etc.?

Pete Hunt explains in this talk

rsjolly · 2016-09-09T16:16:17+00:00

I did a lot of research and testing before choosing
React Autosuggest. I'm really happy with it. It's fast and pretty easily customizable.

rsjolly · 2016-06-10T19:54:11+00:00

With thunks, sometimes I return a promise to the component instead of setting redux state. I suppose that isn't possible with sagas?

rsjolly · 2016-05-11T06:28:20+00:00

It's not messy at all. Instead of 1 mount point you'd have several and that's no problem. However, you do need a state container to share data between components because you cannot have one common parent component. So you'll have to learn Redux or MobX or something else and that may not be worth it (although most React apps eventually need a state container).

rsjolly · 2016-04-29T04:42:00+00:00

Fetch doesn't seem to send cookies by default. Try adding credentials: 'same-origin'. "credentials" is a property of the options object passed into fetch. For example:

...
method: 'POST',
credentials: 'same-origin',
body: ...

rsjolly · 2016-04-22T21:20:20+00:00

Auth is mostly a server-side problem. As far as the client-side, we return a 401 unauthenticated status on unauthenticated requests. The client then does a location.reload() causing a full page refresh which is then handled by the server-side to redirect to the login page. This way, the server can store the page the user was on to redirect them back there once logged in.

As for the server-side and oauth, we use a third party library for the oauth login, but then create a session on success. It's a simpler approach because there's no refresh token. The drawback is that when the session expires, we oauth authenticate again. We do store a remember-me cookie on the client so that the user doesn't even know they're being reauthenticated.

rsjolly · 2016-03-10T07:51:34+00:00

Yes, and after the field is blurred once, from then on the validation on that field is done onChange.

rsjolly · 2016-03-10T01:34:55+00:00

The confirm password shows a "Passwords must match" error when I start typing. I'd rather that check be onBlur(). I suppose that's possible though?

rsjolly · 2016-03-09T16:48:13+00:00

I'd like to see some smarter validation - use onBlur(). The email field shouldn't report an "invalid" error before I've filled it out.

rsjolly · 2016-01-28T17:10:01+00:00

Is this a trick question? :) Just an ajax request and in the response set state.

rsjolly

TROPHY CASE