# coding convention

s_sangs

코딩 컨벤션이란? 🤔 읽고, 관리하기 쉬운 코드를 작성하기 위한 일종의 코딩 스타일 규약 린터를 사용한다는 가정하에 린터로 검출할 수 없는 모호한 부분을 가이드 이번에 회사에서 마크업 코딩 컨벤션 관련해서 정리하게 될 기회가 생겼습니다. 여러 포스팅들을 찾아보고 저희한테 맞는 코딩 컨벤션을 작성하기 위해서 자료를 정리해봤는데요. 회사에서는 웹앱으로 서비스가 제공되고 있어서 보편적인 웹서비스에 적용할 수 있는 마크업 코딩 컨벤션보다는 내용이 적습니다. 추가적으로 CSS에 대한 코딩 컨벤션은 작성하지 않았고, Naming Rule 에는 파스칼 케이스, 카멜 케이스, 케밥 케이스, 스네이크 케이스 등 다양한 케이스에 대한 내용을 작성하지는 않았습니다. 스네이크 케이스로 작성하기로 결정된 상태여서 스네이크 케이스를 기준으로 작성합니다. 🧑‍💻 마크업 컨벤션의 필요성 마크업 개발은 디자인, 브라우저, 스크립트, 성능, 접근성 등과 긴밀한 관계가 있

doakuma

이 글은 ICS MEDIA에 등록된 定番のコード規約とライブラリから学ぶJavaScriptの命名テクニック（初級編）을 번역한 내용입니다 프로그래밍을 할 때 변수나 함수의 네이밍에 고민하십니까? 애써 시간을 들여서 생각한 변수명이나 함수명을 다음에 돌아보면 어떤 것 처리한 것인지 알 수 없을 때도 있고, 다른 개발자가 코딩한 것을 이해하는 데 시간이 걸린 경험은 누구에게나 있을 것입니다. 일반적으로 프로그래머는 코딩하는 시간보다 분석하는 시간이 더 길다고 합니다. 쉽게 이해할 수 없는 네이밍은 소스를 분석하는 시간이 길어진다거나, 버그가 발생하는 원인이 되기도 합니다. 이 글에서는 Google이나 Airbnb와 같은 기업이 채용하고 있는 스타일 가이드나 전 세계에서 쓰여지는 JavaScript 라이브러리인 React와 Vue.js 소스를 조사하면서 찾아낸 알기 쉬운 네이밍 테크닉을 초급편과 상급편으로 나눠 소개하려 합

doakuma

이 글은 Qitta에 등록된 JNJDUNK님의 글인 【コード品質】綺麗なReactコード 中級 7例을 번역한 것입니다 들어가며 React에는 많은 데이터를 유지 및 변경을 통해 동적으로 컴포넌트를 표현한다 데이터를 주고받고, 대입 및 유지는 React만의 방법으로 이루어진다 전제 기본 : 몇 줄 만으로 아름다운 코딩이 가능할 것 1. value 전달이 간결한가 1-1. value 전달 : 한번에 모아서 전달 1-2. 대입 : 프로퍼티 값을 생략하여 사용하고 있는가 2. 함수형 컴포넌트가 가독성이 높다 !!! 어디까지나 아름답다는 관점에서 3. useEffect는 여러 개 사용해도 된다 억지로 하나의 안에 코딩할 필요는 없다 4. 최소한의 useState로 데이

doakuma

이 글은 Qitta에 등록된 JNJDUNK님의 글인 【コード品質】綺麗なReactコード 基本7例을 번역한 것입니다 들어가며 React는 Html이나 JS를 혼동하여 코딩이 가능한 JSX를 사용하기 때문에 다양한 코딩 방식을 적용할수 있다 다양한 코딩 방식이 복잡하게 적용되면 설명, 유지보수가 어려워진다 따라서 최소한 통일된 코딩 규칙을 정해야 한다 최소 전제 조건 pretteier이나 formatter의 설정은 개발자들끼리 공유되어 있어야 할 것 warning, 예외처리 과도한 console은 없어야할 것 최소한의 코딩 규약은 파악할 것 좋은 코드의 기본 최소한 지켜야할 7가지 예시를 소개합니다. 1. 문자열은 직감적이며 알

khm9331

