웹

Cafe24 Spring boot + JPA 호스팅하기

이틀간 삽질한거에 대해서 적어보려고 한다.. 본 포스팅은 카페24 호스팅/웹호스팅 - Tomcat JSP호스팅 스트리밍 무료제공 카페24 호스팅을 신청하시면 무료로 스트리밍 서비스가 제공되어 사실적 용량 증가 효과가 있습니다. 음악파일 또는 동영상으로 인한 트래픽 증가로 스트리밍 서비스가 차단 hosting.cafe24.com Tomcat Jsp호스팅(비즈니스형 결제) Intelij IDEA 환경에서 진행되었다 프로젝트 생성 https://start.spring.io/ Spring Boot버전은 크게 상관없고 빨간색 네모 해둔것만 일단 그대로 따라서 만들어주자 반드시 War에 Java8를 선택해주자 전부 세팅했으면 GENERATE를 누르고 저장 후 압축을 풀어주자 Cafe24 Tomcat Jsp 페이지에..

카카오톡 챗봇 퀴즈봇 만들기

카카오톡 오픈채팅방에서 초성퀴즈 봇이 있더군요 이거다 싶어서 퀴즈봇을 한번 만들어봤습니다. 퀴즈봇 설명 기본적인 명령어는 다음과 같습니다 명령어 설명 1help 도움말을 출력합니다 1quiz 퀴즈를 시작합니다 1a [정답] 퀴즈의 정답을 맞춥니다 1ㅁ [정답] 퀴즈의 정답을 맞춥니다 1pass 현재 퀴즈를 패스합니다(총 세명 필요) 1hint 현재 퀴즈에 힌트를 출력합니다 1rank 퀴즈 순위를 출력합니다 해당 봇은 방을 구분하여서 퀴즈가 생성되며, 퀴즈를 맞출때까지 다음문제로 넘어가지 않습니다. 다음 문제로 넘어가기 위해서는 1pass를 3명이 입력하면 답을 알려주고 넘어가게 됩니다. 사용자 편의상의 이유로 정답을 맞출때 1a, 1ㅁ명령어를 만들어 한영전환에 부담을 줄였습니다. 아래 영상은 미국주식방에..

카카오톡 챗봇 코인 정보봇 만들기

카카오톡 오픈채팅방에 돌아다니다 보면 코인이나 주식의 symbol을 입력하면 해당 정보를 요약해서 보여주는 봇이 종종 보인다. 코인에 대하여 정보를 요약해서 보여주는 봇을 만들어보자! 먼저 우리는 Javascript로 만들기 때문에 node module같은 편한 라이브러리를 쓸수 없다. 따라서 json형태로 던져주는 rest api를 찾아야 된다. 코인 같은 경우 주식과 다르게 거래소마다 다른 가격을 띄기도 하고, 어떤 거래소에서는 상장되었는데 어떤 거래소에서는 상장이 안된 경우도 있다. 따라서 이번에 총 3곳의 거래소 API를 활용하여 코인 정보봇을 만들어 보려고 한다. 해당 거래소는 gate, binance, upbit 이다. GATE API 먼저 gate documentation이라고 구글링 해보고..

카카오톡 챗봇 만들기(Javascript)

GitHub - ksaidev/KakaoBot: A Kakao Bot based on KakaoPy and KakaoLink-Python A Kakao Bot based on KakaoPy and KakaoLink-Python. Contribute to ksaidev/KakaoBot development by creating an account on GitHub. github.com 파이썬으로 제공되는 해당 코드로 카카오톡 챗봇을 만들었었는데 자꾸 영정을 먹었다(이거로 본계도 영정먹어서 탈퇴하고 고생함 ㅠ) 이게 로코프로토콜을 써서 만든건지 뭔진 모르겠는데.. 안전한 방식으로 찾기로 하였다. 그래서 대안을 찾아보니 자바스크립트로 짜는방법을 찾았는데,, 이 녀석을 통해 만들면 된다. 제공되는 응답 봇중 가..

텍스트 밑줄 커스터마이징

See the Pen Untitled by MarineLife (@ghdic) on CodePen. ::before로 height가 0인 border를 준다. 해당 텍스트가 inline-block형태일때만 width: 100%로 받아 올 수 있다

png 이미지 아이콘 파일 수정하지 않고 css로 색깔 변경하기

img { filter: opacity(0.5) drop-shadow(0 0 0 #ff0000); } 이렇게 쓰면 된다고 해서 했었는데 내가 정확히 설정한 색깔과 다른 색깔로 나온다. 그래서 이에 대한 솔루션으로 generator를 만들어둔 프로젝트가 있다 CSS filter generator to convert from black to target hex color ... codepen.io 이 프로젝트에서 자기가 변경하고 싶은 색깔만 넣어주면 filter 코드를 생성해준다! 굿!!

파일 업로드 폼 만들기 & 업로드한 파일 삭제 구현

See the Pen 파일업로드 by MarineLife (@ghdic) on CodePen. multiple 속성을 사용하여 여러 파일 업로드를 받고 싶었는데.. 그게 잘안됐다 브라우저 보안때문에 input태그 속성에 FileList자료형을 가진 files이라는 녀석이 있는데 이녀석이 readonly이다. 자바스크립트나 Jquery로 수정이 불가능하다. 이녀석이 바로 form에서 데이터를 넘겨줄때 서버쪽에서 받는 파일이다. 위 방식은 input이 들어올 경우, 해당 input태그를 클론(복제)해서 hidden 태그 안에 감추는 방식을 사용한다. 데이터는 name속성이 있는아이만 넘겨받기 때문에 파일을 입력받는 input태그의 데이터는 name속성을 지정하지 않고, hidden 태그로 클론된 녀석에게 n..

css 초기화 하는 방법

.remove-all-styles { all: initial; * { all: unset; } } 익스플로어, 사파리에서는 작동 x, all -> revert로 대체하면 사파리에선 작동 위 css구문을 선언하고, js로 "remove-all-styles"라는 클래스를 element에 추가해주고 삭제하면 초기화 된다 개인적으로는 해당 css element에 적용된 css구문을 지우고 싶다면 e.classList.remove('클래스 이름')을 사용하여 지우는걸 추천한다. 이 구문은 태그에 적용된 "모든 스타일"을 지우고 싶을때만 사용하면 된다.(default 스타일도 다날라감) 사용예시 안녕하세요 스타일 지우고 파란글씨