Frameworks/Node.js

Jest란? javascript 파일을 테스트 하는 Node.js 패키지 Jest 설치 npm i jest Jest 사용법 파일 생성 // exam.js function sum(a, b) { return a + b; } module.exports = sum; 테스트 파일 생성 // sum.test.js const sum = require('./sum'); test('1 + 2 가 3인가 테스트', () => { expect(sum(1,2)).toBe(3); }); package.json에 명령어 생성 //package.json { "scripts": { "test": "jest" } } 명령어 사용해서 테스트 하기 // npm npm run test // yarn yarn test

ref에 기능추가하기 // useRef const idRef = useRef(null); const { ref, ...rest } = register("id"); // 기능추가 useEffect(() => { if (idRef.current !== null) { console.log(idRef.current) } }, [idRef]); // Html { ref(e); idRef.current = e; }} /> tab키 인식해서, 다음 input focus하기 // setFocus const { register, setFocus, ...생략 } = useForm(); const handleOnKey = (e) => { if(e.key === "Tab"){ // 기존 tab기능 제거 e.preventDef..

degit 이란? npm으로 git 저장소를 쉽게 다운로드 받을 수 있도록 만든 Node.js 패키지 degit 설치 npm i degit degit 사용법 // 설치없이 간단 사용 npx degit // 유저와, 저장소이름으로 받아오기 degit /

Google People API 구글 사용자 정보를 가져와주는 API Google OAuth 2.0 자신의 정보에 대한 접근 권한을 주고 받는 프로토콜 [ OAuth ] 지정된 사용자를 대신해, API를 호출하는 방식 사용자는 앱을 방문해, 자신의 Google 계정으로 로그인하고, 특정 정보에 접근 할 수 있도록 승인해줌 [ API KEY ] API키를 사용하여, 클라이언트 or 서버에서 서비스에 접근할 수 있다. 제한된 범위의 서비스에서만 사용할 수 있다 [ Application default credentials ] 로컬 개발용 Google Cloud SDK 또는, Google Cloud Platform에 배포된 앱용 GCE 메타데이터 서버를 사용하여 Google API에 접근할 수 있다. [ Ser..

morgan 이란? http 요청과 응답이 있을때마다, 명령창에 로그로 보여주는 Node.js 패키지 morgan 설치 npm i morgan morgan 사용법 1. express 서버에서 사용 import logger from "morgan" import http from "http" // express 서버 만들고 미들웨어로 morgan 로거 추가 const app = express() app.use(loggger("tiny")) // http 서버 만들고 실행 const httpServer = http.createServer(app); httpServer.listen({ port }, () => console.log(`🚀 Server is running on https://localhost:${p..

knex 이란? javascript 객체에 기본적으로 포함되어있는 메서드 GitHub - knex/knex: A query builder for PostgreSQL, MySQL, CockroachDB, SQL Server, SQLite3 and Oracle, designed to be flexible, A query builder for PostgreSQL, MySQL, CockroachDB, SQL Server, SQLite3 and Oracle, designed to be flexible, portable, and fun to use. - GitHub - knex/knex: A query builder for PostgreSQL, MySQL, C... github.com sequelize 이란? ..

swr이란? React에서 데이터를 가져오기 위한 React Hooks ( Node.js 패키지 ) React Hook이란? [React] React Hooks란? / 사용법 ( useState, useEffect 등등.. ) React Hooks란? React 에서 기존에 사용하던 Class를 이용한 코드를 작성할 필요 없이, state와, 여러 React 기능을 사용할 수 있도록 만든 라이브러리 React Hook의 필요성 함수 컴포넌트도 클래스 컴포넌트 defineall.tistory.com swr의 필요성 swr을 사용하면 구성 요소가 지속적이고, 자동으로 데이터 업데이트 스트림을 주고 받는데, 이는 빠르고, 반응적인 UI를 만들 수 있게 해줍니다!  swr 설치하기 npm i swr swr 사..

TypeGraphGL이란? TypeGraphQL · Modern framework for GraphQL API in Node.js Modern framework for GraphQL API in Node.js typegraphql.com 프론트엔드의 Typscript에서 Graphql API를 불러올때, 타입을 쉽게 지정할 수 있도록 해주는 Node.js 패키지 TypGraphQL 설치 npm i graphql class-validator type-graphql // reflect 기능 사용시 추가 - ㅇㄹ npm i reflect-metadata

Formik 란? React에서 간단하게 form을 만들 수 있게 해주는 Node.js 패키지 react-hook-form 과의 차이점 react-hook-form은 폼의 조건을 각각 따로 적어주는 반면, Formik는 폼의 조건을 한군데에 모아서 적어준다. Formik 설치 방법 npm i formik Formik 사용법 //Login.js // Formik 모듈 불러오기 import { ErrorMessage, Field, Form, Formik } from "formik"; const Login = () => { return ( { const errors = {}; if (!values.email) { errors.email = "Required"; } else if ( !/^[A-Z0-9._%+-..