React Best Practices for Front-End Developers
React, a vital tool in modern web development demands an organized approach for enhanced r...
For further actions, you may consider blocking this person and/or reporting abuse
why the file naming convention should be a PascalCase for components and camelCase for the others? I've seen a lot on youtube & articles that the naming is using kebab-case for the components, page, & everything else...
Its just a common convention for react, makes it consistent with component names, and easier to find when searching, and by using this convention you make sure that other react developers also understand the structure as its common practice
With React, I like having the JSX components match their directory names. I think it makes it as clear as possible as to what is/isn't a component.
For example, this:
Is clearer to me than:
Exactly.
Another good approach to importing is to have an absolute import.
Instead of:
import SpecialButton from '../components/SpecialButton';Use something like:
import SpecialButton from 'components/SpecialButton';This will involve some config adjustments
Ooh thank you for reminding me of those! I've got some imports like
import * as UserActions from '../../../../../store/slices/usersSlice'that would appreciate being cleaned up a bit :)No problem 😃
BTW, make sure to import only relevant methods and avoid import * as possible 👍🏼
Great share
helpfully