An Interest In:
Web News this Week
- April 26, 2024
- April 25, 2024
- April 24, 2024
- April 23, 2024
- April 22, 2024
- April 21, 2024
- April 20, 2024
October 15, 2021 12:27 pm GMT
Original Link: https://dev.to/itouoti12/naming-conventions-for-easy-identification-of-styledcomponent-and-reactcomponent-49fk
Naming conventions for easy identification of StyledComponent and ReactComponent
Do you have a good idea for a naming convention that makes it easy to distinguish between StyledComponent and ReactComponent?
I'm using StyledComponent in my current job.
In the source code, StyledComponent and ReactComponent have the same naming conventions, making it difficult to determine which type of component it is at a glance.
As my refactoring, I changed the naming as follows.
Example
before
return ( <ScheduleContainer> <Header> <Date> Hello! </Date> <TypeSelectorContainer> <TypeSelector /> </TypeSelectorContainer> </Header> </ScheduleContainer>);
after
return ( <Div_ScheduleContainer> <Header> // <-React component <H2_Date> Hello! </H2_Date> <Div_TypeSelectorContainer> <TypeSelector /> // <-React component </Div_TypeSelectorContainer> </Header> // <-React component </Div_ScheduleContainer>);
However, this refactoring violates react/jsx-pascal-case in ESLint.
Do you have any better ideas than this?
Thanks for reading.
Original Link: https://dev.to/itouoti12/naming-conventions-for-easy-identification-of-styledcomponent-and-reactcomponent-49fk
Share this article:
Tweet
View Full Article
Dev To
An online community for sharing and discovering great ideas, having debates, and making friendsMore About this Source Visit Dev To