Front-end

참조: https://webruden.tistory.com/926

✔️사용 이유로그 목록 조회 / 스케줄 목록 조회 총 2 화면에서 페이징 기능을 구현해야 했는데, 각 화면에서 페이징을 구현하기보다 페이징을 컴포넌트화해서 재사용하고자 함.자식 컴포넌트에게 props라는 특별한 속성으로, 데이터를 전달할 수 있다.자식 컴포넌트에게 이벤

클라이언트의 요청 경로에 따라 해당하는 컴포넌트를 불러와 페이지를 구성할 수 있다. URL 변경 시 DOM을 새로 갱신하는 것이 아니라 미리 컴포넌트를 가지고 있다가 변경된 요소영역만 갱신한다(SPA 언어의 큰 특징). 따라서 유연하게 페이지 전환이 가능하다. vue

목록에서 상세조회로 갈 때, 스케줄의 id값을 넘겨 상세조회로 넘어가려고 한다.패스 설정에서 :id 를 사용해 상세 조회시 url에 각 스케줄의 id 값을 띄울 수 있도록 한다.목록에서 상세로 router push 를 할 때, 파라미터로 아이디 값을 함께 넘겨준다. p

상태 관리는 여러 컴포넌트 간의 데이터 전달과 이벤트 통신을 한 곳에서 관리하는 패턴을 의미한다. 컴포넌트 기반 프레임워크에서는 작은 단위로 쪼개진 여러 개의 컴포넌트로 화면이 구성된다. 이에 따라 컴포넌트 간의 통신이나 데이터 전달을 좀 더 유기적, 효율적으로 관리

Javascript Spread 배열이나 문자열과 같이 반복 가능한 문자를 0개 이상의 인수 (함수로 호출할 경우) 또는 요소 (배열 리터럴의 경우)로 확장하여, 0개 이상의 키-값의 쌍으로 객체로 확장시킬 수 있는 문법 이 문법을 이용하면, 객체 혹은 배열을

Request params을 사용할 때는 파라미터 값을 꼭 넘겨주어야 한다. 하지만 post인지 get인지에 따라서 파라미터 값을 넘기는 방식이 다르다.✔️ 참고axios.post(url, data, config):post에서는 두번째 인자가 data이기에 두번째 인자

Interceptor는 Axios의 기능 중 하나이다.✔️Axios란?Node.js와 브라우저를 위한 Promise API를 활용하는 HTTP 통신 라이브러리로, 비동기로 HTTP 통신을 할 수 있으며, return을 promise 객체로 해주기 때문에 response

Installation: Using PostCSS - Tailwind CSSTailwind 설치yarn add tailwindcss postcss autoprefixerproject에 tailwind 적용npx tailwindcss initconfig 파일 설정tail