DAMP 원칙을 고수하여 코드 직관성 높이기
2023. 4. 27. 19:07
Experience/Developer
DAMP 원칙은 DRY 원칙과는 반대로, 코드를 구체적으로 만들어 유지보수하기 쉽게 만드는 것이다. (DRY 원칙 참고 - https://cotist.tistory.com/33) DAMP 원칙은 코드를 더 직접적이고 구체적으로 작성하여, 코드의 의도를 더 잘 나타내도록 하는 것을 권장한다. 예를 들어, 코드의 함수나 변수 이름을 더 구체적으로 작성하고, 불필요한 추상화를 피하는 등의 방식으로 DAMP 원칙을 따르는 것이다. DAMP 원칙은 DRY 원칙과는 다르게, 중복 코드를 가능한 한 피하지 않고, 코드를 보다 직접적이고 구체적으로 작성하는 것을 강조한다. 이를 통해 코드를 더 쉽게 이해하여 유지보수를 할 수 있다. 그러나 DAMP 원칙도 과도하게 적용할 경우, 코드의 가독성을 저해하고 코드의 복잡도를..
DRY 원칙을 고수하여 코드 작성 효율성 높이기
2023. 4. 27. 12:02
Experience/Developer
DRY란 Don't Repeat Yourself의 약자로, 코드에서 중복되는 부분을 최소화하여 코드의 유지보수성을 향상시키고, 코드 작성의 효율성을 높이는 소프트웨어 개발의 원칙이다. 예를 들어, 같은 로직이 여러 번 반복되는 경우, 이를 하나의 함수로 추상화하여 함수를 호출함으로써 중복을 제거할 수 있다. 이렇게 하면 코드의 양을 줄이고, 유지보수성과 가독성을 향상시킬 수 있다. DRY 원칙을 따르면 코드 중복을 최소화할 수 있으며, 이를 통해 코드를 효율적으로 작성할 수 있다. 예를 들어, 다음과 같은 두 개의 함수가 있다고 가정해보자. function calculateSquareArea(side) { return side * side; } function calculateRectangleArea(w..
[웹 & 앱 외주 1인 개발] 메인컬러, 서브컬러 정하기(feat: 디자인 감각 1도 없는 개발자, 창업가, 대학생)
2023. 4. 2. 18:56
Experience/Startup
창업이든 사이드 프로젝트를 진행하든 웹, 앱을 제작하기 전에 프로젝트의 메인 컬러와 서브 컬러를 정해야 한다. 디자이너가 없는 상황에서 컬러를 정하는 것은 생각보다 쉽지 않은 일이다. 특히나 아이디어와 사업계획서만으로 프로젝트를 착수를 하게 된 창린이에게는 더더욱 어려운 일이다. 프로젝트의 컨셉 색깔을 '초록색', '파란색'처럼 두리뭉실하게 정할 수는 있지만 디테일한 컬러 헥사값을 정하려면 머리가 아프다. 어찌어찌 메인컬러를 잡았다 하더라도 메인컬러와 배합이 맞는 서브컬러도 정해줘야 한다. 더 나아가서는 악센트 컬러도 잡아줘야 한다. 디자인 감각이 없이 컬러 선정을 하는 내 나름대로의 방법을 공유하고자 한다. 경쟁, 벤치마킹 아이템의 컬러를 참고하자 컬러 선택을 가장 실패하지 않는 방법은 유사 아이템들의..
[JavaScript] 나머지 매개변수 - 함수 인수 유동적으로 받기
2023. 4. 2. 16:36
Basic/JavaScript
매개변수의 모든 합을 구하는 함수를 구현한다고 치자. 아래와 같은 함수는 매개변수를 고정적으로 두개밖에 받지 못한다. const sum = (a + b) => { return a + b; }; console.log(sum(1,2)); // result: 3 고정적으로 받지 않고 유동적으로 매개변수의 모든 값을 더하는 방법은 '나머지 매개변수'를 사용하면 된다. const sum = (...numbers) => { return numbers.reduce((pre, cur) => pre + cur, 0); }; console.log(sum(1, 2, 3, 4)); // result: 10 인자를 spread를 사용하면 고정적인 인수를 받는 것이 아닌 유동적으로 받는 것이 가능해진다. 예시로 sum(덧셈) 함..
[JavaScript] 문자형(string) 실수(숫자) 데이터, 세자리마다 콤마 구현하기
2023. 3. 30. 00:16
Basic/JavaScript
let numberString = "1000000.000000"; let parts = numberString.split("."); parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ","); let result = parts.join("."); console.log(result); // "1,000,000.000000" split() 메소드를 사용하여 원래 문자열을 소수점 기준으로 두 부분으로 나눈다. 정규표현식를 사용하여 replace() 메소드를 호출하여 첫 번째 부분의 숫자 문자열을 변경한다. 이 정규표현식은 세 자리의 숫자 그룹 앞에 오는 자리를 찾는다. 찾은 후, replace()는 해당 경계 뒤에 있는 문자열을 ","로 대체한다. join() 메소..
[React Native] 안드로이드 빌드 에러 - This version of the Android Support plugin for IntelliJ IDEA (or Android Studio) cannot open this project, please retry with version 20xx.x.x or newer.
2023. 3. 19. 21:51
Front-end/App
(React Native 뿐만 아니라 Native에서도 적용되는 에러이자 해결 방안입니다.) This version of the Android Support plugin for IntelliJ IDEA (or Android Studio) cannot open this project, please retry with version 20xx.x.x or newer. 해당 에러는 현재 사용 중인 Android Studio 지원 플러그인과 실행하려는 프로젝트의 세팅된 플러그인과 호환이 안되기 때문이다. 해결 방안은 Help탭에 "Check for Updates" 검색하여 Android Stduio의 버전을 업데이트하면 된다. 안드로이드 스튜디오는 Visual Studio Code와 같이 여러 프로그래밍 언어를 ..
[React Native] Native Module 연동(구현)하기 (2) - iOS
2023. 3. 15. 00:51
Front-end/App
이어서 iOS도 모듈화해보자. (이전 포스팅 : Android 모듈화 과정 https://cotist.tistory.com/27 ) 아래 경로로 Module의 헤더파일을 생성해주고 코드를 작성. // RCTIOSTestModule.h #import @interface RCTIOSTestModule : NSObject @end 앞서 만든 헤더파일의 같은 경로에 본체인 메인 파일을 생성하자. 내보낼 함수들을 작성하고 모듈을 export하자 (주석 참조) // // RCTIOSTestModule.m // ReactNativeNativeModuleSample // // Created by user on 2023/02/15. // #import "RCTIOSTestModule.h" #import @implemen..
[React Native] Native Module 연동(구현)하기 (1) - Android
2023. 3. 14. 00:04
Front-end/App
Native Module은 Native 코드를 javascript 코드로 연동하는 작업이다. 해당 작업을 하는 이유는 반드시 사용해야 할 SDK 및 라이브러리가 네이티브인 경우가 대다수이다. 다른 이유는 성능 때문일 수도 있겠다. 성능에 관해 무거운 작업일 경우 네이티브로 작업을 하는 경우 아무대로 번들링 되는 과정이 없다 보니 그럴 수도 있겠는데.. (이 경우로 직접 모듈화를 해보지는 않아 개인적인 지표는 없어, 혹시 경험하신 분 있으시면 공유주시면 감사하겠습니다. ㅎㅎ) 간단하게 모듈화하는 과정을 Android부터 해보자. // android/app/src/main/java/com // ModuleTest.java package com.reactnativenativemodulesample; // 앱..
[React Native] 빌드 속도 향상시키기 (캐쉬화)
2023. 3. 12. 15:59
Front-end/App
리액트 네이티브의 고질적 문제점 하나인 답답한 빌드 속도는 한 번이라도 RN 셋업을 경험해봤다면 공감할 것이다. 게다가 외부 라이브러리의 설치의 의존도가 높아지면 그 정도는 심해진다. 원인은 javascript 코드와 native 코드 간의 번들링 과정이 가장 큰 요인이다. 그리고 앱을 끄고 재실행하게 되면 처음부터 다시 모든 파일을 번들링한다. 이는 캐쉬화가 되지 않았기 때문인데, 캐쉬화를 시키게 된다면 캐싱된 소스들은 번들링을 할 필요가 없기 때문에 극단적으로 번들링을 해야 할 소스코드가 줄어든다. 결과적으로 빌드 속도를 향상시켜준다. 캐쉬화 세팅을 통해 생산성을 높여보자! 안드로이드(AOS) (1) Gradle 설정 변경 Android 앱을 빌드할 때 Gradle은 종속성을 다운로드하고 캐시에 저장..