본문 바로가기

전체 글111

[Spring, Vue.js] 카카오 간편 로그인 만들기② - Vue로 프론트엔드 작성하기 (REST API) [Spring,Vue.js] 카카오 간편 로그인 만들기 ① - 구조와 흐름 파악하고 카카오 디벨로퍼스 설정하기카카오 간편 로그인을 만들어보자!먼저 어떻게 만들어야하는지 구조와 흐름을 파악하고카카오 디벨로퍼스를 설정하자. 1. 카카오 디벨로퍼스 - 카카오 API 시작하기 Kakao Developers카카오 API를 활post-this.tistory.com 카카오 디벨로퍼스에서 필요한 건 모두 설정했다.이제 설정한 걸 토대로, 프론트를 작성해 보자! 1. 화면로그인 카카오 간편 로그인 2. 전체 코드 LoginView.vue Sign In ෆ ID .. 2025. 9. 27.

[Spring,Vue.js] 카카오 간편 로그인 만들기 ① - 구조와 흐름 파악하고 카카오 디벨로퍼스 설정하기 (REST API) 카카오 간편 로그인을 만들어보자!먼저 어떻게 만들어야하는지 구조와 흐름을 파악하고카카오 디벨로퍼스를 설정하자. 1. 카카오 디벨로퍼스 - 카카오 API 시작하기 Kakao Developers카카오 API를 활용하여 다양한 어플리케이션을 개발해 보세요. 카카오 로그인, 메시지 보내기, 친구 API, 인공지능 API 등을 제공합니다.developers.kakao.com - 카카오 로그인 구현하기 Kakao Developers카카오 API를 활용하여 다양한 어플리케이션을 개발해 보세요. 카카오 로그인, 메시지 보내기, 친구 API, 인공지능 API 등을 제공합니다.developers.kakao.com - 카카오 로그인 이해하기 Kakao Developers카카오 API를 활용하여 다양한 어플리케이션을.. 2025. 9. 25.

[Spring] HttpEntity와 x-www-form-urlencoded이란? 폼 전송시 코드 살펴보기. ContentType을 x-www-form-urlencoded로명시했더니,HttpEntity에 담아 보냈다.무슨 관계가 있는 걸까? HttpEntity헤더와 바디로 이뤄진 HTTP request, response 엔티티를 나타낸다.쉽게 설명하자면, HttpEntity는 Http 요청/응답의 헤더+바디를 묶는 상자와 같아서 헤더와 바디를 함께 보내야 할 때 사용한다.형제 타입으로는 RequestEntity(요청전용, HTTP 메서드/URL까지 포함)와 ResponseEntity(응답전용, 상태코드까지 포함)가 있다.HttpEntity는 상태 코드가 없으나 HttpStatus의 상태 코드를 더할 수 있다.HttpEntity는 요청/응답 양쪽에서 사용 가능하다. x-www-form-urlenco.. 2025. 9. 21.

[Python] CodeTree - Trail 0. Chapter10 : 두 배열의 곱 1. 문제 설명3행 3열의 배열 두 개가 주어지면 두 배열의 같은 위치에 있는 수의 곱을 출력하는 프로그램을 작성해보세요. 2. 입력 예시3행 3열의 배열 두 개가 줄 간격을 사이에 두고 주어집니다.1 2 34 5 67 8 92 3 45 6 78 9 10 3. 출력 예시주어진 두 배열의 곱을 3행 3열의 배열로 입출력 예제와 같이 출력합니다.2 6 12 20 30 4256 72 90 4. 문제 풀이잘못된 풀이A = [ list(map(int,input().split())) for _ in range (3)]B = [ list(map(int,input().split())) for _ in range (3)]for i in range(3): for j in rang.. 2025. 9. 20.

[Vue.js] 조건부 렌더링 v-if, v-else-if, v-else, v-show에 대해 알아보고 어떻게 작동하는지 코드 작성하기. 어떤 기준에 따라사용자가 보는 화면이 달라지기 원해서 v-if, v-else를 사용했다.v-if와 v-else가 뭘까? v-if디렉티브 v-if는 블록을 조건부로 렌더링하는 데 사용된다.디렉티브의 표현식이 참(truthy) 값을 반환할 때만 블록이 렌더링된다.v-if는 디렉티브이기 때문에 반드시 하나의 요소에만 부착되어야한다.하지만 여러 요소를 토글하고 싶다면 요소에 v-if를 사용할 수 있다.는 보이지 않는 래퍼 역할을 하며, 최종 렌더링 결과에는 요소가 포함되지 않는다. 디렉티브HTML 태그 안에 들어가는 속성의 역할을 하며, v-라는 접두사가 붙는 것이 특징이다. v-elsev-if에 대한 else 블록을 나타내기 위해 v-else 디렉티브를 사용할 수 있다.v-else 요소는 .. 2025. 9. 17.

[Vue.js] v-bind가 무엇인지 알아보고, href로 하이퍼링크 만들기. v-bind로 props에 어떤 값을보내는 코드를 작성했다.그렇다면 v-bind는 뭘까? v-bindHTML 속성이나 컴포넌트 props에 데이터를 연결하는 디렉티브이다.축약형으로 :를 쓸 수 있다.주로 속성값을 바꾸거나, 컴포넌트에 props 전달하거나, 상태에 따라 클래스나 스타일을 토글할 때 사용한다. 디렉티브HTML 태그 안에 들어가는 속성의 역할을 하며, v-라는 접두사가 붙는 것이 특징이다. 바인딩프론트엔드에서 바인딩은 주로 UI 데이터 바인딩을 의미한다.웹 페이지나 애플리케이션에서 사용자가 보는 데이터(View)와 실제 메모리에 있는 데이터(Model)를 연결하고 동기화하는 기법이다.즉, 데이터가 변경되면 UI도 자동으로 업데이트되거나, UI의 변경사항이 데이터에 변영되는 등 .. 2025. 9. 16.

이전 1 2 3 4 5 ··· 19 다음

티스토리툴바