본문 바로가기
728x90

전체 글123

GB와 GiB: 기가바이트와 기비바이트의 차이점 GB, GiB 이란 무엇인가요?공통점두 접두사 모두 디지털 기기의 측정 단위 차이점GB : 전통적인 단위입니다,metric 1GB는 1,000³ 바이트에 해당하는 측정 스타일GiB : 바이너리 메서드를 사용한 컴퓨터 저장장치의 단위,1 GiB는  1024³ 바이트 에 해당하는 측정 스타일  GiB 사용하는 경우바이너리 메서드는 메모리 크기 즉, 컴퓨터의 저장장치의 용량을 말한다.GiB는 메모리나 저장장치의 용량을 보다 정확하게 계산하고 표기하는 데 활용한다.예시)컴퓨터의 RAM이나 SSD/HDD의 용량은 실제 데이터 저장 공간을 바이트 단위로 나열하는 방식이므로, 이진 접두사인 GiB, TiB 등을 사용해 용량을 표시하는 것이 보다 정확한 표현이 됩니다.GB vs GiB-왜 소문자 'i'인가요?기비바이트.. 2024. 11. 15.
패키지 로드 방법 비교: NPM vs CDN의 차이점 개요프론트엔드 개발을 하다 보면 라이브러리를 추가하는 방법으로 NPM과 CDN을 자주 접하게 됩니다. 하지만 이 두 가지 방식은 각각의 장점과 단점이 있으며, 상황에 따라 적절한 방식을 선택하는 것이 중요합니다. 이번 글에서는 NPM과 CDN의 차이점을 정리하고, 언제 어떤 방법을 사용하는 것이 좋은지 알아보겠습니다. NPM (Node Package Manager)NPM은 JavaScript 패키지 매니저입니다. 주로 주로 Node.js 및 웹 개발에 사용됩니다.오픈소스 라이브러리를 관리하고 설치할 수 있게 해줍니다. npm 특징로컬 환경(개발 환경)에서 패키지를 설치하여 사용package.json을 통해 패키지 및 버전 관리 가능node_modules 폴더에 라이브러리를 저장하여 오프라인에서도 사용 가.. 2024. 11. 8.
npm 패키지 설치 및 호환성 관리 | npm install, update 개요라이브러리 업데이트와 버전 관리는 프로젝트에서 중요한 부분입니다. 의존성 모듈과 개발 환경 모듈을 명확하게 구분하는 것이 중요합니다.Node.js 버전은 프로젝트에서 확실히 정의해야 하며, 라이브러리는 신중하게 추가하고 필요할 때만 정기적으로 업데이트하는 것이 좋습니다.라이브러리가 많아질수록 관리가 어려워지므로, 의존성 관리에 신경을 써야 합니다. [Node.js] Node.js 기본 개념 및 환경 설정: package.json 파일 구성 방법https://sillimmouse.tistory.com/82  npm install// 실제 애플리케이션에서 필요한 라이브러리를 설치$ npm install // 개발 환경에서만 필요한 라이브러리를 설치$ npm install --save-dev 플래그 효.. 2024. 11. 8.
Git submodule 시작하기 배경다른 프로젝트의 기능을 앱에 추가하는 방법으로 모노레포 방식을 사용할 수 있지만, 각 프로젝트를 독립적으로 관리해야 하는 경우에는 적합하지 않다.Git Submodule은 메인 프로젝트에서 외부 링크 형태로 서브 프로젝트를 연결해 두었다가, 필요할 때 최신 변경 사항을 가져와 작업한다.이 방식은 서브 프로젝트의 별도 사본을 만들지 않으며, 원래 저장소의 최신 상태를 유지하면서 개발을 진행할 수 있게 해줍니다. 서브 프로젝트는 독립적으로 버전 관리를 유지하면서도, 메인 프로젝트와 쉽게 통합할 수 있습니다. main project와 submodule project 관계main project에 submodule을 추가하여 사용한다.main project에 root에 submodule들을 관리하기 위한 .g.. 2024. 9. 27.
Window 10 단축키 완벽 정리 개요효율적으로 윈도우를 사용하기 위해, window 에서 자주 사용하는 단축키를 알아보자 가장 많이 사용하는 TOP 10 Ctrl + C : 선택한 항목 복사Ctrl + V : 선택한 항목 붙여 넣기Ctrl + X : 선택한 항목 잘라내기Ctrl + Z : 작업 실행 취소Ctrl + A : 모든 항목 선택Alt + Tab : 열려 있는 앱 전환Alt + F4 : 활성 항목 종료 (앱 또는 창 닫기)윈도우 키 + D : 바탕 화면 숨기기 또는 표시윈도우 키 + L : 로그인 화면으로 이동 (컴퓨터 잠금)Ctrl + F : 문서나 웹 페이지에서 찾기   단축키 상세기본 단축키Ctrl + X : 선택한 항목 잘라내기Ctrl + C (또는 Ctrl + Insert) : 선택한 항목 복사Ctrl + V (또는 S.. 2024. 9. 27.
WSL에서 개발 환경 구축하기 | Node.js, Git, VSCode 개요Windows 환경에서도 리눅스 개발 환경을 사용할 수 있게 해주는 WSL(Windows Subsystem for Linux)은 많은 개발자들에게 사랑받는 기능입니다. 이번 포스팅에서는 WSL 위에 개발 환경을 구성하는 방법을 소개합니다. 특히 VSCode, Git, Node.js를 중심으로 단계별로 설치해보겠습니다. WSL 설치 및 설정 WSL 활성화 및 리눅스 배포판 설치 https://sillimmouse.tistory.com/104 WSL에 개발 도구 설치하기Git 설치 및 설정git 설치sudo apt updatesudo apt install git git 설치 확인git --version git 설정git config --global user.name "Your Name"git config.. 2024. 9. 26.
인클루시브 디자인(inclusive design) | 웹 접근성 개요디지털 서비스가 일상 생활에 큰 영향을 미치는 오늘날, 누구나 쉽게 접근하고 이용할 수 있는 웹 환경을 제공하는 것은 필중요합니다.모든 사용자가 차별 없이 콘텐츠에 접근할 수 있도록 보장하는 것은 사회적으로도 중요하며 사용자 경험을 개선 및 넓은 사용자층을 확보하여 회사에도 영향을 줍니다.사용자 인터페이스 개선에 관련하여 웹 프론트엔드 개발자가 다양한 사용자의 요구를 반영 해야하는 이유와 방법 등을 알아보자 인클루시브 디자인 (Inclusive Design) 이란?다양한 사용자들이 제품이나 서비스를 이용할 수 있도록 설계하는 방법론포괄적인 디자인은 제품, 서비스 또는 환경이 가능한 한 많은 사람들, 특히 전통적으로 인터페이스를 사용하거나 환경을 탐색할 수 없도록 배제된 그룹이 사용할 수 있도록 디자인.. 2024. 9. 26.
[ERROR] react_devtools_backend_compact.js:13851 Warning: Failed prop type: Invalid prop `onChange` of type `boolean` supplied to `ForwardRef(TextField)`, expected `function`. 오류 메시지react_devtools_backend_compact.js:13851 Warning: Failed prop type: Invalid prop `onChange` of type `boolean` supplied to `ForwardRef(TextField)`, expected `function`.  원인value로 받는 타입과 리턴으로 받는 타입이 일치하지 않아서 발생하는 메시지이다.정해진 타입으로 받을 수 있도록 코드를 수정해야 한다.해당 코드const value: string;onChange: (_e: React.ChangeEvent) => void;const handleChange = () => { if (maxLength) { if (value.length > maxLen.. 2024. 9. 19.
WSL을 사용하여 Windows에 Linux를 설치하기 개요Docker는 리눅스 환경을 기반으로 설정되어 있기 때문에, Windows에서 mount나 파일 수정 같은 작업에서 제약을 느끼곤 합니다. 리눅스 환경으로 접근하는 방법은 다양하지만, 이번 포스팅에서는 WSL을 사용하여 리눅스에 접근하고 설정하는 방법을 다루려고 합니다.또한, 리눅스로 설정된 환경에 노드 프로젝트를 띄우기 위해 필요한 도구들을 설치하고, Windows 앱에 설정을 해준 뒤 프로젝트 환경을 구축해보려고 합니다.  WSL (Windows Subsystem for Linux)란 무엇인가. 윈도우 운영체제에 포함된 리눅스용 하위 시스템별도의 가상 머신 또는 이중 부팅 없이 Windows 컴퓨터에서 Linux 환경을 실행할 수 있는 Windows의 기능을 지원해준다.Windows와 Linux를.. 2024. 8. 30.
728x90