Typo in static class property declaration react/no-typos error - Typo in static class property declaration react/no-typos prop의 타입을 체크해주는 PropTypes를 import 하여 사용하던 도중 에러가 발생 - 에러 발생 코드 Movie.PropTypes = { id : PropTypes.number.isRequired, year : PropTypes.number.isRequired, title : PropTypes.string.isRequired, summary : PropTypes.string.isRequired, poster: PropTypes.string.isRequired, }; - 에러 해결..

스프링을 공부하면서 조금씩 기능을 파악하던 도중 lombok라이브러리에 있는 생성자를 만들어주는 어노테이션들을 알게되었다. 세 가지의 종류가 존재하며 이를 토대로 각자 어떤 상황에는 어떤 어노테이션을 써야하는지 정리하고자 한다. Lombok 어노테이션 ( Getter / Setter / Data / (No / All / Required ) Constructor... etc)를 잘 모르고 사용하게 된다면 에러를 발생시키는데 그중에서 Constructor 어노테이션에 대해 정리하려한다. 해당 코드는 Web todo를 만들 때 사용하였던 UserDTO다. 기록을 위해 해당 객체에 조금의 수정을 해서 가져왔다. @Data @Builder @NoArgsConstructor @AllArgsConstructor @R..

타임리프란? SSR - 서버 사이드 렌더링 더보기 JSP / Servlet 등과 같이 서버사이드 렌더링 기술이다. SSR을 사용 시 데이터가 매핑이 된 서비스 페이지를 클라이언트(브라우저)에게 바로 보여줄 수 있다. 이는 기존의 프런트엔드의 React 혹은 다른 기술을 사용해서 보여줄 수 있지만 그렇게 하면서 개발을 하기에는 다시 프런트의 기술에 대해 세세하게 공부를 해야 한다. 우리가 필요한 것은 백엔드를 개발하면서 우리가 필요한 부분을 간략하게 보여주는 것을 원한다. 타임리프는 백엔드 서버에서 HTML을 동적으로 렌더링 해주는 용도로 사용이 된다. 내추럴 템플릿 더보기 순수 HTML을 유지하는 특성을 가지고 있다. 타임리프를 활용하여 작성된 파일은 HTML을 유지하기에 스프링으로 서버를 실행하지 않아..

스프링을 사용하면서 웹 개발을 진행할 때 MVC 패턴을 사용한다. MVC 패턴 이전의 개발에서는 하나의 서블릿 혹은 JSP만으로 모든 요청과 처리를 진행하였다. 그러한 상황에서는 유지보수 및 어떤 부분을 수정하는 상황에서 하나의 비즈니스 로직 / HTML / UI 수정 어느 부분을 수정하든 전체를 수정해야 하는 일이 발생하였고, 이런 상황에서 등장한 것이 바로 MVC 패턴이다. 지금부터 기록할 것은 바로 이 현재 사용되고 있는 스프링 MVC에 대해 기록하려 한다. MVC란? 먼저 MVC에 대해 알아보자. 정확히 무엇을, 어떠한 형태를 MVC 패턴이라고 하는가? 바로 이러한 형태를 MVC 패턴이라고 한다. 이러한 MVC 패턴은 3가지 구조로 이루어져서 클라이언트에게 제공이 된다. 각각의 부분들은 Model..

레이어드 아키텍쳐(Layered Architecture) 웹 어플리케이션을 제작하는 과정에서 많이 사용이 되는 구조이다. 각기 다른 구조의 계층이 층층이 겹쳐져서 웹을 이루는 구조라는 뜻에서 레이어드 아키텍쳐라는 이름을 가지게 되었다. 일반적으로 웹을 제작하는 시점에서 더 나은 아키텍쳐의 대안을 찾지 못할 경우 사용하게 되는 범용성이 높고 활용성이 높은 아키텍쳐 구조이다. 기본적으로 각기 다른 역할을 가진 애플리케이션 요소들을 수평으로 나눠 관리를 하며 각각 자신보다 한단계 하위의 레이어만 사용을 하게 된다. Controller - Prensentation Layer 스프링부트로 기본프로젝트를 생성하면 기본적인 내장 톰캣을 가지고 있는 프로젝트가 생성이 된다. 프로젝트가 생성 후 실행을 하면서 해당 컨트..

[React] 리액트 빌드 후 빈 화면 책에 나온 todo 리스트 프로젝트를 진행하던 도중 material ui를 사용하는 부분에서부터 react가 빌드 후 빈 화면을 가져왔다. 그래서 검색을 하고 그 해결을 위한 과정을 기록하려한다. React.js, 스프링 부트, AWS로 배우는 웹 개발 101(웹 프로페셔널) | 김다정 | 에이콘출판 - 교보문고 (kyobobook.co.kr) React.js, 스프링 부트, AWS로 배우는 웹 개발 101 - 교보문고 SPA, REST API 기반 웹 애플리케이션 개발 | ◈ 이 책에서 다루는 내용 ◈ ■ REST 백엔드, React 프론트엔드, AWS를 이용한 간단한 Todo 애플리케이션 개발 ■ 스프링 부트, 그래들, 메이븐 리포지터리, 롬 www.kyobob..