우주의 기운을 받은 사과

잘 되던게 왜 안되는거냐.. 어제 했던건데 오늘은 왜 안되는데? 라는 생각이 든다면... 읽어주세요... 하... 너무 간단한 에러였다... 일단 결론부터 말해서 이러한 에러가 뜬다면... 아래 4가지 방법을 수행해 보자. 1. Chrome 쿠키, 캐시 데이터 삭제 2. Spring Boot의 application.yml 파일과 WebConfig의 CORS 허용 URL 확인하기 3. React의 package.json의 proxy 확인하기 4. 배포용 Branch가 아닌 개발 Branch인지 확인하기 4가지 방법 중 1개만 해도 해결되는 문제인 것 같다. 나는 1, 2, 4번을 했지만 계속 안되길래 뭐지 하다가 프론트 쪽의 proxy 문제인 것을 알았다.. 삽질은 나를 풀스택 개발자로의 성장을 촉진시킨다..

카카오 소셜 로그인을 진행하면서 JWT를 다루게 되었습니다. Spring Security와 함께 JWT를 이용하다 보니 조금 복잡한 면도 있고, JWT 자체가 무엇이며, 왜 사용하는지에 대한 의문이 들었습니다. 그래서 JWT에 대해서 적어보려고 합니다. JWT란? JWT는 Json Web Token의 약자로, 일반적으로 클라이언트와 서버 사이에 통신할 때 권한 인증을 위해 사용하는 토큰입니다. JSON 형식의 토큰에 대한 표준 규격이며, 주로 사용자의 인증(authentication) 또는 인가(authorization) 정보를 서버와 클라이언트 간에 안전하게 주고받기 위해서 사용됩니다. JWT 토큰은 웹에서 보통 Authorization HTTP 헤더를 Bearer 으로 설정하여 클라이언트에서 서버로 ..

Request(요청), Response(응답) 프론트와 백엔드가 HTTP 통신을 하며 데이터를 전달할 때 대부분 JSON 형식으로 전달을 하게 된다. 주로 응답(response)의 내용으로는 Http Header, Http Body(status code, message, data) 가 있다. Http Header에는 ContentType, Authorization 등 필요한 정보가 포함되어 있어야 하고, Http Body는 프론트나 서버에서 서로 전송할 데이터의 내용(값)들을 포함하게 된다. Http Header와 Http Body를 하나씩 만들어 전송을 해도 되지만, 백엔드에서 요청에 대한 응답으로 조금 더 쉽고 간편하게 할 수 있는 방법이 ResponseEntity를 사용하는 것이다. 지금부터 Res..

MBTI 테스트 프로젝트를 만들면서 React와 REST API를 이용해 데이터를 전송하고 전달받았습니다. 그러던 중 React에서 보내주는 데이터를 Spring Boot에서 받는 방법에는 여러가지가 있어서 제가 작업하며 사용했던 방식을 하나씩 적어보려고 합니다. Controller 첫 번째 방법은 HttpServletRequest 를 이용해 프론트에서 전달하는 URL 파라미터에 담긴 값을 꺼내오는 방법입니다. HttpServletRequest의 request에는 URL 파라미터가 담겨있습니다. 지금 작성하는 페이지의 URL을 보면 '?'뒤에 나오는 것이 URL 파라미터 입니다. (key, value 형태) https://jonguk.tistory.com/manage/newpost/?type=post&r..

[SpringBoot + React] 카카오 소셜 로그인 REST API 방식 구현 - 3. 카카오 소셜 로그인 구현 💡 목차 1. 카카오 소셜 로그인 사전 준비사항 2. 카카오 소셜 로그인 구조 분석 3. 구현 단계 글을 읽기 앞서 저는 React와 SpringBoot를 이용하여 카카오 소셜 로그인을 구현하는 과정을 담았습니다. SpringBoot에서만 카카오 소셜 로그인을 수행하는 과정을 필요로 하신다면 제 글을 읽으실 필요는 없습니다. 프론트와 서버와의 일렬의 동작 과정을 보시고자 하신다면 첫 글부터 하나하나 읽어 주시면 감사하겠습니다. ⚠️ 참고로 저는 백엔드 쪽 작업을 담당하고 있어 백엔드 위주의 설명을 진행할 예정입니다. 프론트의 설명을 보고 싶다면 👀 프론트 (React 엿보고 오기) 프론트..

