개발 블로그

Prettier 코드의 줄 간격이나 행을 자동으로 갈끔하게 정리해주는 VSCode의 확장 프로그램이다. > 자동 적용 안될 경우 1. setting에서 format on save를 검색하고 설정에 체크되어 있는지 확인한다. 2. default formatter를 prettier-code formatter (exbenp.prettier-vscode)로 설정한다.

Prisma: ORM으로 객체를 schema로 정의한 다음, 그 객체와 내가 선택한 DB를 연결시켜주는 매개체Node.js와 Typescript ORM직관적인 데이터모델, 자동화된 마이그레이션, 타입안정성, 자동완성 기능 💡ORM ( Object Relational Mapping ) : ‘객체로 연결’객체와 관계형 데이터베이스의 데이터를 자동으로 mapping(연결)해주는 framwork객체지향 프로그래밍은 class를 사용하고, 관계형 db는 table을 사용하기 때문에 객체모델과 관계형 모델간에 불일치가 존재 → ORM을 통해 객체간의 관계를 바탕으로 SQL을 자동으로 생성하여 불일치를 해결app과 db연결 시 SQL언어가 아닌 application 개발 언어로 db를 접근할 수 있게 해주는 툴OR..

Prisma Modern Database Access for TypeScript & Node.js > Typescript 와 Node.js 환경에서 데이터베이스에 대한 접근을 쉽게 하도록 도와주는 소프트웨어(오픈소스) > 기존에 Node 환경에서 사용되던 다른 ORM(Object Relational Mapper)들을 대체 //Prisma 패키지 설치 npm install prisma --save-dev npm install @prisma/client --save //nodemon : 코드변경 서버에 바로 적용 //dotenv : 환경변수를 사용할 수 있게 해줌 npm install dotenv nodemon -D > Prisma 시작 //명령어 확인 npm prisma //prisma 초기세팅 npx p..

Named exports : 많은 것들을 export / import 하고 싶을 때 : export 된 이름과 같아야 함 // math.js export const plus = (a,b) => a + b; export const minus = (a,b) => a - b; export const divide = (a,b) => a / b; // main.js // export한 이름 그대로 사용 import {plus} from "./math"; // import하는 이름을 바꾸고 싶을 때 as import {plus as add} from '.math'; export default : 여러 함수를 갖고있는 한개의 객체를 디폴트로 export : 각 파일마다 단 한개의 Default export 만 존재 ..

1. --save-dev 옵션없이 설치했을 때 npm install nodemon 이렇게 --save-dev 옵션없이 nodemon 패키지를 설치했을 때, package.json 파일의 내용을 보면 { "name": "cowork-api-server", "version": "1.0.0", "description": "", "main": "app.js", "scripts": { "start": "node app.js", "dev": "nodemon app.js" }, "author": "", "license": "ISC", "dependencies": { "express": "^4.17.1", "nodemon": "^2.0.7" // !!!!! }, "devDependencies": { } } depend..

1. 패키지를 공유할 때, 그 안의 node_modules 디렉토리는 공유하지 않는다. 하나의 패키지는 여러 명의 개발자가 협력해서 만드는 게 일반적입니다. 그럼 이때 협력하는 개발자들끼리는 패키지를 어떻게 공유할까요? 패키지는 package.json 파일이 있는 디렉토리니까 이 디렉토리를 서로 주고받으면 되는데요. 이때 중요한 점이 하나 있습니다. 패키지를 공유할 때, 패키지 안에 있는 node_modules 디렉토리는 보통 공유하지 않는다는 점입니다. node_modules 디렉토리가 뭐였죠? 현재 작업 중인 패키지에서 이런저런 패키지들을 설치하면 그것들이 설치되는 곳이었습니다. 그런데 이렇게 중요한 node_modules 디렉토리를 왜 공유하지 않는 걸까요? 왜냐하면 보통 패키지를 몇 개 정도만 설..

ERROR 대표적 에러 3가지 ReferenceError : 존재하지않는 변수나 함수 호출 TypeError : 잘못된 방식으로 자료형다룸 (변수를 함수처럼 호출) SyntaxError : 문법 맞지않는 호출 https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Error Error - JavaScript | MDN Error 객체는 런타임 오류가 발생했을 때 던져집니다. Error 객체를 사용자 지정 예외의 기반 객체로 사용할 수도 있습니다. 아래 표준 내장 오류 유형을 참고하세요. developer.mozilla.org Try catch : javascript에서 에러가 발생하면 스크립트는 중단되고 콘솔에 에러가 출..

프로퍼티, 메소드 간결하게 표현 // 변수의 이름과 프로퍼티 네임 같으면 생략가능 const user = { title, // = title : title birth // = birth ; birth } //객체 내부에서 메소드 함수호출시 콜론기호와 function 생략가능 const user = { firstname, lastname, fullname : function() { return `{this.firstname} ${this.lastname}`; } }; > const user = { firstname, lastname, fullname () { return `{this.firstname} ${this.lastname}`; } }; // 계산된 속성명 (computed property name..

자바스크립트로 태그 선택하기 메소드 의미 결과 document.getElementById('id') html id 속성으로 태그 선택 id에 해당하는 태그하나 document.getElementByClassName('class') html class 속성으로 태그 선택 class에 해당하는 tag document.getElementByTagName('tag') html tag name으로 태그 선택 tag에 해당하는 태그모음 document.querySelector('css') css선택자로 태그 선택 css선택자에 해당하는 태그 중 첫번째 태그 document.querySelectorAll('css') css선택자로 태그 선택 css선택자에 해당하는 태그 모음 getElementById > id로 태그..

C.R.U.D CRUD = Create + Read + Update + Delete 데이터의 생성, 조회, 수정, 삭제 컴퓨터 소프트웨어가 가지는 기본적인 데이터 처리 기능인 Create, Read, Update, Delete를 묶어서 말하는 것이다. DB SQL문과 대응된다. Create-Insert / Read-Select / Update-Update / Delete-Delete Prisma Client prisma로 연결되어 있는 db의 table들을 쉽게 접근할 수 있게 해주는 client역할. prisma.schema 파일에서 정의한 table,col 이름을 직접 사용할 수 있게 함. 설치 npm install @prisma/client --save prisma generate : prisma...