import 순서 수정! 일반적인 convention을 따라 순서만 잘 지켜주셔도 가독성이 좋아집니다. 아래 순서 참고해주세요. React → Library(Package) → Component → 변수 / 이미지 → css 파일(scss 파일) 1. NAMING CONVENTIONS components 이름은 Pascal case로 작성해라. pascal case : 첫 단어를 대문자로 시작하는 표기법 Non-components 이름은 Camel case로 작성해라. Camel case : 띄어쓰기 대신 대문자로 단어를 구분하는 표기 방식 Unit test 파일명은 대상 파일명과 동일하게 작성해라. 속성명은 Camel case로 작성해라. inline 스타일은 Camel case로 작성해라. 2. BUG AVOIDANCE **null 또는 undefined일 수 있는 값은 optional chaining 연산자

paulus0617

깨끗한 코드 코드는 항상 존재한다 코드는 요구사항을 상세히 표현하는 수단이자 언어이므로, 앞으로 코드가 사라질 가망은 전혀 없다. 현재 개발자의 역할을 기계가 대신 한다면 ,추상화도 불가능할 뿐더러 기계가 실행할 정도로 상세하게 요구사항을 작성해야 되는데 이런 작업이 바로 프로그래밍이고 이렇게 명시한 결과가 코드이다. 르블랑의 법칙 (leblanc’s law) > 나중은 절대 돌아오지 않는다 > 프로그램을 개발할 때 시간에 쫓기느라 “기획대로 돌아가는 코드" 그 이상도 그 이하도 아닌 개발을 할 때가 있었다. 인턴 때도 아키텍처나 디자인패턴을 충분히 이해하고 적용한 개발을 하지 않았기 때문에 “나쁜 코드”를 작성한 경우가 많았다. 그때 개발팀의 주임님 및 팀장님께 죄송한 마음뿐이다… 이렇게 나쁜 코드가 쌓일수록 팀의 생산성이 저하될 뿐만 아니라 프로젝트 전체

jacob3015

이번 포스팅에서는 코딩 컨벤션에 대해 간단하게 정리해 보려고 합니다. 코딩 컨벤션 코딩 컨벤션(Coding convention)은 가독성 있는 코드를 작성하기 위한 공통의 코드 작성 가이드라인입니다. 주요 C++ 코딩 스타일 가이드 ISOCPP Style Guide 구글 Style Guide PPP Style Guide 명명 규칙(Naming rule) 타입(클래스, 구조체, 타입 별칭, 열거형 등) 이름은 CamelCase 사용을 권장합니다. 변수와 함수 이름은 lowersnakecase 사용을 권장합니다. 상수 변수와 매크

ryu_log

코딩컨벤션 ? 코딩컨벤션이란 쉽게 설명해 내가 작성한 코드를 다른 사람들도 쉽게 이해하기 위해 개발자들간 서로 정해놓은 코드 작성법 or 일종의 코딩 스타일 규약이다 ! 외 코딩컨밴션 지켜야 헤 ? 결국 개발자의 모든 업무에서 많은 영역을 차지하는 것이 바로 유지보수! 또한 그 유지보수를 그 소프트웨어를 개발한 담당자가 직접 하는 경우도 있지만 다른 누군가가 하는 경우도 있음 따라서 코드를 작성 할 때 정해진 표준의 규칙과 방법이

hikoand

