전체보기 49

[CRUD] 기능구현 - Daum (KaKao) 우편번호 API

참조 홈페이지 https://postcode.map.daum.net/guide Daum 우편번호 서비스 우편번호 검색과 도로명 주소 입력 기능을 너무 간단하게 적용할 수 있는 방법. Daum 우편번호 서비스를 이용해보세요. 어느 사이트에서나 무료로 제약없이 사용 가능하답니다. postcode.map.daum.net 관련 화면 이 화면에서 우편번호 버튼을 클릭하면 사진과 같이 주소를 입력할 수 있는 팝업창이 뜬다 팝업창에 본인의 주소를 입력해서 확인을 눌러주면 자동으로 우편번호와 주소가 입력된다. 관련 코드 1. HTML 2. Script 우편번호 서비스 연결 3. JS 우편번호 서비스 호출 및 이용 function fnPostcode(){ new daum.Postcode({ oncomplete: func..

[Spring Boot] log4jdbc & logback으로 SQL 쿼리 콘솔로 보기

1. build.gradle build.gradle에 log4dbc와 logback 의존성을 추가한다. implementation 'org.bgee.log4jdbc-log4j2:log4jdbc-log4j2-jdbc4.1:1.16' testImplementation 'ch.qos.logback:logback-classic:1.4.14' 2. log4jdbc.log4j2.properties 파일 생성 * 위치: resources 폴더 하위 내 파일 생성 log4jdbc.spylogdelegator.name=net.sf.log4jdbc.log.slf4j.Slf4jSpyLogDelegator log4jdbc.dump.sql.maxlinelength=0 3. application.properties의 DB 설정 ..

study/springBoot 2024.01.06

[intellJ] 프로젝트 시작전 설정

1. 프로젝트 생성 밑에 사진은 프로퍼티스 먼저 넣고 싶은 거 추가할 수 있는 건데 난 그냥 직접 넣어줄 거여서 따로 추가 안 하고 생성했음 2. 인텔리제이 기본 초기 설정 안하면 한글 깨지거나 기본적인 게 안될 수도 있어서 아래 링크 들어가서 따라서하는 거 추천 https://this-circle-jeong.tistory.com/193 [Intellij] 인텔리제이 초기 설정 1. New Window File - Settings - Appearance&Behavior - System Settings - Open projoect in New Window 체크 2. Java Compiler 설정 File - Settings - Build, Execution, Deployment - Compiler - Ja..

study/intelliJ 2023.12.30

[CRUD] DB설정

1. Mysql 다운로드 1. 터미널 접속 후 homebrew이용해서 mysql다운로드하기 $ brew install mysql 2. 터미널에서 root아이디로 mysql에 접속 후 비밀번호 설정 하기 터미널을 켜고 아래 코드를 입력하면 root아이디로 mysql에 접속 mysql -u root 그 후 아래 코드 입력해서 비밀번호 설정 alter user 'root'@'localhost' identified with caching_sha2_password by '변경할 비밀번호'; 3. 설정이 잘 됐는지 확인하고 싶으면 아래 코드 입력 후 확인 mysql -u root -p 저렇게 입력하면 아래 사진처럼 나오는데 그럼 위에서 설정했던 비밀번호 입력 후 mysql로 접속이 잘되면 비밀번호 설정이 잘된 거 ..

[CRUD] 화면 구현

목표 기본CRUD 네이버 스마트 에디터를 이용한 게시판 단일 첨부파일 등록 및 다운로드 스프링시큐리티 로그인 기능 우편번호 API사용 구현화면 목록 (USER) 로그인 회원가입 구현화면 목록 (BOARD) 게시글 목록 게시글 쓰기 게시글 보기 [USER] 1. 로그인 페이지 2. 회원가입 페이지 [BOARD] 1. 게시판 목록 페이지 2. 게시판 글쓰기 페이지 3. 게시판 글 보기 페이지

[React] 리액트/React state문법 (2) + Onclick 문법

2023.09.01 - [공부/React] - 리액트/React state 문법 (1) 리액트/React state 문법 (1)시작 전에 먼저 왜 state를 쓰는지 알고 가자 굳이 state에 자료를 넣지 않고 변수에다가 자료를 넣어줘서 띄워줄 수도 있는데 굳이 state를 쓰는 이유는 밑에 잠깐 보이는 사진에 let post = '강남 가락herniateddisc-park.tistory.com이 글에 이어서 state문법과 Onclick 문법을  알아보자 Onclick은 html요소를 클릭했을 때 내가 원하는 자바스크립트를 실행시켜 주는 거다이를 위한 예시로 좋아요 같은 기능을 구현해볼 건데버튼을 하나 누르면 옆에 잇는 숫자가 올라가게 할 거다  먼저 누를 수 있는 버튼을 만들건대 button이라고 ..

