File Path 구성 체계
파일 경로 구성 체계에 대해 학습해 봅시다. 주요 구성요소에 대한 설명은 다음과 같습니다.
예시 :
(UNIX) /home/boost/work/test.txt
(WINDOWS) C:\Windows\Boost\test.txt
| 구분 | UNIX | WINDOWS | 설명 |
|---|---|---|---|
| root | / | C:\ | 루트 디렉토리 |
| dir | /home/boost/work | C:\Windows\Boost\ | 디렉토리 |
| base | test.txt | test.txt | 파일명 |
| ext | .txt | .txt | 확장자 |
| name | test | test | 확장자를 제외한 |
| 파일 이름 | |||
| 구분자 | / | \ | 디렉토리 구분자 |
UNIX와 WINDOWS는 보시다시피 디렉토리 구분자와 루트 디렉토리의 표기 방식이 다릅니다만, 실제 구조는 파일 시스템이 결정하므로 표현 방식만 다르다고 보면 되겠습니다.
정규 표현식
아래 사이트에서 정말 잘 정리되어 있어 많은 도움이 되었습니다.
테스트는 아래 사이트에서 하는게 가장 편했습니다.
RegExr: Learn, Build, & Test RegEx
미션 구현에서 주로 사용했던 패턴 위주로 정리해보겠습니다.
| 기호 | 의미 |
|---|---|
| [] | 괄호안의 문자들 중 하나 (OR) |
| [^문자] | 괄호 안의 문자를 제외한 것 (NOT) |
| + | 최소 한개, 또는 여러개 |
| * | 최소 0개, 또는 여러개 |
| [ㄱ-ㅣ가-힣] | 한글 |
| [a-zA-Z] | 영어 |
| [0-9] | 숫자 |
| \s | 공백 ( ) |
| \ | 백슬래시 () |
| \/ | 슬래시 (/) |
| (?:패턴) | 캡쳐하지 않고 그룹화 |
해당 내용과 각종 특수문자들의 이스케이핑()만 사용하여 파일 경로를 처리할 수 있었습니다. 미션 수행 시 마다 헷갈렸는데, 이제는 확실히 정리가 되는 것 같습니다!
JS 모듈 의존성
JS에서 모듈 의존성을 관리하는 솔루션은 대표적으로 세 가지가 있습니다.
- npm
- yarn
- pnpm
자바스크립트 의존성 관리자(npm, yarn, pnpm)에서 보다 더 의존성 관리 잘하는 방법
저는 주로 npm을 사용하며, 이번 미션에서도 npm을 사용했습니다.
미션에서 사용하지 않은 yarn도 포함하여 정리해 보겠습니다.
npm
npm은 노드 패키지 매니저(Node Package Manager)의 줄임말로, 노드를 설치할 때 자동으로 설치되는 기본 패키지 관리자입니다. 크게 두 가지 역할을 수행합니다.
- 온라인 플랫폼
- 개인이 노드 패키지를 만들고, 업로드하고, 공유할 수 있는 (Hub 역할을 하는) 온라인 플랫폼(npm registry)을 모두가 사용할 수 있죠.
- 명령 줄 인터페이스(CLI)
- 온라인 플랫폼과 상호작용하며, 로컬에 패키지의 설치 및 제거가 가능합니다.
- 의존성 관리를 위해 자동으로
package.json파일에 설치된 패키지의 이름 및 버전 등을 기록해주며, 이 파일만 가지고 npm에서 같은 패키지를 설치해, 결과적으로 개발 당시와 똑같은 환경으로 쉽게 구성이 가능합니다.
yarn
yarn은 2016년 페이스북에서 개발한 패키지 관리자입니다. 리액트 프로젝트 진행 중 어려움을 해결하기 위해 개발되었으며, 기존에 있었던 npm과 호환하면서 속도나 안정성 측면에서 향상되었습니다.
주요 차이점
- npm은 패키지를 한 번에 하나씩 순차적으로 설치합니다.
yarn은 여러 패키지를 동시에 가져오며 최적화되어 있어 더 빠릅니다. - yarn은 보안 측면에서 더 안전합니다. npm은 자동으로 패키지에 포함된 다른 패키지 코드를 실행하는데, 이로 인해 해킹이 발생할 수 있습니다.
최근 npm이 업데이트되어 이런 문제도 상당 부분 해결되었다고 합니다. - 주요 명령어 차이를 정리하면 다음과 같습니다.
| 명령 | npm | yarn |
|---|---|---|
| dependencies 설치 | npm install | yarn |
| 패키지 설치 | npm install [패키지명] | yarn add [패키지명] |
| 패키지 제거 | npm uninstall [패키지명] | yarn remove [패키지명] |
| 업데이트 | npm update | yarn upgrade |
| 패키지 업데이트 | npm update [패키지명] | yarn upgrade [패키지명] |
그 외에도 start, build, test 등 다양한 부가 명령이 있습니다.
테스트 코드의 필요성
테스트 코드는 결국 대상 코드를 더욱 강건하게 만듭니다.
풀어서 설명하면 다음과 같은 장점이 있겠습니다.
- 예상치 못한 오류의 발생을 미연에 방지합니다.
- 대상 코드에 대한 이해를 돕습니다.
- 소프트웨어를 유지보수하는 데 필요한 문서화 작업을 줄일 수 있습니다.
테스트 주도 개발 (TDD)
지인으로부터 추천을 받아 관련 개념을 찾아봤는데, 흥미롭기도 하고 꼭 한번 실천해보고 싶어서 공유해 봅니다 ㅎ ㅎ 인용하면 다음과 같습니다.
테스트 주도 개발(test-driven development,
TDD)은 소프트웨어 개발 방법론 중의 하나로, 선 개발 후 테스트 방식이 아닌 선 테스트 후 개발 방식의 프로그래밍 방법을 말한다. 다시 말해 먼저 자동화된 테스트 코드를 작성한 후 테스트를 통과하기 위한 코드를 개발하는 방식의 개발 방식을 말한다.
URL에서 File Path를 다루는 방식
URL의 구성은 다음과 같습니다.
| 구성 | 구분 | 설명 |
|---|---|---|
| http:// | protocol | 통신에 사용되는 방식 |
| blog.naver.com | host | 웹서버의 IP나 도메인 |
| /kim/123 | url-path | 루트 디렉토리부터 자원이 위치한 장소까지의 상대 경로 |
| ?mode=view | query | 웹 서버에 추가로 넘겨주는 파라미터 |
잘 아시겠지만, 여기서 url-path에 해당 하는 부분이 일반적으로 실제 파일 경로에 해당합니다. 리눅스에서 자주 사용되는 /var/www/html/ 등의 웹 서버 루트 디렉토리 하위에 파일과 디렉토리를 두면, 웹 호스팅 이후 여기에 url을 요청하면 네트워크로 내 local PC로 해당 파일을 받아올 수 있는 식이죠.
물론 요즘은 가상 경로를 활용하는 경우도 많고, 보안적인 이유로 디렉토리 리스팅은 대부분 default로 금지되어 있습니다.
하여간 그렇더라도 이 경로를 이용해서 다양한 웹 서버의 자원을 제공하는게 웹 서버의 목적이기에, (특히 API서버면) 경로가 곧 특정 기능을 지칭하는 목적으로도 사용되니, 파일 경로의 처리는 웹 개발에서 빈번히 사용되는 로직이라고 할 수 있습니다.
정규 표현식 활용 사례
- 전화번호, 이메일, 주민등록번호 등의 형식 체크
- 입력된 값의 유효성을 검증하는 데 사용합니다.
- 파일 확장자 확인
- 전달받은 파일 경로에서 확장자를 확인하여 특정 확장자 파일을 거부하는 등 파일 업로드에서 많이 활용합니다.
- 패스워드 등의 복잡성 체크
- 패스워드 ~자리 이상, 대소문자 포함, 숫자 포함, 특수문자 포함 등 다양한 조건에 맞는 복잡한 패스워드를 요구할 때 사용합니다.
- 신용카드번호, 계좌번호, 날짜 등의 입력 형식 체크
- 유효성 검증 외에도 하이픈(’-’)이나 띄어쓰기(’ ‘) 등 사용자마다 다양하게 입력될 수 있는 값에서 원하는 정규 표현으로 변환시키기 위해 사용합니다.
