본문 바로가기

MATHrone

(11)
[FE] BookList page(2) - 검색창 만들기 BookList Page를 만들어보자 구조 잡기 검색창 만들기 nav bar만들기 이미지 리스트 만들기 페이지네이션 구현하기 정렬 넣기 구조잡기 단계에서 검색창 부분은 따로 있었다 일단 그 부분을 만들어주고 컨테이너 위에다 붙여주기로 한다. 일단 기능은 안 줄 것 ! Books.js import * as React from "react"; import Container from "@mui/material/Container"; export default function BookPage() { return ( A B C D E F ); } 이렇게 6개의 구간으로 나눈 컨테이너 위쪽에다가 Component로 SearchBar를 따로 만들어 넣어줄 생각이다. 일단 이런 모양으로 만드는게 목표이다 SearchBa..
TypeScript - 제네릭, 유틸리티 타입 Generic 클래스, 함수, 인터페이스를 다양한 타입으로 재사용 가능 선언할 때는 타입파라미터만 적어주고, 생성하는 시점에 타입 파라미터를 결정 코드를 재사용하는데 아주 유용하게 사용된다 함수 function getSize(arr) : number { return arr.length; } const arr1 = [1,2,3]; // 매개변수가 숫자 배열 getSize(arr1); //3 const arr2 = ["a","b","c"];//매개 변수가 문자열 배열 getSize(arr2); 다음과 같이 매개변수의 타입이 다른 경우 함수 오버로드 와 유니온 타입으로 해결 //함수 오버로드 + 유니온 타입 function getSize(arr :number[]): number; fucntion getSize..
TypeScript - 클래스, 접근제한자 class member변수를 미리 선언해야함 class Car { name; //member변수를 미리 선언해두어야함 constructor(name :string){ this.name = name; } start(){ console.log("start"); } } public / readonly를 사용해주면 member변수를 미리 선언하지 않아도 됨 Access modifier 접근 제한자 private / public / protected 접근 제한자 설명 public 자식 클래스나, 클래스 인스턴스에서 접근이 가능한 값(default) private (or #) 자식 클래스에서 접근 불가능함, 자신 내부에서만 사용할 수 있게됨 protected 자식 클래스에서 접근이 가능함, 클래스 인스턴스에서는 참..
TypeScript - 함수, 리터럴, 유니온, 교차 타입 함수 파라미터의 타입과 리턴값의 타입을 지정해 줄 수 있다(필수 아님) function hello(name : string) : string { return `Hello, ${name}`'; } const result = hello("YJ"); string타입인 name을 파라미터로 받고 string을 return하는 함수 |를 이용해서 여러 타입을 받을 수도 있다. function hello(name : string | number) : string { return `Hello, ${name}`'; } const result = hello(1); const result2 = hello("yj"); number를 받을 수도 있다. 파라미터의 속성 파라미터에 속성을 줄 수 있다. 속성 4가지 예시 inte..
TypeScript - 기본타입, 인터페이스 자바스크립트와의 차이점 Javascript(동적언어) 런타임에 타입이 결정되며, 오류를 발견함 function add(num1, num2) { console.log(num1 + num2); } add();//NaN add(1);//NaN add(1,2);//3 add(3,4,5);//7 add("hello","world");//helloworld Java, TypeScript(정적언어) 컴파일 타임에 타입 결정되며, 오류를 발견함 function add(num1:number, num2:number) { console.log(num1 + num2); } add();//error add(1);//error add(1,2);//3 add(3,4,5);//error add("hello","world");//er..
[DB] PostgreSQL 진행 리뷰 [MR-39] db 테이블 setting table 리스트 table 명 용도 workbook 문제집과 관련된 정보를 저장하는 테이블 workbook_try 특정 문제집을 사용한 이력이 있는 유저를 저장해두는 테이블 workbook_level 문제집 난이도 투표수를 저장하는 테이블 workbook_star 특정 문제집을 즐겨찾기 해둔 특정 유저를 저장하는 테이블 chapter 문제집의 목차(단원명)과 관련된 정보를 저장하는 테이블 user_info 유저의 정보를 저장하는 테이블 token 로그인 (리프레시 토큰)을 저장하는 테이블 -> redis를 이용하기로 하여 빠짐 problem 문제를 저장하는 테이블 solution 문제의 답안을 저장하는 테이블 problem_try 특정 문제를 시도한 특정유저를 ..
[Error] cannot resolve symbol 'Routes' 정확히 모르겠는데 react-router-dom이 6.0.2로 업그레이드되면서, Switch -> Routes로 바뀌었고, 그게 지금 intelliJ에서 열리지 않는?에러가 있는 것 같다. https://stackoverflow.com/questions/70031839/cannot-resolve-symbol-routes/70221584 Cannot resolve symbol 'Routes' I am importing Routes the following way import {Routes, Route, BrowserRouter} from 'react-router-dom' My package JSON is "react-router-dom": "^6.0.2", I am using Pycharm. npm .....
[DevOps] Docker - Redis 보호되어 있는 글입니다.

728x90