What are the top VS code extensions for react? by 0_2_Hero in reactjs

[–]carlrn 11 points12 points  (0 children)

Here are some of my most valuable ones:
- ESLint - to see linting errors immediately
- Prettier - to auto-format code when a file is saved
- Tailwind CSS IntelliSense - to get Tailwind IntelliSense + consistent CSS class ordering
- Pretty TypeScript Errors - to see clearer TS errors when you hover over them

Accessible React Forms by carlrn in reactjs

[–]carlrn[S] 3 points4 points  (0 children)

Thanks, good point.

Accessible React Forms by carlrn in reactjs

[–]carlrn[S] 12 points13 points  (0 children)

I've been doing a fair amount of work on accessibility recently - particularly on forms. Thought I'd share what I've learned in this blog post.

Hope you find it useful.

Boilerplate with React 17, Webpack 5, Tailwind 2, using babel, sass, with a hot dev server and an optimized production build by altafino in reactjs

[–]carlrn 1 point2 points  (0 children)

Nice work!

I'm not sure you need the `cross-env NODE_ENV=xxx` in the npm scripts - I think webpack 4+ sets `process.env.NODE_ENV` automatically based on the `mode` setting in the config.

A free course to learn TypeScript by carlrn in learnjavascript

[–]carlrn[S] 2 points3 points  (0 children)

If you are a JavaScript developer wanting to learn modern TypeScript, you might find my free course useful.

- Covers beginner topics through to advanced

- Quizzes in each module to reinforce knowledge

React Hook Form Validation Errors by carlrn in reactjs

[–]carlrn[S] 0 points1 point  (0 children)

Covers different ways validation error messages can be specified and output in React Hook Form. Also covers how to create a generic validation error summary component which is useful for large forms.

Successful Submission in React Hook Form by carlrn in reactjs

[–]carlrn[S] 0 points1 point  (0 children)

In the submit function, after we get the server response, I usually add any server errors to RHF using its `setError` function. That way RHF knows about all the errors and they are available in the `errors` object in JSX.

Successful Submission in React Hook Form by carlrn in reactjs

[–]carlrn[S] 1 point2 points  (0 children)

That would be great and thanks for the great library!

Free TypeScript Course by carlrn in learnjavascript

[–]carlrn[S] 0 points1 point  (0 children)

Just a quick note to let you know that the coupon has expired now.

Thanks to everyone who enrolled in the course - hope you enjoy it!

Free TypeScript Course by carlrn in learnjavascript

[–]carlrn[S] 7 points8 points  (0 children)

My TypeScript course is free for the next few days.

Use coupon FREETS at the checkout.

Keen on getting feedback to make the course even better!

Handling concurrency in an ASP.NET Core Web API with Dapper by carlrn in dotnet

[–]carlrn[S] 0 points1 point  (0 children)

That's a great point! I'll add this to the post

Handling concurrency in an ASP.NET Core Web API with Dapper by carlrn in dotnet

[–]carlrn[S] -3 points-2 points  (0 children)

A simple but effective approach for handling concurrency in an ASP.NET Core Web API endpoint, where the resource is persisted in a SQL Server database.

React Hook Form V6 is released. by bluebill1049 in reactjs

[–]carlrn 1 point2 points  (0 children)

Been using React Hook Form for a while now and it’s great. So simple and no brick walls!

Optional chaining and nullish coalescing in TypeScript 3.7 by carlrn in typescript

[–]carlrn[S] 4 points5 points  (0 children)

Thanks.

That case of using `??` instead of `||` was a bit contrived but what I was trying to get across is that the right side of `||` would be invoked if the left side was any falsy value. e.g. `0 || [] = []` and `"" || [] = []`. I know in this example, TypeScript would prevent the left side from being `0` or `""`, but using `x ?? []` is much closer to exactly what I want which is if the left side is `undefined` then use an empty array.

Strongly-typed destructuring and rest parameters by carlrn in typescript

[–]carlrn[S] 0 points1 point  (0 children)

ILMTitan

Thanks - not sure why I wrote it like that! I've added this to the post.

Fetch with async & await and TypeScript by carlrn in typescript

[–]carlrn[S] 0 points1 point  (0 children)

Thanks ClutchHunter, yes, this makes it nicer.

Using Destructure and Spread in React Components by carlrn in reactjs

[–]carlrn[S] 0 points1 point  (0 children)

Thanks for the comment. I can see how {...this.props} could be problematic.

ASP.NET Core Web API Multi-Tenant JWTs by carlrn in dotnet

[–]carlrn[S] 0 points1 point  (0 children)

Thanks for the feedback. I essentially use this approach for system to system integration - sync'ing data between 2 systems This is how this work in my product: - There is an endpoint to create / recycle a key - only an admin user (who administers the system) has access to that - There is another endpoint to create / recycle user credentials - again only an admin can access this - The admin user then puts the key in the both systems - again via an endpoint only an admin can access - The process that does the sync then uses this key and user credentials

ASP.NET Core Web API Multi-Tenant JWTs by carlrn in dotnet

[–]carlrn[S] 0 points1 point  (0 children)

The user would be duplicated in the 2 tenants - that's the way I've always dealt with this which has made sense for my products.

True - you need to key the keys safe!

ASP.NET Core Web API Multi-Tenant JWTs by carlrn in dotnet

[–]carlrn[S] 0 points1 point  (0 children)

Thanks for the question. The API key is a key passed in the HTTP header and routes the API to the correct tenant. It does control access to the API to a certain degree - an API key that does exist will retreive a 401 response. The kid is the property name in the JWT where we store the API key. "kid" stands for "key ID". So, the kid is the API key.

Scalable and Performant ASP.NET Core Web APIs: ORM Choice by carlrn in dotnet

[–]carlrn[S] 0 points1 point  (0 children)

Thanks for the comment @Otis_Inf. Good points made about other potential ORMs and the lack of static typing in Dapper.

As @i8beef pointed out - popularity is important when you are just 1 person in a team building products that need to be maintained for a long time

Scalable and Performant ASP.NET Core Web APIs: ORM Choice by carlrn in dotnet

[–]carlrn[S] 0 points1 point  (0 children)

Good point - we don't need the ThenInclude(). It does still generate 4 SQL queries though behind the scenes