📒솜이노트

전체 글 검색 결과

해당 글 150건

# spring boot(gradle) google로그인(소셜 로그인) 연동 방법 2탄

tailwindCSS 를 적용하는 방법은 해당 글을 보면 된다. # spring boot TailwindCSS와 연동하기, 사용방법tailwindcss를 사용해서 앞단을 꾸며보자 tailwindcss를 사용하려면 또 복잡하다.. 안써볼 사람들은 넘어가면 된다. 일단 node.js가 난 이미 깔려있어서 괜찮은데 안깔려있으면 node.js는 무조건 설치하셔somnote.tistory.com 그럼 이제 타임리프를 사용한 html과 컨트롤러를 만들어서 연결해주면 끝난다!일단 소셜로그인이 필요하기 떄문에 로그인 화면을 1개 만든다. 참 타임리프 템플릿은 resources/templates 아래에 만들면 된다. login.html 소셜 로그인 구글로 로그인하기..

🗄️ 백엔드/🍃Spring 2025. 7. 8. 09:54

# spring boot TailwindCSS와 연동하기, 사용방법

tailwindcss를 사용해서 앞단을 꾸며보자 tailwindcss를 사용하려면 또 복잡하다.. 안써볼 사람들은 넘어가면 된다. 일단 node.js가 난 이미 깔려있어서 괜찮은데 안깔려있으면 node.js는 무조건 설치하셔야 된다.그다음 프로젝트 루트경로에서 cmd를 킨다음 해주면되는데npm init -ynpm install -D tailwindcss@3.4.1 postcss autoprefixer만일 다운중 에러가 뜬다면 환경변수를 설정 안해서 그런거기때문에C:\Users\사용자명\AppData\Roaming\npm해당 위치를 path에 꼭 등록하고 cmd창 껏다킨다음 다시 해보면 될것이다. 그러면 루트폴더 아래 해당 파일 2개가 생긴다.tailwind.config.jspostcss.config.js..

🖥️ 프론트엔드/🎨퍼블리싱 2025. 7. 7. 17:44

# spring boot(gradle) google로그인(소셜 로그인) 연동 방법 1탄

흐름 이해하기spring boot에서 구글 소셜 로그인 하는 방법의 기본 흐름은 아래와 같다.[구글 로그인 클릭] ↓[구글 로그인 → redirect URI로 토큰 반환] ↓[Spring Security가 토큰 받아서 사용자 정보 획득] ↓[자동 로그인 or DB 사용자 등록] 처음엔 설정할것도 많고 할것도 많아서 굉장히 귀찮고 지루하지만 한번 제대로 익혀두면 다른 소셜로그인도 비슷한 구조기 때문에 지금 지식을 써먹으면 된다. 클라이언트 아이디 만들기 Google 클라우드 플랫폼로그인 Google 클라우드 플랫폼으로 이동accounts.google.com해당 사이트에 접속하여 새프로젝트를 생성하고 API및 서비스에 들어가 Oauth 동의 화면을 선택한다.시작하기를 누르면 뭐뭐를 적으라고하는데..

🗄️ 백엔드/🍃Spring 2025. 7. 7. 16:57

# spring boot프로젝트 웹에서 생성하기 (spring initializer)

https://start.spring.io/ 사이트에 접속하면 어차피 나중에 다 implement에 적어서 다운하면 되니까대충 필요할것 같은애들만 넣어준 후EXPLORE 버튼을 눌러 프로젝트를 다운로드 해준다.아주 잘 다운되었다. 이제 다른 프로젝트로 import해서 실행하면 잘 실행된다.

🗄️ 백엔드/🍃Spring 2025. 7. 7. 15:13

# gsap - SVG로 배경 애니메이션 넣기

