본문 바로가기

분류 전체보기

(5)
프론트 환경 설정(ESLint, Prettier, Axios, Tanstack Query, MSW, Shadcn UI) 이전 포스팅에서 PNPM, Vite, React, TypeScript, TailwindCss 를 설치 및 설정하였고, 이번 포스팅에서 이어서 진행해보겠다.https://miroong.tistory.com/7 프론트 환경 설정(PNPM, Vite, React, TypeScript, TailwindCss)프로젝트를 시작할 때 보통 스캐폴딩 도구(CLI)를 사용하거나 이전에 사용했던 설정 파일을 복사해서 쓰곤 했었는데, 모노레포 구조를 연습하는 과정에서 많은 어려움을 겪었고, 프로젝트 설정miroong.tistory.com 5. eslint + prettier 설치 및 설정코드 포맷팅을 도와주는 prettier 를 먼저 설정 하도록 하겠다. prettier 도 개발시에만 필요한 패키지이므로 -D 옵션을 주어 ..
프론트 환경 설정(PNPM, Vite, React, TypeScript, TailwindCss) 프로젝트를 시작할 때 보통 스캐폴딩 도구(CLI)를 사용하거나 이전에 사용했던 설정 파일을 복사해서 쓰곤 했었는데, 모노레포 구조를 연습하는 과정에서 많은 어려움을 겪었고, 프로젝트 설정에 대해 기본적인 개념을 공부해야할 필요성을 느꼈다. 프로젝트 초기 설정 방법을 공부하려는 목적인 만큼 스캐폴딩 도구 없이 굳이 빈폴더에서 부터 시작하여 평소 사용해 본 도구 및 라이브러리를 모두 추가하며 설정에 대해 공부한 내용을 기록해보았다.추가 될 예정인 도구 및 라이브러리패키지 매니저 : PNPM빌드 도구 : Vite코어 : React, TypeScript스타일링 : Tailwind CSS, Shadcn UI데이터 및 네트워크 : Axios, Tanstack Query, MSW코드 퀄리티 : ESLint, Pret..
IP 주소가 생긴 이유 (인터넷의 탄생) 도커의 포트 매핑을 공부하다 가장 기본 개념이 되는 IP와 네트워크에 대해 두루뭉술하게만 알고 있다고 느껴서 다시 공부한 내용을 정리해 보았다. ‘IP 주소’ 라는 게 어쩌다 나왔을까 컴퓨터는 서로 데이터를 주고받는 등의 통신을 하기 위해 ‘IP 주소’를 사용하는데, 이건 마치 우리가 전화하기 위해 상대방의 연락처를 사용하는 것과 비슷하다. 근데 이 IP 주소는 컴퓨터가 만들어진 초기부터 사용되었던 건 아니다. ‘컴퓨터’가 이제 막 사용되기 시작한 당시에는 각 컴퓨터 간의 물리적인 전용 통신 회선을 미리 설정 해놓고 통신이 끝나기 전까지 그 회선을 독점적으로 사용하는 방식의 ‘회선 교환(Circuit Switching)’ 방식을 사용하고 있었다. 회선 교환 방식은 두 서버(컴퓨터 등)가 통신하기..
자바의 자료형과 가상 메모리 공간에 대해 자바의 자료형은 기본 자료형과 참조 자료형으로 나뉜다. 기본 자료형 종류 (Primitive Data Type) - byte, short, int, long, float, double, boolean, char 참조 자료형 종류 (Reference Data Type) - String, array, Object 등 기본 자료형의 종류를 보면 크기가 고정된 단순한 값들이 기본 자료형으로 분류되는 걸 알 수 있다. 반면 참조 자료형의 종류를 보면 대체로 의미를 가진 값들이 담겨지게 되는데, 자바는 이처럼 의미를 가진 데이터들에 대해 추상화 하여 객체로 다루는 ‘객체 지향’의 특성을 가지고 있어, 참조 자료형으로 구분하게 된다. 그리고 자료형을 이렇게 구분한 데에는 이..
[JavaScript] ES5와 ES6 비교하기, 예제 코드 정리 기존엔 ES5, ES6 버전에 따른 차이를 인지하지 못하고, 구글링해서 나오는 방법으로 코드를 작성했었다.그러다 리액트를 공부하면서 두 버전에 따른 차이를 알게 되었고, (화들짝 놀라버렸다) 새로운 버전에 대해 공부하고 활용하는 것이 얼마나 중요한지 깨닫게 되어 정리해보았다.   ES란 ?          ES5 보다 ES6가 높은 버전이라는건 알겠는데, 앞에 붙는 ES가 뭔지 잘 모르겠다면, 짤막하게라도 알고 가자.ES는 ECMAScript 의 줄임말로, Ecma 인터내셔널에서 정의한 표준 스크립트 문법이다.JavaScript는 스크립트 언어의 종류이며, ECMAScript 를 따른다.ECMAScript와 JavaScript는 서로를 기반으로 하기 때문에 용어를 혼용해서 사용한다.  ES5 와 ES6 ..