분류 전체보기44 css text-transform 과 websquare를 사용한 input 입력값제어 미션 : 입력시 소문자를 입력하더라도 대문자로 강제입력되야함 한글은 아예 입력지않아야함. 포커스가빠질때가아닌 입력중인실시간에 체크되야함 숫자와대문자만입력되야함 1.text-transform 은 대문자로 또는 소문자로 바꾸는 css 속성입니다. 기본값 : none 버전 : CSS Level 1 한글에서는 의미가 없는 속성입니다. 속성값 A none : 입력된 그대로 출력합니다. B capitalize : 단어의 첫번째 글자를 대문자로 바꿉니다. C uppercase : 모든 글자를 대문자로 바꿉니다. D lowercase : 모든 글자를 소문자로 바꿉니다 2. allowChar websquare에서 입력을 허용할 문자를 정의할수 있습니다 3. validateOnInput websquare inputbox .. 2023. 8. 30. 계층형쿼리 START WITH ~ CONNECT BY PRIOR 아래 테이블을 START WITH ~ CONNECT BY 절을 사용하여 계층형 쿼리를 만들어보고자 합니다.START WITH [조건] : [조건]에 맞는 레코드를 일단 조회합니다. 그결과를 기준으로 계층연결을시작합니다 CONNECT BY [조건] : [조건]에 맞게 연결해 나갑니다. 이때 CONNECT BY절에 PRIOR이 어디에 붙느냐에 따라 결과값이 달라지므로 주의할 필요가 있습니다. 컬럼명앞에 PRIOR 붙어있는 컬럼의 값을 일단읽고 그 값으로 다음 조건절을 수행하게 됩니다. 아래 구문을 해석하자면 START WITH cd = '0' : 컬럼명 cd의 값이 '0'인 레코드를 찾습니다. 찾은레코드에서 PRIOR이 붙은 'cd'의 값을 읽고 조건절 cd = pcd 절을 수행합니다. 그렇게 되면 cd값이.. 2023. 8. 28. Spring Boot 프로젝트에 React프로젝트 연동하기 1. Spring Boot 프로젝트폴더에 create-react-app 을 이용하여 react프로젝트를 설치합니다. 예시) create-react-app ./front ( front 폴더 속에 생성)2. react프로젝트 생성중인 화면3. ./front/ 폴더 아래에 react 가 정상적으로 설치가 되었다면 package.json 파일을 열어서 proxy를 설정합니다. 프록시 설정이유는 spring boot port를 8080으로 설정하였고 react는 기본적으로 3000의 포트로 설정됩니다. 기본적으로 포트가 다를경우 통신이 불가한데, 이때 react package.json파일에 프록시 설정을 해준다면 react가 다른서버와 통신이 가능합니다.4. App.js에서 통신된 값을 화면상에서 확인 할 수 있.. 2023. 8. 14. 웹스퀘어(websquare5) 기본교육 (주)인스웨이브의 표준웹기반 UI/UX상용솔루션 websquare5 기본교육을 시작합니다.목차 1. 설치 툴설치는 이클립스기반이라 압축만해제함 엔진설치는 웹어플리케이션구성후 websquare폴더와 lib를 포함시킴 2.개발환경(폴더구조,구동환경(java,jsp기반was)) websquare폴더에는 config.xml로 js,css,컴포넌트들속성의 공통적용을함 lib폴더에는 웹스퀘어엔진jar과 관련의존성있는 라이브러리들위치함 websquare_home폴더는 라이센스가 들어있고 파일업로드관련설정이 있음 WEB-INF/web.xml에는 웹스퀘어 servlet등록 3.툴설정 웹스퀘어실행을 위한 context와 contextPath설정은 웹스퀘어화면파일(.xml)최초실행시 설정함 화면그릴때 컴포넌트아이디 자동부여.. 2023. 8. 12. HTML5 CSS 위치속성 position 배우기 position을 배우면서 시스템용 레이아웃만들기를 해보겠습니다. position은 위치속성이며 요소의 위치를 지정할 수 있습니다. position 속성중 대표적인 속성은 static, relative, absolute, fixed등이 있습니다. 요소에 position속성을 기재하지 않는다면 기본값으로는 static속성을 지니게 됩니다. absolute는 조상요소(element) 중 가장 가까운 태그를 기준으로 잡습니다. absolute가 기준으로 삼을 수 있는 위치속성은 같은absolute와 relative, fixed, stickey 네가지이며, 그중 해당되는 가장 가까운 태그를 기준으로 위치를 잡습니다. relative는 자신 앞에오는 형제요소중 absolute fixed 가 아닌대상들을 기준으로 .. 2023. 8. 9. 로컬postgreSql 설치와 awsRDS에서 postgreSql 인스턴스생성하고 DBeaver로 접속하기 postgreSql은 무료오픈소스 db입니다. 요즘 대형 SI에서 'tibero'와 더불어 많이 사용되더군요. 로컬에 간단히 설치하여 공부하실수도 있고, aws에서 무료사용해볼수있는DB서비스(aws RDS)를 이용하는 방법도 좋습니다. 관계형데이터베이스이므로 'Relational Database' Service 해서 'RDS'라고 합니다. 이번강의는 아래순서와 같이 진행하겠습니다.로컬에 postgreSql설치, dbever(디비에버) 설치aws rds instance생성 및 설정dbever(디비에버) 로 rds에 원격접속1. 로컬에 postgreSql설치 postgresql.org가셔서 다운로드후 설치하시면 아주간단하게 설치됩니다.윈도우즈 기반의 모든 설치가 그렇듯이 '관리자 권한으로 실행' 으로 실행합.. 2023. 8. 9. WinSCP(putty)를 이용하여 Ubuntu서버에 접속하기 (AWS EC2 인스턴스 Ubuntu) 1. AWS EC2 - Ubuntu 인스턴스 상세정보창에 있는 퍼블릭 IPv4 주소 를 복사합니다.2. WinSCP에 접속하여 새사이트 - 호스트 이름에는 1번에서 복사한 ip주소를 붙여넣습니다. ※ 비밀번호 대신 우리는 인스턴스 생성시 만들었던 키페어 (.pem키)를 이용하여 로그인을 하기위해 '고급'버튼을 클릭합니다.파일 프로토콜 : SFTP 호스트이름 : 인스턴스 퍼블릭 IPv4 주소 (IP) Port : 22 3. SSH - 인증 메뉴에 들어가 개인키 파일(K) ... 버튼을 클릭해서 파일을 불러옵니다.4. 저번 포스팅에 생성했던 pem키를 가져옵니다. 근데 어딨는지 잘모르시겠죠? *인스턴스 생성시 키를 새로 생성하셨다면 '다운로드'폴더에 자동 다운로드 되어있을겁니다5. pem키를 ppk로 변환하.. 2023. 8. 8. AWS EC2 인스턴스 우분투(Ubuntu 22.04) 서버 무료(프리티어)로 개설하기 1. https://aws.amazon.com/ko/ 에 들어가서 콘솔 홈에서 'EC2'를 클릭합니다.2. 왼쪽메뉴의 EC2 대시보드에서 리소스 - 인스턴스(실행 중) 을 클릭합니다. (또는 왼쪽메뉴에서 바로 인스턴스를 클릭)3. 우측상단에 있는 주황색버튼 '인스턴스 시작' 버튼을 클릭합니다.4. 인스턴스에 생성할 OS(Ubuntu)를 선택합니다. Ubuntu 버전 : 22.045. 인스턴스 유형은 프리티어(무료)로 사용가능한 t2.micro 로 설정합니다.6. 키 페어를 생성합니다. (프라이빗 키 .pem 키를 생성)7. 인스턴스에 사용될 방화벽(보안 그룹)을 새로 생성합니다. 8. 볼륨(인스턴스 용량)은 프리티어로 최대 30GB사용 가능하므로 30GB를 입력합니다. 스크립트오류가좀있어 입력시 튕길수 .. 2023. 8. 8. AWS 무료회원가입하기 aws에 가입하면 클라우드 호스팅서비스를 1년동안 무료사용가능합니다. 필요한 준비사항은 가.이메일주소 나.신용카드 만 있으면 가입할수 있습니다 추가로 영문주소가 필요한데 네이버에 주소를입력하면 변환해줍니다 1. AWS에 가입할 이메일계정 및 계정이름을 하나 지어줍니다. AWS 계정이름은 가입 이후에 변경도 가능합니다. 2. 가입에 필요한 이메일주소로 인증메일이 발송됩니다. 이메일로 들어가면 '확인코드'를 볼수있습니다 3. 해당 인증번호를 입력한 다음 계정에 사용될 비밀번호와 보안번호를 입력합니다.4. AWS회원가입에 필요한 개인정보를 입력합니다.5. AWS에 연결할 카드정보를 입력합니다. 무료가 아닌 서비스를 사용하면 과금될수있으므로 신용카드는 반드시 등록해야합니다 6. 입력한 카드번호의 휴대폰번호 인증.. 2023. 8. 8. node.js를 이용하여 react설치하기 Node.jsnodejs.org1. https://nodejs.org/en 접속하여 node.js 설치합니다.2. 설치할 경로를 지정합니다.3. https://code.visualstudio.com/ 에 접속하여 visualstudio를 설치합니다. 4. 윈도우 실행창에서 Visual Studio Code를 '관리자 권한으로 실행' 으로 실행시켜줍니다.5. View - Appearance - Panel클릭해서 터미널창을 활성화 시킵니다.6. 터미널에서 명령어 npm install -g create-react-app 를 입력하여 react를 설치합니다. 7. react 설치완료되었을 경우 Terminal창 화면 8. 터미널에서 명령어 create-react-app -V를 입력해 react가 정상적으로 설치.. 2023. 8. 6. Array정복 in javascript 실전 javascript에서 가장중요한 API 딱2개만 선정하라면 저는 개인적으로 String API, Array API 라고 생각합니다. 체감상 70%이상의코딩이 이두가지군을 사용할정도로 많은비중을 차지합니다. 그중 오늘은 실전에서 반드시 알아야할 핵심Array API를 정리해보겠습니다.1.splice : 삭제 2.slice : 범위추출 3.forEach : 심플for문 4.map : 배열가공 5.find : 값찾기 6.indexOf,lastIndexOf : 인덱스찾기 7.filter : 조건추출 8.some: || ,every:&& : 일부만족,전체만족 체크 9.concat:배열과배열합치기 10.reduce:값누적 11.join:값을스트링 12.sort: 정렬 1. splice 배열을 잘라낼때(몇번.. 2023. 7. 31. github를 사용하는 git 기본사용법 eclipse사용 spring-boot 예제사용 1. 깃허브 회원가입 깃허브 사이트에 회원가입부터 하겠습니다 https://github.comemail과 username 두 가지 모두 로그인에 사용할수 있습니다계정생성이 되었다면 로그인(여기서는sign in)합니다버튼클릭하면 이메일로 코드확인할수있는 링크가 배달됩니다8자리코드를 입력하면 가입과정이 모두끝납니다 2. 레파지토리 만들고 사용자초대하기 제일먼저 repasitory를 만드는 버튼들이 보입니다 여기서 빈레파지토리를 만들고 프로젝트를 임포트하는 방법과 개발툴에서 생성하는 방법 두가지가 있습니다 개발툴에서 생성법은 'vscode git repository' 편을 참고하시고 여기서는 github에서 빈repository를 만들고 기존에 있던 프로젝트를 임포트 해보겠습니다다른계정이나 다른레파지토리에있는.. 2023. 7. 20. vscode로 github연동하여 spring-boot프로젝트가져오기 1. vsocde좌측 github연결을 위해 'source-control 아이콘'을 클릭합니다.2. 'Clone Repository'를 클릭합니다.3. 로그인(Sign In)여부를 물어보는 메세지박스가 뜨면 'Allow'를 클릭하여 로그인창을 띄웁니다.4. gitHub접속성공후 해당계정의 모든 URI List를 오픈할건지 물어보면 'Open'을 클릭합니다.5. 상단 중앙에 URI List가 펼쳐집니다.6. List중 하나를 선택하면 'Clone Repository'를 오픈할것인지 물어봅니다. ' Open'클릭7. 로컬PC해당경로에 파일을 넣어도 되는지? 다시한번 물어봅니다. 'Yes I trust this authors'를 클릭합니다.8. 해당 프로젝트가 java프로젝트이면 자동으로 우측아래 'java .. 2023. 7. 19. vscode(VisualStudioCode)에 gitHub연동하여 repository생성하기 본강좌의 작업순서는 다음과 같습니다.1.vscode설치기본적으로 vscode가 설치되었다고 가정하고 시작합니다.2.project선택기존프로젝트나 새프로젝트를 선택합니다.3.git설치git을 로컬에 설치합니다. 계정명,계정이메일 등록합니다. vscode를 재시작합니다.4.commit커밋메세지입력후 커밋합니다.5.Publish Branch원격서버에push합니다. 서버접속을위해 Github에 로그인을 해야합니다. 1.Open Folder 클릭해서 git에 올리고자하는 프로젝트 선택 2.Git설치 (Source Control아이콘클릭) -> (Download Git for Windows 클릭)3.Git설치가 완료되었다면 cmd를 실행시켜 git 계정 입력git config --global user.name "g.. 2023. 7. 15. 이전 1 2 다음
