react(3)
-
spring boot 를 사용하여 api 만들기
스프링에 대한 기본 지식이 없어 극기초부터 진행하며 개념도 틈틈히 정리할 예정이다. 1. 프로젝트 생성 2. build.gradle 설정 3. application.yml 설정 4. controller 패키지 생성 5. service 패키지 생성 6. dao, dto 패키지 생성 7. xml 파일 생성 1. 프로젝트 생성 intellij 를 사용하여 spring boot project 를 생성한다. 파일 이름을 알아서 만들면 되고 왼쪽 사이드바에서 Spring Initializr 을 꼭 선택하고 생성해야한다. 그리고 'next' 를 누르고 넘어간다. 위의 화면에서 본인의 선택이지만 일반적으로 웹 서버를 이용하고 annotation 을 이용해서 코드를 줄일 수 있는 lombok 도 설치해주면 좋다. 2. ..
2024.03.19 -
React - css 속성 | background 에 이미지 넣기
react 의 styled-component 를 이용하여 디자인을 적용할 수 있습니다. 디자인은 CSS 문법을 사용하여 작성한 후 적용합니다. 그 중 배경화면에 디자인을 적용할 수 있는 background 관련 속성에 대해 작성하겠습니다. Background-image 배경화면을 꾸미기 위해서 배경화면에 색깔을 넣을 수 있습니다. background-color: white; 위와 같이 white 색상을 지정하여 배경화면의 색깔을 변경할 수 있습니다. 처음 react 프로젝트를 생성한 후 실행하면 네이비 색상 계열의 배경화면이 나타납니다. 이를 위의 코드를 이용하여 배경색을 변경할 수 있습니다. 색상으로만 배경화면을 변경하는 것을 다소 밋밋할 수 있습니다. 때에 따라서는 배경화면에 디자인된 이미지 혹은 촬..
2024.01.06 -
React JS - 03
1. 반복적으로 사용하는 button 만들기 - 반복적으로 사용하는 button 함수 Btn 만들기. - Btn 함수에 props 를 넘겨줘 Button에 서로 다른 text를 나타낼 수 있음. ex) 'Save Changes', 'Confirm' 2. 버튼 다시 그리기 - 버튼 클릭 시 버튼 내부의 text 변경을 할 때 바뀌는 버튼 뿐만 아니라 바뀌지 않는 버튼까지 다시 그림 - 이는 페이지 반응이 느려지는 원인이 되기 때문에 변하는 부분만 다시 그리도록 작성 - React.memo 를 이용해 변하지 않는 태그는 기억하고 다시 그리지 않음. - props 가 변경되는 부분만 다시 그리고 변경되지 않는 부분은 memo 에서 기억해놓은 태그를 그대로 그림. 3. propType 을 지정하는 방법 - pr..
2023.08.18