react 세팅 (2) 썸네일형 리스트형 [#. React] React+Typescript+Tailwind CSS 프로젝트 초기 세팅하기 Tailwind CSS는 마크업에서 직접 모든 디자인을 구축하도록 구성할 수 있 고 flex, pt-4, text-center와 같은 클래스를 사용하는 프레임워크다 Tailwind CSS에서 정해놓은 클래스명을 사용해서 HTML 코드 내에서 쉽게 CSS를 작성할 수 있다 장점 Utility-First의 편리함과 빠른 개발 자유롭고 쉬운 커스텀 단점 초반에 파악하기 위한 시간 필요 HTML와 CSS 코드 혼재(가독성) $ yarn create react-app [프로젝트명] --template=typescript $ yarn add -D tailwindcss postcss autoprefixer postcss-cli npm-run-all -D 옵션 => 패키지를 개발 종속성으로 추가 📁src 📁styles.. [#. Node] Node+React 시작하기, 초기 세팅하기 ① node 시작하기, express-generator 설치 mkdir node-react npm install --save express-generator express-generator 패키지를 통해서 프레임워크에 필요한 pakage.json과 기본 구조를 잡을 수 있다 express 새 express 프로젝트를 생성한다 cd npm install 생성한 프로젝트로 이동해서 npm 모듈을 설치해 준다 이 구조로 생성이 된다! bin/www http 모듈에 express 모듈을 연결하며, 포트를 지정 서버를 실행하는 스크립트 port를 3000=>5000으로 수정함 public 각종 리소스들을 모아놓은 폴더로 외부(브라우저 등의 클라이언트)에서 접근 가능한 파일들을 모아 둔 디렉토리 routes 라우터.. 이전 1 다음