study/react 2023.09.01

[React] 리액트/React state 문법 (1)

시작 전에 먼저 왜 state를 쓰는지 알고 가자굳이 state에 자료를 넣지 않고 변수에다가 자료를 넣어줘서 띄워줄 수도 있는데 굳이 state를 쓰는 이유는밑에 잠깐 보이는 사진에 let post = '강남 가락국수 맛집';이라고 저장해 놨는데이게 하드코딩으로 해놓은 게 아니라 어디서 정보를 가져오는 거라고 생각해 보자 어느 날 정보가 바뀌어서  강남 가락국수 맛집에서 역삼 우동 맛집으로 바뀌면 let post = '역삼 우동 맛집'; 이런 식으로 바뀐다고 생각하면 되는데 여기서 바뀐 값이 자동으로 html에 적용되지 않는다 하지만 state를 쓰면 state를 쓰고 있던 html은 자동으로 재렌더링이 된다 그래서 자주 바뀌는 정보 같은 경우는 변수에 저장하는 것이 아니라 state에 저장해서 이용해..

study/react 2023.09.01

[React] 리액트/React JSX 문법 3가지

JSX란 ?간단하게 말하자면 JS파일에서 HTML문법을 쓸 수 있게 해주는거  JSX 문법 1 ) 보통 html에서는 태그에 class를 입혀서 이름을 주는데 jsx에서는 className이라고 해야됨이런식으로 className="black-nav" 를 해서  css 폴더에 .black-nav를 설정해주고 저장해주면  이렇게 정상적으로 적용이 됨.   JSX 문법 2 ) 하드코딩으로 이름이나 이런 걸 설정해줄 수 있지만변수에 들어있는 데이터를 내가 원하는 장소에 넣고 싶으면 {} 를 입력해서 {}안에다가 데이터가 들어있는 변수명을 넣어주면 된다.    간단하게 예시로 post에 강남 우동 맛집이라고 넣어준 후  div 태그 안에{post}를 입력해주면 이렇게 잘 나오는 모습을 볼 수 있다. +) 클래스명..

study/react 2023.08.31

[macOS] macOS 리액트 초기설정

처음 시작 할 때 인터넷에 들어가서 node.js 입력 후 홈페이지에 들어가 보면 이런 식으로 나오는데 왼쪽에 있는 거 다운로드하고그 후 인터넷창에 VSC입력해서 다운로드하여 주자 나는 맥이어서 맥버전을 다운로드하였다.  전부다 다운로드하고 나서 먼저 바탕화면에 프로젝트 위한 파일을 하나 만들어줘야 된다 react공부할 거니까 간단하게 파일이름 react로 설정해서 만들어 줬다.그리고 맥 기준으로 파일에 마우스를 올리고 오른쪽 클릭을 하면이런 게 나올 텐데 여기서 서비스 -> 폴더에서 새로운 터미널 열기를 눌러준다. 이런 화면이 나오면 npx create-react-app 프로젝트명 이런 식으로 입력해 주면 되는데 나는 프로젝트명을 blog라고 할 거니까 npx create-react-app blog이라..

study/macOS 2023.08.31

[intelliJ] System.out.println 자동완성 안될때

강의를 들으면서 콘솔에 결과값을 보려고 자주 쓰는 System.out.println을 나오게 하려 했는데sout , so, sysout, 등등 뭘 입력하든 자동완성으로 완성하는 방법   * 맥북에서 1 )cmd + , 를 눌러서 Settings창을 띄운다  2 ) 왼쪽 카테고리 검색창에서 live template 입력그 후 리스트 중에 Java를 열어준다 3)Java 내부에 있는 모든 것들을 전부 드래그하고 마우스 우클릭 후 change context 클릭 4)Java를 찾아서 박스를 체크해 주고 OK 클릭 5 )그 후 Apply 하고 OK 눌러서 설정 완료해 주고 이제 sout을 입력해 주면 자동완성 기능이 실행된다.

study/intelliJ 2023.07.25