[Project] 팀플 규칙 ( HTML, CSS, JS, Jquery 네이밍 )

1. HTML 네이밍 컨벤션

• ID와 클래스 네이밍: 소문자로 작성하며, 여러 단어로 구성된 경우에는 언더스코어(__) 두 개로 연결합니다.
• 예시: header__menu, footer__links, main__content
• 태그 속성 순서: 태그의 속성은 일관된 순서로 작성합니다. 일반적으로 id → class → data-* → 기타 순서로 작성하는 것이 좋습니다.

html코드 복사
<div id="main__header" class="header__menu" data-type="main"></div>

2. CSS 네이밍 및 작성 컨벤션

• 클래스 네이밍: HTML과 동일하게 소문자와 언더스코어(__) 두 개를 사용합니다.
• 예시: .container__header, .button__primary

3. 자바스크립트 및 jQuery 네이밍 컨벤션

• 변수 및 함수 네이밍: CamelCase를 사용하여 함수와 변수 이름을 작성합니다.
• 예시: getUserData, updateUserInfo, isActive

javascript코드 복사
const userData = {};
function getUserData() { ... }

 

• jQuery 객체 네이밍: jQuery로 선택한 요소를 담는 변수는 $ 기호로 시작합니다.
• 예시: const $headerMenu = $('#header__menu');

• 함수 선언: 함수 선언은 function 키워드를 사용하는 대신 화살표 함수를 사용합니다. (ES6 이상)

javascript코드 복사
const updateUserData = () => {
    // function code
};

 

• 이벤트 핸들러 네이밍
• 이벤트 핸들러 함수의 이름은 on으로 시작합니다.
• 예시:

javascript코드 복사
const onButtonClick = () => {
    // handle button click
};