본문 바로가기
728x90

전체 글196

[React 리액트] a component is changing a controlled input of type text to be uncontrolled. input elements 해결! [ 문제 ] A component is changing a controlled input of type text to be uncontrolled. Input elements should not switch from controlled to uncontrolled (or vice versa). Decide between using a controlled or uncontrolled input element for the lifetime of the component. input 의 value에 undefined가 들어갔을 경우에 대한 처리가 없다는 경고. [ 해결 ] input의 value가 undefined일 때 ''가 들어올 수 있도록 한다. value={value || ""} 2022. 5. 4.
어버이날 부모님과 같이 가기 좋은 곳 추천🤍 엄마가 좋아하는 판교 나인트리 호캉스 🤍 어버이날 부모님과 같이 가기 좋은 곳 추천 🤍 판교 나인트리 호캉스 요즘은 어버이날 전에 이벤트 한번 하는게 어버이날 이벤트 대세죠! 그래서 저희 가족은 저번 주에 미리 판교 나인트리 호텔에서 수영을 즐겼습니당🐬 수영을 좋아하시는 어머니께서 코로나 이후 좋아하는 수영을 제대로 못하셨었는데😭 사람 많은 수영장은 불안하고.. 너무 북적이는 호텔 풀도 부담스럽고ㅠㅠ 그래서 가족끼리 즐길 수 있으면서도 넓고 시설 좋은 곳을 찾고 있었거든요! 우연히 수영장 추천 유튜브를 찾아보다가 판교 나인트리 수영장을 알게 됐어요ㅎㅎ 이용해보니 최상층에 위치해서 뷰도 정말 좋고 루프탑까진 아니라 춥거나 찝찝하지도 않고ㅎㅎ 붐비지 않는 시간대엔 정말 프라이빗하게 즐길수 있었어요! 이 날이 나인트리 첫 방문 때의 사진인데 뷰 .. 2022. 5. 2.
카카오 로그인 동의 철회하기 카카오 로그인 동의 철회하기 아래 카카오 문서 를 보고 따라하면 된다. Advanced REST API로 진행. 이렇게 요청하면 아래와같이 200 OK 가 뜨고 다시 카카오 로그인 테스트를 진행할 수 있다. 2022. 4. 26.
스프링부트x리액트 '카카오 로그인 하기' (JWT+OAuth2) [2] 스프링부트x리액트 카카오 로그인 구현하기 (JWT+OAuth2) 해당 포스팅에 대한 구조, 이론 정리는 이전 게시글 에 있습니다. 스프링부트 카카오 로그인 하기 (JWT+OAuth2) [1] 이번 포스팅은 카카오로그인 구현, 실제 로그인 테스트까지의 과정입니다. 1. build.gradle 설정 gradle에 다음을 추가한다. spring-boot-starter-oauth2-client implementation group: 'org.springframework.security', name: 'spring-security-oauth2-client', version: '5.6.3' 2. 카카오 개발자 사이트 애플리케이션 추가 이 챕터에서는 다음 링크를 참고합니다. https://developers.kaka.. 2022. 4. 26.
스프링부트x리액트 '카카오 로그인 하기(소셜 로그인 )' 카카오API+JWT+OAuth2 [1] 스프링부트x리액트 카카오 로그인 구현하기(이론) 해당 포스팅에는 구현하기 전 생각한 구조에 대한 정리 입니다. 구현 예제는 다음 포스팅에서 이어집니다. ✅ 카카오 로그인(소셜 로그인) 구조 간단하게 설명하자면 다음과 같다. 프론트엔드에서 로그인 -> 로그인 후 얻은 accessToken 으로 사용자 정보 가져오고 -> JWT 토큰 생성하여 다시 프론트엔드에 전달 -> 프론트엔드는 이 JWT 토큰으로 사용자 정보 등 체크. 이 과정을 조금 자세히 정리해보자. . . 이에 대한 구현 포스팅은 다음 게시글 을 참고해 주세요! 2022. 4. 26.
스프링에서 왜 서비스 계층을 나눌까? 스프링의 계층과 계층의 역할을 무엇인지, 프로젝트시 패키지를 어떻게 나누는 것이 좋은지에 대해 정리해본다. 스프링의 계층은 Presentation Layer, Business, Layer, Data Access Layer 크게 3개로 나눌 수 있다. 1) 프레젠테이션 계층 - 브라우저상의 웹 클라이언트의 요청 및 응답을 처리 - 서비스계층, 데이터 엑세스 계층에서 발생하는 Exception을 처리 - @Controller 어노테이션을 사용하여 작성된 Controller 클래스가 이 계층에 속함 2) 서비스 계층 - 애플리케이션 비즈니스 로직 처리와 비즈니스와 관련된 도메인 모델의 적합성 검증 - 트랜잭션 관리 - 프레젠테이션 계층과 데이터 엑세스 계층 사이를 연결하는 역할로서 두 계층이 직접적으로 통신하.. 2022. 4. 25.
React json 형태의 [object Object] 출력하기 React에서 json 형태의 object 변수(responseObj)를 alert나 console.log로 찍고싶을때 alert(responseObj); 로만 찍으면 [object Object] 라고 나온다. responseObj의 내용을 알고 싶다면 alert(JSON.stringify(responseObj)); 라고 찍어주면 된다. [ #리액트소설 : 1 편 : #Object씨의_속마을_모르겠어.. ] 등장인물 소개 에반 오브젝트(Evan object): 프론트엔드 시니어 개발자 / 34살 오스틴 콘솔(Austin console): 프론트엔드 주니어 개발자 / 28살 스트링파이 제이슨(stringify json): 프론트엔드 신입 개발자 / 26살 내용 [ 오브젝트를 좋아하는 콘솔. 오늘도 먼저 말.. 2022. 4. 21.
Ambiguous mapping found. Cannot map "Controller 이름" Ambiguous mapping found. Cannot map "Controller 이름" 에러 메시지: Ambiguous mapping found. Cannot map 'Controller의 이름' bean method 원인: Controller에서 @RequestMapping 이름이 중복되서 나타나는 에러 해결: 중복된 @RequestMapping 이름을 변경해주면 해결. 2022. 4. 21.
React 컴포넌트 호출시 유의사항 - PascalCase React 공부 중, 다음과 같은 에러가 발생했다. react-dom.development.js:67 Warning: is using incorrect casing. Use PascalCase for React components, or lowercase for HTML elements. PascalCase를 사용하라는 말인데, 이는 대문자를 사용하라는 것이었다. 2022. 4. 19.
728x90