본문 바로가기

전체 글112

[SpringBoot] (IntelliJ, vue.js, H2) 회원가입 페이지 만들기 1편 : dto 만들고 이름, 패스워드, 전화번호 패턴 체크 만들기. 대부분의 웹사이트는회원가입과 로그인 기능을 가진다.그 중 회원가입 기능을 만들어보자! 1. 화면 동작과 전체코드회원가입 영상 회원가입 중복 디렉토리와 클래스 Vue와 Spring을 연결해주는 dto Register-Web-backend/src/main/java/com/example/JoinWeb/dto at master · hyeong-ing/Register-Web-backend일반 회원가입과 로그인, 간편 회원가입과 로그인을 구현했습니다. Contribute to hyeong-ing/Register-Web-backend development by creating an account on GitHub.github.com 사용자의 입력값 패턴 체크 Register-Web-back.. 2025. 8. 14.

[Vue.js] 새로고침 쉽게 하는 방법, window.location.reload( ) 참고로 Vue.js에 대해서 잘 모릅니다.아무거나 막 해보는 중이고 옳은 정보인지 저도 모릅니다! [ 토끼와 거북이 경주게임 ] [Vue.js] Vue.js를 이용하여 간단한 토끼와 거북이 경주게임 만들기.토끼와 거북이경주게임을간단하게 만들어보자. 1. 환경□ WebStrom: HTML 편집기가 포함된 자바스크립트 IDE(Intergrated Development Environment)로 IntelliJ IDEA 플랫폼 위에 구축되었고 비주얼 스튜디오나 이post-this.tistory.com 1. 화면다시하기 버튼을 누르면 새로고침이 되어 토끼와 거북이의 위치가 처음으로 돌아가도록 한다. 2. reload 코드.game-return{ position: absolut.. 2025. 8. 13.

[Vue.js] animation과 @keyframs로 토끼와 거북이 경주게임 만들기. 참고로 Vue.js에 대해서 잘 모릅니다.아무거나 막 해보는 중이고 옳은 정보인지 저도 모릅니다! [ 토끼와 거북이 경주게임 ] [Vue.js] Vue.js를 이용하여 간단한 토끼와 거북이 경주게임 만들기.토끼와 거북이경주게임을간단하게 만들어보자. 1. 환경□ WebStrom: HTML 편집기가 포함된 자바스크립트 IDE(Intergrated Development Environment)로 IntelliJ IDEA 플랫폼 위에 구축되었고 비주얼 스튜디오나 이post-this.tistory.com 1. 동작과정구성토끼는 조건을 가진다. 짝수가 나오면 토끼의 행동 시간이 짧아지고, 홀수가 나오면 토끼의 행동 시간이 길어진다. 거북이는 조건 없이 항상 같은 속도로 달린다. .. 2025. 8. 12.

[Vue.js] Vue.js를 이용하여 간단한 토끼와 거북이 경주게임 만들기. 참고로 Vue.js에 대해서 잘 모릅니다.아무거나 막 해보는 중이고 옳은 정보인지 저도 모릅니다! 토끼와 거북이경주게임을간단하게 만들어보자. 1. 환경□ WebStrom: HTML 편집기가 포함된 자바스크립트 IDE(Intergrated Development Environment)로 IntelliJ IDEA 플랫폼 위에 구축되었고 비주얼 스튜디오나 이클립스와 같은 프론트엔드 개발에 최적화된 통합개발환경을 제공한다. WebStorm WebStorm: The JavaScript and TypeScript IDE, by JetBrainsMake development more productive and enjoyable with WebStorm, the IDE for JavaScript and rel.. 2025. 8. 11.

[Vue.js] transition을 이용해서 애니메이션 속도 나타내기. 참고로 Vue.js에 대해서 잘 모릅니다.아무거나 막 해보는 중이고 옳은 정보인지 저도 모릅니다! 버튼에 마우스를 대면색이 천천히 반전되도록만들어볼 것이다. 1. 실행화면 2. MainView.vue버튼을 설정하고 btn이란 클래스를 붙여줬다. Click 전체 화면 설정이다.의 코드.main-view { position: relative; width: 100vw; height: 100vh; background-color: lemonchiffon;} 버튼이 중앙에 위치하도록 만들었다. 텍스트 컬러는 화이트이고, 배경색은 블랙이다.의 코드.btn{ position: absolute; width: 80px; height: 50px; top: 50%; left:.. 2025. 8. 4.

[Vue.js] :hover를 사용해서 버튼에 마우스 커서를 대면 색반전 시키기. 참고로 Vue.js에 대해서 잘 모릅니다.아무거나 막 해보는 중이고 옳은 정보인지 저도 모릅니다! 커서를 대면 버튼의 색이다른 색으로 바뀌는 것을만들어볼 것이다. 1. 실행화면 2. HelloView.vue버튼 클래스를 먼저 만들어줍니다. Click 전체 화면 구성은 이렇게 했습니다. 의 코드.main-view { position: relative; width: 100vw; height: 100vh; background-color: lemonchiffon;} 버튼의 위치는 중앙에 위치하도록 배치했습니다. 배경색은 블랙, 텍스트 컬러는 하얀색입니다. 의 코드.btn{ position: absolute; width: 80px; height: 50px.. 2025. 8. 4.

이전 1 ··· 3 4 5 6 7 8 9 ··· 19 다음

티스토리툴바