코딩 컨벤션(Coding Convention)이란? 언어를 개발한 단체나 기업에서 딱히 공식적인 규칙으로 지정하지 않은 번외의 내용에 대해 개인의 코딩 습관을 통일하여, 작업상의 가독성과 판독능력을 높여 일의 능률을 증진시키기 위한 내부적인 공동의 약속을 코딩 컨벤션이라 한다. CSS 속성순위의는 경우 역시 공식적으로 지정된 작성법이 없으며 CSS 속성순위가 웹 브라우저의 퍼포먼스 향상 면이나 에러유발 방지에 영향을 주지 않기 때문에 계층구조만 고려하여 작성하게 되는 경우가 있다. 그러나 정해진 규칙없이 CSS속성을 작성할 때 만약 그 프로젝트에 다수가 참여할 경우, 코드 가독성이 떨어지는 혼란을 초래할 수 있다. 이러한 문제점을 방지하고 코드의 효율성을 높이기위해 모질라(M

soryeongk

제대로 개발을 공부함에 있어서 해당 언어의 스타일 가이드를 따르는 것이 중요하다고 생각합니다. 각 언어가 가지는 특징을 파악할 수도 있고, 추후 다른 개발자들과의 협업에서도 가독성 좋은 코드를 작성하고 원활하게 작업할 수 있게 하는 좋은 윤활제 중 하나라고 생각하기 때문입니다. 본 게시물은 모두 개인적으로 찾은 도큐먼트와 각종 블로그의 글을 읽으며 타당하다고 여기는 것들을 정리해 작성한 것입니다. 혹 잘못된 내용이 있다면 알려주시면 감사합니다. :-) 0. 컨벤션? Convention? 컨벤션(Convention)은 각 언어의 스타일 가이드이자 문법, 개발자들간의 약속과 같습니다. 각 변수들의 특징과 사용에 따라 변수명을 작성하는 방법을 달리하고, 각 언어가 가진 예약어나 라이브러리 등의 특징, 인터프리터의 성격 등에 따라 공백과 개행의 구분을 정하기도 합니다. ![](https://images.velog.io/images/soryeongk/post/98a7b330-e17c

gillog

🙆‍♂️ import 🙇‍♂️ 파이썬 명명규칙[히처리] 파이썬! 지켜야할 기초 코딩 룰, 컨벤션[nophotoplease] Coding Convention ? Coding Convention은 프로그램 코드를 작성할 때 사용되는 일종의 기준이다. 명명규칙 Example package & module 짧은 소문자 + 언더스코어 Class CapWords규칙을 따른다. 각 단어의 첫 글자를 대문자로, Car, Gil 등 Exception 예외는 클래스이므로 CapWords규칙을 따르고 Error 접미사를 사용한다. 전역 변수 언더스코어를 붙여서 해당 모듈에서만 쓰이도록 한다. function 소문자 + 언더스코어

muchogusto

Google의 자바스크립트 스타일 가이드 Airbnb의 자바스크립트 스타일 가이드 Idiomatic.JS StandardJS Lint https://eslint.org/docs/user-guide/getting-started Reference https://ko.javascript.info/coding-style ➤ Standard combined JavaScript and Node.js Style Guide github.com/standard/ standard ➤ idiomatic.js: Principles of Writing Consistent,

cada

본 글은 아래의 자바스크립트 코딩 스타일 가이드를 참고 및 번역하여 작성되었습니다. 의역 및 잘못된 해석으로 잘못된 정보가 포함될 수 있으니 원문과 함께 참고해주세요. Google Airbnb Nexedi W3S School 목차 네이밍 기본 파일 및 패키지 변수 함수 객체 클래스 기타 네이밍 기본 🏠 단일 글자로 이름을 짓지 않고 이름을 통해 쓰임새를 알 수 있도록 한다. 이름의 맨 앞이나 맨 뒤쪽에 밑줄( _ )을 사용하지 않는다. **th

cada

본 글은 아래의 자바스크립트 코딩 스타일 가이드를 참고 및 번역하여 작성되었습니다. 의역 및 잘못된 해석으로 잘못된 정보가 포함될 수 있으니 원문과 함께 참고해주세요. Google Airbnb Nexedi W3S School 서론 웹 시장이 방대해지면서 많은 웹 개발자와 함께 많은 서비스가 출시되고 있습니다. 웹에 대한 직군은 크게 사용자가 직접 사용하고

hwang-eunji

2주간 진행되는 클론코딩 프로젝트가 시작되었다. 내가 속한 팀은 Foodly 사이트를 클론 하게 되었고, Front 3, back 3명 총 6명의 인원이 참여하게 되었다. 1 week sprint 프로젝트 시작에 앞서 앞으로 1주간의 일정을 확인했다. front-end팀은 main/login/register/product 페이지를 먼저 진행하기로 하였고, API가 나오는 대로 fetch하기로 하였다. 나는 login/register/main-banner, footer를 맡게되었다. 초기셋팅 우리는 REACT로 작업을 진행 했다. 초기 셋팅은 하나의 PC에서 진행하였다. CRA(create-react-app) CRA를 통해 리액트 기본세팅을 하였고, react-router-dom/node-sass를 추가설치하였다. 폴더구조 & 파일생성 components/images/styles/p

chloe

코딩 컨벤션이란? 코딩 컨벤션은 읽고, 관리하기 쉬운 코드를 작성하기 위한 코딩 스타일 규약이다. 코딩 컨벤션은 왜 필요한가? 여러 개발자가 협업해야하는 상황에서 일종의 규약이 있다면, 유지보수 및 가독성이 좋아져, 협업이 쉬워진다. 특히, 자바스크립트의 경우 다른 언어의 비해 문법구조가 유연하기 때문에, 통일된 규약이 없다면 오류를 찾기 어렵게 된다. 현재 내가 듣는 HTML 수업에서는 BEM이라는 코딩 컨벤션을 쓰고 있다. https://en.bem.info/methodology/quick-start/ http://getbem.com/naming/