[SpringBoot + React] 카카오 소셜 로그인 REST API 방식 구현 - 2. 카카오 소셜 로그인 구조 분석 💡 목차 1. 카카오 소셜 로그인 사전 준비사항 2. 카카오 소셜 로그인 구조 분석 3. 구현 단계 글을 읽기 앞서 저는 React와 SpringBoot를 이용하여 카카오 소셜 로그인을 구현하는 과정을 담았습니다. SpringBoot에서만 카카오 소셜 로그인을 수행하는 과정을 필요로 하신다면 제 글을 읽으실 필요는 없습니다. 프론트와 서버와의 일렬의 동작 과정을 보시고자 하신다면 첫 글부터 하나하나 읽어 주시면 감사하겠습니다. ⚠️ 참고로 저는 백엔드 쪽 작업을 담당하고 있어 백엔드 위주의 설명을 진행할 예정입니다. 프론트의 설명을 보고 싶다면 👀 프론트 (React 엿보고 오기) ..

[SpringBoot + React] 카카오 소셜 로그인 REST API 방식 구현 - 1. 카카오 소셜 로그인 사전 준비사항 💡 목차 1. 카카오 소셜 로그인 사전 준비사항 2. 카카오 소셜 로그인 구조 분석 3. 구현 단계 글을 읽기 앞서 저는 React와 SpringBoot를 이용하여 카카오 소셜 로그인을 구현하는 과정을 담았습니다. SpringBoot에서만 카카오 소셜 로그인을 수행하는 과정을 필요로 하신다면 제 글을 읽으실 필요는 없습니다. 프론트와 서버와의 일렬의 동작 과정을 보시고자 하신다면 첫 글부터 하나하나 읽어 주시면 감사하겠습니다. ⚠️ 참고로 저는 백엔드 쪽 작업을 담당하고 있어 백엔드 위주의 설명을 진행할 예정입니다. 프론트의 설명을 보고싶다면 👀 프론트 (React 엿보고 오기)..

11650번: 좌표 정렬하기 첫째 줄에 점의 개수 N (1 ≤ N ≤ 100,000)이 주어진다. 둘째 줄부터 N개의 줄에는 i번점의 위치 xi와 yi가 주어진다. (-100,000 ≤ xi, yi ≤ 100,000) 좌표는 항상 정수이고, 위치가 같은 두 점은 없다. www.acmicpc.net ⭐️ 코드 import java.io.*; import java.util.Arrays; import java.util.StringTokenizer; // 좌표 정렬하기 - 실버5 public class Main { private static class Coordinate{ int x, y; public Coordinate(int x, int y) { this.x = x; this.y = y; } } public..

10989번: 수 정렬하기 3 첫째 줄에 수의 개수 N(1 ≤ N ≤ 10,000,000)이 주어진다. 둘째 줄부터 N개의 줄에는 수가 주어진다. 이 수는 10,000보다 작거나 같은 자연수이다. www.acmicpc.net ⭐️ 코드 // 수 정렬하기 3 // Counting Sort - 개수 정렬 // 배열의 사이즈가 작고, 숫자의 범위가 10_000 이하일 때 사용 가능 // 배열에 입력된 동일한 숫자의 개수를 count 해서 배열이 0이 아닌것을 // 순서대로 count 수만큼 반복 출력하는 것 import java.io.*; import java.util.StringTokenizer; import java.util.*; public class 수_정렬하기3 { private static fina..

구명보트 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr ⭐️ 코드 import java.util.Arrays; class Solution { public int solution(int[] people, int limit) { int answer = 0; Arrays.sort(people); int j = 0; for (int i = people.length-1; i>=j; i--) { if (people[j] + people[i] =j; i--) { if (people[j] + people[i]