Root

Nest.js 란? node.js 로 데이터베이스를 구성할 수 있게 해주는 프레임워크 ( typescript와 express를 이용한다. - 프레임워크의 프레임워크 ) Nest.js의 필요성 큰 규모의 프로젝트의 데이터베이스를 만들기 쉽다. Nest.js 설치 npm i -g @nestjs/cli Nest.js 프로젝트 만들기 nest new 프로젝트 Nest.js 서버 실행하기 npm run start:dev yarn start:dev Nest.js 기본 동작 main.ts가 가장 먼저 실행되고, module, controller, service로 앱을 만든다. controller url에서 정보를 받아, 라우팅해주는 역할 // app.controller.ts import { Controller, Ge..

insomnia 란? Rest API를 쉽게 테스트 할 수 있게 해주는 프로그램 insomnia 설치 Download Download Insomnia the best API Client for REST, GraphQL, GRPC and OpenAPI design tool for developers insomnia.rest insomnia 사용법

// tsconfig.json { "compilerOptions": { // 옵션 형식으로 구성되어 있습니다. // "모듈 키": 모듈 값 /* 설명: 사용가능 옵션 (설명이 "~ 여부"인 경우 'true', 'false') */ /* 기본 옵션 */ // "incremental": true, /* 증분 컴파일 설정 여부 */ "target": "es5", /* 사용할 특정 ECMAScript 버전 설정: 'ES3' (기본), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019', 'ES2020', 혹은 'ESNEXT'. */ "module": "commonjs", /* 모듈 불러오는 코드 방식 설정: 'none', 'commonjs', 'amd', 'sys..

자주사용하는 것은 글로벌 설치 yarn global add typescript 프로젝트 전용 설치 yarn add @prisma/client graphql apollo-server ts-node nodemon @graphql-tools/schema @graphql-tools/merge @graphql-tools/load-files nodemon + ts-node 설정하기 //package.json에 nodemon 명령어 만들기 { "scripts": { "dev": "nodemon --exec ts-node src/server --ext ts,js" } } typescript 설정 파일 수정하기 // tsconfig.json ( ts => js 로 컴파일 될때 사용 ) { "include": ["src/..

database 리스트 확인하기 \l database 생성, 삭제 // 데이터베이스 생성 CREATE DATABASE "데이터베이스"; // 데이터베이스 삭제 DROP DATABASE "데이터베이스"; 사용자 생성, 삭제 // 사용자 만들기 CREATE USER 사용자; // 사용자 삭제하기 DROP USER 사용자; 사용자 리스트 확인하기 /dg, /du 사용자 권한 database 생성하기 CREATE DATABASE 데이터베이스 OWNER 사용자; 사용자 권한 database 접속하기 \c 데이터베이스 사용자 table 생성하기 CREATE TABLE 테이블이름 ( 필드이름1 필드타입, 필드이름2 필드타입, ... ); table 리스트 확인하기 \d table 내용 확인하기 \d "테이블" Pos..

npx create-next-app@latest --ts // yarn create next-app --typescript

Frame : HTTP/2의 통신상 가장작은 정보, ( Header, Data ) Message : 요청과 응답, 다수의 Frame으로 이루어져 있다 ( Request, Respond ) Stream : 클라이언트와, 서버간의 주고 받는 여러개의 Message

Next.js로 CSS 스타일링 하기 1. styled-jsx 사용하기 ( Next.js 기본 내장 ) // style jsx는 컴포넌트 단위로 적용됩니다. ( 다른 컴포넌트로 넘어가면 적용안됨 ) // 기본 사용 방식 // 자식 컴포넌트까지 모두 적용하기 {` ...스타일 추가 `} 2. styled-components 사용하기 [React] styled-components란? / 사용법 (js/ts) styled-components란? React.js 안에서 스타일(CSS)을 바꿀 수 있게 해주는 Node.js 패키지 React란? [Node.js] React.js 란? / React 사용법 ( create-react-app ) React란? 웹/앱의 사용자 조작환경(UI)를 만들.. defineal..

Next.js에서 외부(Third-party) javascript 불러오기 1. 메타데이터에 추가하기 이 접근 방식은 효과가 있지만 이러한 방식으로 스크립트를 포함하면 동일한 페이지에서 가져온 다른 JavaScript 코드를 불러오는 시기가 불명확합니다. 특정 스크립트가 렌더링을 차단중이고 페이지 콘텐츠 로드를 지연시킬 수 있는 경우, 성능이 저하될 수 있습니다. 2. 태그 사용하기 // Script 태그 사용하기 위해 불러오기 import Script from "next/script" export default function FirstPost() { return ( console.log(`script loaded correctly, window.FB has been populated`) } /> Fi..