P.S0
dev.log
P.S0
전체 방문자
오늘
어제
  • 분류 전체보기 (42)
    • 프로그래밍(Programming) (28)
      • JavaScript (3)
      • Git (5)
      • React (4)
      • Vue (2)
      • Java (3)
      • 알고리즘 (7)
      • Python (1)
      • SQL (2)
    • TIL (7)
    • 프로젝트 (Project) (5)
      • BTP Project (3)
      • TRPG ASSISTANT (0)
      • OPEN_AI (2)
      • TISTORY (0)

블로그 메뉴

  • 홈
  • 💻Github
  • 📄 Velog
  • 태그
  • 방명록

공지사항

인기 글

태그

  • javascript
  • Til

최근 댓글

최근 글

티스토리

hELLO · Designed By 정상우.
P.S0

dev.log

TIL

React 컴포넌트 호출 오류 : [ ... is using incorrect casing. ]

2022. 5. 26. 22:31
728x90

 

처음 컴포넌트에 대해 공부하고 있는데, 이런 오류가 났다.

 

Warning: <todoList /> is using incorrect casing. Use PascalCase for React components, or lowercase for HTML elements.
    at todoList
    at div
    at App

뭔가 싶어 해석해보면 

 

리액트 컴포넌트는 PascalCase 를, HTML 엘레먼트는 lowercase(소문자)를 사용하라는 것이다!

그럼 PascalCase는 뭘까?


파스칼 표기법

"PascalCase"

첫 단어를 대문자로 시작하는 표기법

예시: BackgroundColor, TypeName, PowerPoint

 


CamleCase와 비슷하지만 첫단어도 대문자라는 차이점이 있다.

오류 메시지에서 나왔듯, 내가 만든 컴포넌트 이름은 todoList로 카멜케이스를 사용했다. 맨 앞이 소문자라 오류가 났던것...

 

결론은 "대문자"!

 

 


참고 :

https://zetawiki.com/wiki/%EC%B9%B4%EB%A9%9C%ED%91%9C%EA%B8%B0%EB%B2%95_camelCase,_%ED%8C%8C%EC%8A%A4%EC%B9%BC%ED%91%9C%EA%B8%B0%EB%B2%95_PascalCase

728x90

'TIL' 카테고리의 다른 글

React 에서 이미지가 불러와지지 않을 때 (엑박 뜰때)  (0) 2022.06.19
React 오류 : 'react-scripts'은(는) 내부 또는 외부 명령, 실행할 수 있는 프로그램, 또는배치 파일이 아닙니다.  (0) 2022.06.10
GIT (branch | MERGING )해결법  (0) 2022.05.13
자바스크립트 함수 명명의 중요성 (특히 이름 짓기)  (0) 2022.05.04
Javascript alrert, prompt, confirm  (0) 2022.05.04
    'TIL' 카테고리의 다른 글
    • React 에서 이미지가 불러와지지 않을 때 (엑박 뜰때)
    • React 오류 : 'react-scripts'은(는) 내부 또는 외부 명령, 실행할 수 있는 프로그램, 또는배치 파일이 아닙니다.
    • GIT (branch | MERGING )해결법
    • 자바스크립트 함수 명명의 중요성 (특히 이름 짓기)
    P.S0
    P.S0
    이전도 부지런함이다 그냥 살아보겠습니다.

    티스토리툴바