반응형 분류 전체보기375 [웹개발 - DIOS] 기록장 페이지 ⌦ 기록장 페이지 ☑︎ 운동 개수를 기록장에 기록해 주는 기능 • 목표 개수를 달성했을 때 목표 개수를 달성하면 화면이 멈추고 2초 뒤에 성공화면이 뜨면서 record(기록) 버튼과 exit(home 화면으로 돌아가기) 버튼이 뜬다. record 버튼을 누르면 기록장으로 이동하며, 측정 기록이 저장된다. • 목표 개수를 달성하지 못했을 때 목표 개수를 달성하지 못해도 기록하기 버튼을 누른 뒤, RECORD 버튼을 누르면 기록장에 기록은 할 수 있다. 마찬가지로 기록장으로 이동하며, 측정기록이 자동으로 저장된다. - Controller @RequestMapping(value = "count", method = RequestMethod.POST, produces = MediaType.APPLICATION_J.. 2023. 2. 23. [웹개발 - DIOS] Teachable Machine 를 이용한 운동 횟수 세는 페이지 / Teachable Machine / 티처블머신 / 머신러닝 ⌦ Teachable Machine 를 이용한 운동 횟수 세는 페이지 ☑︎ Teachable Machine https://teachablemachine.withgoogle.com/ Teachable Machine Train a computer to recognize your own images, sounds, & poses. A fast, easy way to create machine learning models for your sites, apps, and more – no expertise or coding required. teachablemachine.withgoogle.com 2023. 2. 23. [웹개발 - DIOS] 운동 목표 개수 설정 페이지 ⌦ 목표 개수 설정 페이지 ☑︎ 운동의 종류를 선택하는 기능 - HTML - CSS body > .main > .form > .select-container > .select:hover, body > .main > .form > .select-container > .select:focus, body > .main > .form > .select-container > .select.selected { background-color: rgb(30, 28, 28); color: rgb(255, 255, 255); font-weight: 500; border: 0.2rem solid rgb(30, 28, 28); } - javaScript const form = document.getElementById('fo.. 2023. 2. 22. [웹개발 - 회원가입] 비밀번호 암호화 public class CryptoUtils { public static String hasSha512(String input) { try { StringBuilder passwordSaltHashBuilder = new StringBuilder(); MessageDigest md = MessageDigest.getInstance("SHA-512"); md.update(input.getBytes(StandardCharsets.UTF_8)); for (byte hashByte : md.digest()) { passwordSaltHashBuilder.append(String.format("%02x", hashByte)); // 난수를 생성한 뒤, 10진수의 문자열로 변경 } return passwordSal.. 2023. 2. 11. [웹개발] parameter 0 of constructor in ~ 오류 Service 에 의존성 주입하기만 하면 parameter 0 of constructor in 에러가 떴다. 이 때까지 한 번도 이런 적 없었는데 잉 찾아보니까 @Service 안 적어서 그런 경우가 많은 것 같던데 난 잘 적어줬다. 혹시 몰라서 pom.xml 가서 버전 낮춰줬는데 (3.0.2 ➡️ 2.7.5) 에러 안 뜬다. 2023. 2. 11. [프로그래머스 - JavaScript] Lv.2 튜플 문제 https://school.programmers.co.kr/learn/courses/30/lessons/64065 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 풀이 function solution(s) { let arr = s.replace(/{/g, " "); // '{' 빈칸으로 바꾸기 arr = arr.replace(/}/g, ""); // '}' 삭제 arr = arr.trim(); // 문자열의 앞, 뒤 공백 삭제 arr = arr + ', '; let tempList = []; let tempList2 = []; let index = 0.. 2023. 2. 11. [웹개발] checkbox 안에 font Awesome 아이콘 넣기 checkbox 색깔을 바꾸고 싶어서 input 의 checkbox 타입을 쓰지 않고 font Awesome 에서 체크 아이콘을 가져와서 만들어보겠다. HTML 위 서비스 이용약관 및 개인정보 처리방침을 읽어보았고 이해하였으며 동의합니다. i 태그는 font Awesome 에서 뽀려온 거다. CSS /* 체크박스 */ .--object-check { align-items: center; cursor: pointer; display: flex; flex-display: row; justify-content: flex-start; user-select: none; } .--object-check > input[type=checkbox] { display: none; } .--object-check> .--c.. 2023. 2. 11. [웹개발] CSS 밑줄 긋는 효과 글자:after { display:block; content: ''; border-bottom: solid 3px rgb(11, 94, 4); transform: scaleX(0); transition: transform 250ms ease-in-out; transform-origin: 0% 50%; } 글자:hover:after { transform: scaleX(1); } 2023. 2. 10. [프로그래머스 - JavaScript] Lv.2 숫자의 표현 문제 https://school.programmers.co.kr/learn/courses/30/lessons/12924 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 풀이 function solution(n) { let count = 0; // 몇 갠지 세는 count (나중에 return 해 줄 정답을 담을 변수) for (let j = 1; j 2023. 2. 9. [웹개발] thymeleaf 를 이용한 공통 Header 만들기 일단 모든 페이지에 공통으로 들어갈 거라서 common 으로 빼준다. home.html 에 넣어볼 거다. CommonBody 에 만든 뒤, class 주고 타임리프 이렇게 적어준다. 공통 header를 넣고 싶은 페이지(home.html)의 body 안에 넣어준다. 옴메 진짜 잘 들어간다. 이렇게 따로 빼 놓으면 나중에 모든 페이지에 한 줄만 적어도 상단메뉴 넣을 수 있다. footer 까지 넣어봤다. 그리고 css 도 공통으로 주기 위해 common.css 를 commonHead.html 에 적어야한다. home.html 에서 main 에는 내용이 들어가야 하고, footer는 바닥에 붙어있어야 하기 때문에 css 는 이렇게 주면 된다. body { top: 0; left: 0; width: 100%;.. 2023. 2. 9. [웹개발] Mybatis MyBatis - 필요한 DB관련 메서드는 인터페이스에 정의하고, 그 인터페이스 및 이가 포함하는 메서드 등을 외부 XML과 연결하여 쿼리를 자바 코드와 분리하여 관리하기 위해 사용한다. - 엔티티(Entity) 객체의 멤버를 자동으로 초기화 해주기 때문에 편리하다. - application.properties 설정 # Mybatis 에서 활용할 XML 파일의 위치를 지정한다. mybatis.mapper-locations=classpath:mappers/**/*.xml # 사용할 DBMS의 JDBC Driver 전체 경로 spring.datasource.driver-class-name=org.mariadb.jdbc.Driver # DBMS URL spring.datasource.url=jdbc:maria.. 2023. 2. 9. [웹개발] 어노테이션 (Annotation) 어노테이션 - 어노테이션(Annotation)은 후술하는 클래스, 메서드, 변수 등의 상태나 속성을 표시하기 위해 사용한다. - @Deprecated [Class|Method] : 해당 클래스 혹은 메서드가 더 이상 사용될 수 없음을 의미한다. 물론 해당 어노테이션이 붙어 있어도 정상 작동은 하지만 보통 '다음 버전 부터 빠질겁니다~'라고 알려주는데 사용된다. - @Override [Method] : 해당 메서드가 재정의(Override) 되었음을 알린다. 생략하여도 제 기능은 하지만 개발자로서의 입지가.. - @Controller [Class] : 해당 클래스가 스프링 부트가 인식해야 하는 컨트롤러(Controller)임을 알린다. ▪ value : 식별자를 직접 지정한다. 지정하지 않을 경우 컨트롤러.. 2023. 2. 9. 이전 1 ··· 27 28 29 30 31 32 다음 반응형