DEV Community

Discussion on: Naming conventions for easy identification of StyledComponent and ReactComponent

View post
Collapse
 
arung86 profile image
Arun Kumar G •

What if you add prefix for each component like this?
StyledButton
StyledDate
so you can easily identify by the name and serves the purpose

Collapse
 
itouoti12 profile image
itouoti12 •

Incorporating Alan's input

return (
  <StyledScheduleContainer>
    <Header>   // <-React component
      <StyledDate>
        Hello!
      </StyledDate>
      <StyledTypeSelectorContainer>
        <TypeSelector />  // <-React component
      </StyledTypeSelectorContainer>
    </Header>  // <-React component
  </StyledScheduleContainer>
);
Enter fullscreen mode Exit fullscreen mode

I see.

This might make it easier to identify StyledComponent.
However, tag recognition may still have room for improvement...?🤔

Thank you.