codepen.io 사이트에는 정말 대단한 사람들이 많은것같다...! 보다가 나도 만들어봐야징 하고 생각된것들이 있는데https://codepen.io/isladjan/pen/abdyPBw Parallax scroll animationThis was one of my earliest attempts at SVG parallax animation on CodePen, created for a GSAP competition. By using ScrollTrigger, I added layers of de...codepen.io이거랑 다른하나가 더있었는데 뭔지 못찾겠다 ㅠㅠ아무튼 요런 느낌으로다가svg에 이벤트를 줘서 스르륵 나타나게 해보려고 무료 이미지를 찾아서 받았다.. 무료 이미지는 역시 freepik이..

🖥️ 프론트엔드/🟡JS, React 2025. 7. 4. 13:24

# 티스토리(tistory) 마우스 커서 변경하는 방법

직접 이미지를 다운해서 변경하는 방법도 있지만 생각보다 까다롭다.누가 만들어놓은 것을 사용하는 가장 쉬운 방법!1. 사이트에 방문아래 링크에 방문하여 맘에드는 커서를 찾습니다. Free Cursor Downloads - Cursors-4U.comDate: 16 Jan 2024, 22:00 By Tor With 15 Comments All commenting and comments have been removed from the cursor pages. Too many negative comments that got out of hand. Date: 28 Dec 2023, 00:37 By Tor With 1 Comments Haven't work on this site in years. But Iwww...

🖥️ 프론트엔드/❤️ 티스토리꾸미기 2025. 7. 4. 09:30

# 인텔리제이(intelliJ) - 상단메뉴(툴바) 보이게 고정시키는 방법

1.file-settings을 선택한다. 2. Appearance & Behavior에 appearance에서 조금 내리다보면Main menu : 하고 셀렉트 박스가 있는데Hide on the 어쩌고로 되어있을 것이다.그걸 Show abocve Main Toolbar로 변경해주고 apply하면 된다.

🔍IDE/intelliJ 2025. 7. 3. 14:59

# intellij(인텔리제이) 단축키 이클립스로 변경하는법

1. file -setting 클릭 2.keymap 선택 후 셀렉트박스에서 eclipse 선택 끝

🔍IDE/intelliJ 2025. 7. 3. 12:50

# PostgreSQL 락(blocking) 상황 정리 해결방법

1. 락 확인 쿼리SELECT t.relname, l.locktype, page, virtualtransaction, pid, mode, grantedFROM pg_locks l, pg_stat_all_tables tWHERE l.relation = t.relidORDER BY relation ASC;어떤 테이블에 어떤 PID가 락 걸었는지 확인 가능 현재 활동중인 세션 보기 (pg_stat_activity도 같이보면서 확인)SELECT pid, state, query, wait_event_type, wait_eventFROM pg_stat_activityWHERE state != 'idle'; 2. 누가 누구를 막고 있는지 확인SE..

🗄️ 백엔드/🗄️DB 2025. 7. 1. 15:39

# HWP 템플릿에 동적으로 ROW 삽입하는 방법 (전자정부프레임워크 + MyBatis)

기존 템플릿이(hml, hwp) 있고 해당 템플릿을 변환할 때를 기준으로 설명한 내용 예를 들어 도서관 대출 목록 리포트라고 해보자.템플릿에는 데이터 시작 위치에 마커를 삽입해둔다.#BOOK_ROW#해당 마커는 성적표 표 안에서 데이터가 삽입될 시작 위치를 나타낸다.템플릿의 TABLE 태그는 보통 다음과 같이 구성되어 있다. 위 태그는 3번째 ROW안에 첫번째 CELL에 들어가 있는 내용이 될것이다. ... ... ... ... ... 그렇다면 핵심 로직은 이렇게 될 것이다.#BOOK_ROW# 마커를 기준으로 블럭을 복사각 내부의 태그를 replaceALL로 순차 치환RowAddr는 반드시 각각 다르게 설정해야 함 (2 + i) 태그 안 RowCount 값도 반드시 갱신해야 문서 ..

🗄️ 백엔드/🍃Spring 2025. 7. 1. 14:04