목록분류 전체보기 (142)
코딩 노트
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/IMwwm/btszuKoOTH4/xvoYmE58822qBj1Bas8qdk/img.png)
Exam04.js 생성 첫 번째 방법 import { useState } from "react"; //function Exam04() {} const Exam04 = ()=> { const [content, setContent] = useState(""); return ( 네 번째 예제 (Q)주말에 뭐하세요? setContent(e.target.value)}/> {/* onChange는 이벤트를 수동으로 발생시켜도 값이 변하지 않는다. input은 이벤트를 발생시키면 강제로 값이 변한다. 그래서 onChange 선호 */} {content.length} / 1000 ); } export default Exam04; Exam04.js 생성 두 번째 방법 - 바꾸는 건 하나만 바꾸고 두 개를 쓴다! (내용과..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/bdoiwu/btszj9JRO8s/PkMbooQAqLPaEV9J7fsPa1/img.png)
React - NextJS / VueJS / SvelteJS / ... - SPA (Single Page Application) - NodeJS 기반으로 진행 - Javascript Runtume Engine JSP는 서버쪽에서 html을 만들어내는 기술이다. JSP를 쓰는 이유는 if/for문 때문인데 그런 것을 클라이언트가 할 수 있게 하도록 하는 것이 클라이언티 사이드 렌더링 방식이다. 리엑트는 페이지가 한 개이고, 페이지를 나눠 쓰는 개념이다. 그러므로 페이지의 주소가 바뀌지 않는다. 화면의 깜빡거림도 없다. (하다보면 다름, 이론상 그렇다.) 1. 구글에 nodeJS 검색 후 lts를 다운 받아준다. 2. 다운로드 후 확인은 cmd에서 이렇게 확인해본다. cmd 명령 mkdir react : 폴..
payment-mapper.xml 구문 추가 DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "https://mybatis.org/dtd/mybatis-3-mapper.dtd"> select payment_seq.nextval from dual insert into payment( payment_no, payment_member, payment_tid, payment_name, payment_price, payment_remain ) values( #{paymentNo}, #{paymentMember}, #{paymentTid}, #{paymentName}, #{paymentPrice}, #{paymentRemain} ) insert into pa..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/qMGaP/btszbgojnmu/qAeuRLgCAkTufs8w1iHAN0/img.png)
구매하기를 누르면 form을 만들어서 체크된 상품번호와 그 번호의 수량을 찾아서 넘어가게 만들 것이다. pay3 폴더 생성 후 home.jsp 생성 가장 일반적인 결제 [${productDto.productNo}] ${productDto.productName} (${productDto.productPrice}원) 구매하기 $(function(){ //버튼을 누르면 폼을 만들어서 체크된 항목의 "상품번호"와 "구매수랑"을 입력창으로 만들어 추가 $(".purchase-btn").click(function(){ var form = $("").attr("action", "test3/purchase").attr("method","post"); var count = 0; $(".product-item").each..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/xTZR3/btsy6gvg1I7/OSL5IWAKYMKhCvcIztNSwK/img.png)
KakaoPayServiceImpl 수정 @Override public KakaoPayApproveResponseVO approve(KakaoPayApproveRequestVO request) throws URISyntaxException { URI uri = new URI("https://kapi.kakao.com/v1/payment/approve"); //body 부분 (5개 중 4개는 request에 들어있다) MultiValueMap body = new LinkedMultiValueMap(); body.add("cid", kakaoPayProperties.getCid()); body.add("tid",request.getTid()); //거래번호 body.add("partner_order_id",..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/belDzl/btsy6gaC0pJ/QkVE0K2xIIoIpRkHUKTlpk/img.png)
1. 단위 테스트 2. 통합 테스트 3. 시스템 테스트 (성능 테스트, 부하 테스트, 스트레스 테스트) - JMeter - Scouter - 프로메테우스, 그라파나 4. 인수 테스트 JMerter 홈페이지 들어간 후 Binaries에 zip 파일을 다운 받는다. 1. 가상의 유저를 만든다. 2. 사용자를 몇 명 만드나? / 사용자를 몇 초에 걸쳐서 만드나? 3. 테스터에게 할 일을 정해주자. 4. 주소를 알려주고 세팅한다. 5. springhome에 TestInterceptor에 들어가서 주석을 해제한다. 6. InterceptorConfiguration에 들어가서 마찬가지로 주석을 해제한다. /** 인터셉터(Interceptor) - 완성된 스프링 프로젝트의 구석구석을 간섭할 수 있도록 만들어진 도구 ..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/zQvjA/btsy38ciBKq/GrRQDCgKzIuz6F05KnaZI0/img.png)
WebSocket은 꼭 채팅만이 아닌 알림이나 다른 경우에도 사용할 수 있다. 결제 spring21pay 프로젝트 생성 후 pom.xml(jsp 의존성)과 properties(이전 패키지에서 설정 가져오기) 수정 https://developers.kakao.com/docs/latest/ko/kakaopay/single-payment test 프로젝트에 Test01Ready 파일 생성 @Slf4j @SpringBootTest public class Test01Ready { @Test public void test() throws URISyntaxException { //웹서버에서 PG사(제 3의 서버)로 요청을 보내기 위해선 다음 둘 중 하나가 필요 //- [1] RestTemplate를 이용해서 처리 /..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/lyjqI/btsyT3DDABD/B4U6vZ3aneWjWQpBnmF1j1/img.png)
전체 메세지일 경우 hello 보낼 때도 JSON처리 (json의 기본 규칙: 이름이 있어야 한다.) {"content":"hello"} DM일 경우 /w target hello DM일 때도 JSOM으로 처리 {"target":"대상의ID", "content":"hello"} sockjs.jsp 구문 수정 doctype html> Bootstrap demo .btn-userlist { display: none; } .message-list { height: 65vh; overflow-y: scroll; padding-bottom: 15px; } ::-webkit-scrollbar { width: 1px; /* 스크롤바 너비 */ background-color: black } ::-webkit-scroll..