printf("Hello POTATO World");

리액트에서 동적인 UI 만드는 step1. html css 로 미리 UI 디자인을 다 해놓고2. UI 의 현재 상태를 state 로 저장해두고3. state 에 따라서 UI 가 어떻게 보일지 조건문 등으로 작성  글 제목을 누르면 modal 창 등장하도록 설정  1. html css 로 미리 UI 디자인 해놓기    이제 글 제목을 누르면 이 창이 뜨도록 할 것이다. 2. UI 의 현재 상태를 state로 저장  let [modal, setModal] = useState(false);   영어로 작명 시 state 변경 함수는 set을 앞에 붙이는게 관습3. state 에 따라서 UI 가 어떻게 보일지 작성   className = "list">        onClick = {() => {      ..

className = "modal">      제목      날짜      상세 내용    .modal{  margin-top: 20px;  padding: 20px;  background-color: #eee;  text-align: left;} 이런 모달창 하나를 디자인 해준다.  복잡한 html 을 한 단어로 치환할 수 있는 컴포넌트 문법 리액트는 html 을 한 단어로 깔끔하게 치환해서 넣을 수 있는 문법을 제공한다.함수 문법을 이용해서 html 을 하나의 태그로 만들어 가독성을 높일 수 있음   const Modal = () => {  return (    className = "modal">      제목       날짜       상세 내용       )}function Modal(){  ..

array, object 자료일 경우 state 수정할 때 약간의 어려움이 존재한다.   /* eslint-disable */import logo from './logo.svg';import './App.css';import { useState } from 'react';function App() { //let post = "강남 우동 맛집"; // 자주 변경 될 것 같은 html 부분은 state로 만들어놓기 let [title, modifyTitle] = useState(["여자코트 추천","강남 우동 맛집", "파이썬 독학"]); // [state 에 보관했던 자료, state 변경 도와주는 함수] let [like, addLike] = useState(0); return ( ..

2024-11-20 16:13:44.543 ERROR 17788 --- [nio-8080-exec-2] d.v.m.c.filter.JwtTokenFilter : Error occurs while getting header. header is null or invalid2024-11-20 16:13:44.600 ERROR 17788 --- [nio-8080-exec-2] d.v.m.exception.GlobalControllerAdvice : Error occurs org.springframework.http.converter.HttpMessageConversionException: Type definition error: [simple type, class dev.vinyeee.mysns.controll..

spring 에서 로그인 로직을 JWT 토큰을 이용한 방식으로 구현중인데 토큰 필터 부분에서 유효성 검사 후 JWT 에서 사용자 정보를 추출 하는 로직이 잘 이해가 되지 않아서 정리해보려 한다.   JWT 토큰의 개념부터 상세히 알고 싶다면 해당 글을 참조  쿠키 vs 세션 vs JWT 토큰 방식의 개념에 대해 알아보자SNS 서비스의 회원가입과 로그인 기능을 구현하는 중  Auth 에 대해서 알게되었다 . 서버에서 사용자를 어떻게 기억하고 인증할까?  서버가 쿠키에 사용자 정보를 저장해두고 이를 세션으로 유vinyee.tistory.com@Slf4jpublic class JwtTokenFilter extends OncePerRequestFilter { // 이 필터는 모든 HTTP 요청마다 한 번씩 실행..

SNS 서비스의 회원가입과 로그인 기능을 구현하는 중  Auth 에 대해서 알게되었다 . 서버에서 사용자를 어떻게 기억하고 인증할까?  서버가 쿠키에 사용자 정보를 저장해두고 이를 세션으로 유지한다는 식의 대략적인 정보는 이전에 들어본 적이 있었지만제대로 알아본 적은 없는 것 같기에 이번기회에 확실히 정리해 두고 넘어가보려 한다    쿠키 🍪 vs 토큰 ?쿠키를 이용해서 서버는 사용자에 관한 것을 기억하기 위해 브라우저에 데이터를 담아둘 수 있다.   사이트에 방문하게 되면 브라우저는 서버에 요청을 보내게 되고 서버는 이 요청에 대한 응답으로 클라이언트가 요청한 모든 데이터와 페이지 정보를 담아 주게된다. (흔히 아는 요청 - 응답 방식 ) 그리고 이때 반환하게 되는 응답에 쿠키가 존재할 수 있다.  ..

비동기 프로그래밍이란  - async 한 통신 (작업이 다 끝나기 전까지 기다리지 않음)- 실시간성 응답을 필요로 하지 않는 상황에서 사용- ex) notification, email 전송, push 알림  - 개발자 답게 표현해 보자면 Main thread 가 task 를 처리하는 게 아니라 sub thread 에게 task 를 위임하는 행위  Spring Framework 에서 비동기 프로그래밍 Thread Pool : 비동기 작업을 효율적으로 관리하기 위해 제공되는 스레드 관리 메커니즘. 스프링에서는 @Async와 같은 비동기 처리나, 스케줄링 작업을 효율적으로 처리하기 위해 스레드 풀을 활용 스레드 풀 생성 옵션   1. CorePoolSize : 최소 스레드 개수 2. MaxPoolSize : ..

사용자 생성docker exec -it bash // docker mysql 컨테이너 상으로 접속mysql -u root -p // 사용자 계정으로 mysql 셸 접속create user 'newuser'@'%' identified by 'password'; // 사용자 생성 데이터 베이스 생성create database testdb;show databases; 사용자에게 testdb 에 대한 권한을 부여grant all privileges on testdb.* to 'newuser'@'%'; // 사용자에게 권한 부여flush privileges; // 변경 사항 적용 testdb 에 있는 테이블 확인하기 use testdb; // testdb 를 사용show tables; // testdb 에 존재..

https://hub.docker.com/_/mysql mysql - Official Image | Docker HubQuick reference Supported tags and respective Dockerfile links 9.1.0, 9.1, 9, innovation, latest, 9.1.0-oraclelinux9, 9.1-oraclelinux9, 9-oraclelinux9, innovation-oraclelinux9, oraclelinux9, 9.1.0-oracle, 9.1-oracle, 9-oracle, innovation-oracle, oracle⁠8hub.docker.com# MySQL의 최신 이미지를 Docker Hub에서 다운로드합니다.docker pull mysql:latest# ..

문제 상황최근 EC2를 통해 Spring boot 프로젝트 서비스 배포를 하는 과정에서 CPU 사용률 100% 에러를 겪었다 ​분명 배포가 제대로 잘 되었는데 다음 날 되니까 서버 접속이 안됨 ;;​외주 업체 측에서 만들어준 계정이라 aws 계정이 내 계정이 아니여서 처음엔 진짜 이게 무슨 문제인지 전혀 알지 못했다 그래서 인스턴스 재가동만 5-6번 정도 한듯 ​내 개인프로젝트도 아니고 외주라 반드시 원인을 찾아야했고,인스턴스가 갑자기 정지되는 현상에 대해 열심히 구글링 해보니 t2.micro 프리티어를 사용할 시 cpu 사용량이 100% 에 이르게 되면 메모리가 부족해져 갑자기 서버가 다운되버리는 현상이 흔하게 발생한다는 것을 알 수 있었다​​​top​ top 명령어를 통해 어떤 프로그램이 얼마나 메모..