[코딩 공부_110] 코딩할 때, 이렇게 하자는 나의 다짐!

코딩을 꼭 이렇게 해야된다, 하면 안된다는 건 사실 없다. 사용자가 직접 코드를 보지 않고 어떤 코드여도 결과만 잘나오면 되기 때문이다

하지만 개발하고 디자인하는 입장에선 다르다 ! 홈페이지를 하나 제작하면 계속 유지보수를 하기 때문에 내가 아닌 다른 작업자가 작업할 때, 최대한 알아보기 쉽게 해야하는 것이 좋은 코딩이라 생각한다

나는 학원에서 공부를 하다보니 학원에서 배운대로 실무에서 작업을 했다

생각해보면 꼭 학원에서 배운게 정답은 아닌듯하다

내가 배운 부분은 최신 유행에 맞춘 코딩방식이었다. 사실 최신 유행에 맞춰서 배운다는 것은 개인 입장에선 너무나도 좋지만 실무에서는 마냥 좋은 부분은 아닌듯 했다! 단점은 바로 다른 작업자들은 그 부분을 잘모른다는 것이다 ..! 10명 중 1명만 아는 방법이면.. 10명이 아는 방법으로 코딩하는게 작업자 모두가 알아볼 수 있는 코드가 아닐까?라는 생각을 하게 됬다..

최신 유행은... 개인작업할때만 쓰기로 했다 😥

그래서 오늘은 코딩할 때 이렇게 코딩 하자는 나의 다짐으로 써볼 것이다 ㅎㅎ..!

 

1. Table 코딩은 하지 않는다 

 Table 코딩? 최근에 html을 배운 사람이라면 굉장히 낯선 단어이다 옛날에 쓰던 방식이기 때문이다..!

나도 처음에 Table로 나열이나 레이아웃을 잡는 것을 보고 깜짝 놀랐다 ,,, 그래서 table 코딩에 대해서 검색해보았는데,, 전혀 시멘틱하지 않은 방식이며 태그가 많아지기 때문에 불필요한 느낌이 든다.

 

- Table 코딩은 어디까지나 표를 만들기 위한 용도이다. 이걸로 나열하지 말자! 나열은 목록태그로 한다

- Table 코딩을 했을 때 table 태그 안에 tr 안에 td, td, 또 tr 안에 td, td ... 불필요한 태그들이며 웹 표준성에 어긋난다

 

2. BEM 방식?

 사실 학원애서 배웠을 때 BEM 방식이 너무 편했고, 클래스명이 겹칠 수 없는 방식이여서 자주 사용했다. 문제는 클래스명이 너무 길어지니까 다른 작업자들이 유지보수할때 찾기 힘들어한다는 것... 나는 편하지만 다른 작업자들이 불편해한다면 고칠 필요가 있다 생각했다 ..! 언더바를 최대 2개까지만 사용하기로 했다 ㅠㅠ...

 

- 사실 BEM 방식은 클래스명이 겹치지 않게 하는 방식으로 굉장히 좋은 방법이다,, 실무에서 사용하려면 다른 작업자들이 작업한 코드를 확인해보고 사용하는 것이 제일 좋을 거 같다!

 

3. h1은 로고만 !

 h1은 로고만??! 왜!라고 생각할 수 있는데 검색엔진 노출할 때, 페이지당 h1은 하나인 경우를 좋아한다고 한다 그래서 홈페이지에서 가장 핵심이라 할 수 있는 로고만 h1에 넣으면 좋을 거 같다고 피드백 해주셨기 떄문이다ㅎㅎ!

사실 피드백은 h1에 로고만 넣엉! 하셔서 이유에 대해 열심히 찾아봤당

 

 

4. inline으로 꾸밈 요소 주지 마세요 ... 제발 .................!!

내가 제에에에에에일 싫어하는 거다 바로 inline으로 꾸밈 요소 주는 것...

사실 백엔드 개발자분들이 inline이나 js로 스타일링 하는 것은 100번 이해할 수 있다..!

하지만 퍼블리셔나 프론트엔드 개발자라면 저엉말 특별한 경우 아니면 class / id로 주면 좋겠다 

사실 이레터를 만들어야하는 경우 외엔.. inline으로 스타일링해야하는 경우는 거의 없다,,😥

또한 js나 jQuery로 인한 부딪힘 이런 경우 ? 그런거 아니면 솔직히 inline으로 쓸 일 지이이인짜 없다 ..

그런데 가끔 아무이유없이 inline으로 css하는 경우가 있다 왜..! class, id로 넣어도 잘만 작동되던데 왜!!..라고 항상 속으로 소리친다 ㅎㅎ.

inlne으로 작업하게되면 우선순위가 두번쨰로 높다.. 그러면 적용되야할 부분이 우선순위때매 적용이 안되는 경우가 생긴다 나는 적용이 되야할 부분이 적용안되면 바로 개발자도구를 켜서 inline으로 작성한 코드인지 아닌지 바로 알 수 있지만,, 개발자도구를 안키고 작성된 코드만 보는 작업자도 있다 그래서 찾는데 엄청 오래걸리는 모습을 볼 수 있었다 ,,

다른 작업자들의 배려로 class와 id를 사용했으면 좋겠다

 

5. 개발자 도구(F12) 쓰세용!

학원에서 정말 잘배운 습관 중 하나다 ㅎㅎ 바로 개발자도구 사용하는 것..!

안되는 부분이나 반응형 작업할 때 꼭 필요하다 

개발자 도구를 이용해서 간단한 오류는 잡을 수 있기 떄문에 손이 F12에 바로바로 올라가는 습관을 들여야한다

<개발자 도구를 사용하면 좋은점>

  1. 일단 클래스명에 오타가 있는지 없는지 바로 알 수 있다

  2. 우선순위로 인한 겹침이 발생 되었는지 알 수 있다

  3. line으로 작성된건지 js로 인한 스타일링인지 css로 작성된 스타일링인지 알 수 있다

  4. 다양한 모니터 화면사이즈를 보면서 작업할 수 있다(반응형)

  5. 간단한 부분은 개발자 도구에 직접 코드를 입력하여 바로 테스트 해볼 수 있다

  6. js 오류 확인도 가능하다 등등

 

내가 아는 좋은점만해도 6가지가 있는데 쓰지 않을 이유가 저어어언혀 없다..!

하지만 나는 개발자도구를 사용한다고 혼난 경험이 있다

다른건 어느정도 이해할 수 있지만 이 부분은 정말 이해할 수 없다,,

누군가 잘못했다고 이야기해도 내가 생각했을 때 누군가에게 피해를 주지 않는 부분이라면 굳이 다 수용할 필요는 없다 생각한다

타인의 의견을 수용하는 능력도 필요하지만 아닌 부분까지 수용할 필요는 없다 생각해서 계속 사용하고 있다 ㅎㅎㅎ,,

 

이건 갑자기 생각난 이야기인데 어릴때 모르고 f12를 눌렀을 때 너무 놀라서 땀흘린 경험이 있다 '혹시 내가 이 사이트를 해킹한건가?' 하는 멍청한 생각을 ..... 생전처음보는 코드에 너무 놀라서 그런 생각을 했나보다