반응형 개발자44 [React] 실시간으로 input 값을 숫자만 입력 받는 방법 다음 예제를 통해 실시간으로 input 값을 어떻게 숫자만 입력받을 수 있는지 살펴봅시다.다음은 HTML의 Form과 input을 사용해서 상품 코드를 숫자만 입력 받는 관리자 페이지입니다. 요구 사항상품 코드는 숫자로만 이루어져 있습니다.상품 코드를 입력하는 도중에 숫자가 아닌 문자를 입력하면 input 요소 밑에 error 메시지를 나타내며, '등록' 버튼을 비활성화 합니다.상품 코드를 정상적으로 등록하면 "상품 코드가 등록되었습니다."라는 메시지와 등록된 상품 코드를 나타냅니다. 1. HTML 구조 설계div (Form)forminput / buttondiv (Modal)divspan / p컴포넌트는 상품 코드를 입력할 수 있는 form 컴포넌트, 안내 메시지를 보여주는 modal 컴포넌트를 사용합.. 2024. 10. 3. 알기 쉽게 정리한 package.json 총 정리 : 프론트엔드 개발자를 위한 웹팩 package.json이란?package.json이 무엇인지 알기 이전에 직접 package.json을 만들어 보자. package.json을 만들 폴더로 이동을 한 후에 아래 명령어를 입력한다.$ npm init$ npm init -y 정말 알기 쉽게 정리한 npm이란? 해당 명령어를 실행시키면 package.json이라는 파일이 생성된다. 그리고 생성된 파일의 모습은 아래와 같다. package.json{ "name": "packagejson-started", "version": "1.0.0", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "keywords": [], .. 2024. 9. 29. [ React ] SyntaxError: Adjacent JSX elements must be wrapped in an enclosing tag. 오류 해결 방법 💥 React 실행 후 발생한 에러 메시지Compiled with problems:ERROR in ./src/App.jsModule build failed (from ./node_modules/babel-loader/lib/index.js): SyntaxError: /Users/user/Documents/study/react/sec02/src/App.js: Adjacent JSX elements must be wrapped in an enclosing tag. Did you want a JSX fragment ...? (37:12) ❓에러 발생 이유JSX 문법 오류 입니다. JSX는 기본적으로 최상위 요소(Element)를 사용해야합니다.하지만 최상위 요소(Element)가 존재하지 않아서 나타난 문법.. 2024. 7. 12. [QueryDSL][Spring] attempt to recreate a file for type qclass 에러 해결 방법 🚨 build 시 발생한 에러 메시지attempt to recreate a file for type qclass ❓에러 발생 이유QueryDSL의 QClass 파일의 중복으로 발생한 에러입니다. ✅ 해결 방법해당 프로젝트의 build 폴더를 삭제 후 프로젝트를 다시 build 해주면기존 QClass 파일들이 삭제되며, 새로운 QClass 파일들을 생성합니다.따라서 QClass 파일의 중복 문제를 해결할 수 있습니다.즉, build clean 버튼을 클릭 후 build 버튼을 클릭하면 됩니다.아래 이미지를 참고해 주세요. build clean -> build참고: clean 버튼을 클릭하여도 해당 오류가 발생하게 되는 경우에는 Spring의 QueryDSL 설정이 잘못되어 있을 가능성이 존재합니다.이럴 .. 2024. 4. 10. 이전 1 ··· 7 8 9 10 11 다음 반응형
