ISFP의 사이버 방구석

JavaScript를 이용하여 계산기를 구현 해 보았습니다. 우선 HTML과 CSS로 UI를 꾸밉니다. 목차 1) html 코드 2) css 코드 3) javascript 코드 1) HTML 코드 div.wrap으로 input 태그와 button.btn 태그들을 감쌌습니다. 특수문자 코드표로 작성되었습니다. body 태그 안의 내용만 적었습니다. 7 8 9 / 4 5 6 * 1 2 3 - 0 AC + = 2) CSS 코드 * { margin: 0; /* outline: solid; */ } .wrap { /* --- grid로 레이아웃 구성 --- */ display: grid; grid-template-columns : repeat(4, 1fr); grid-template-rows : repeat(5,..

자바스크립트 너무 뒤죽박죽으로 공부하고 있어서 죽을맛 요번에 해볼 것은 이러한 양식에서 아이디 입력없이 누르면 경고를 발생 시키려고 합니다. 우선 HTML 코드 입니다. 아이디 : 비밀번호 : (form 태그 밖에 div로 감싸서 onsubmit="return false" 속성을 줘서 페이지가 새로고침되는 것을 방지 합니다. 혹은 input type이 submit인 것을 button으로 변경해도 됩니다.) JavaScript 코드 입니다. function btnClick() { if (document.getElementById('id').value.trim().length == 0) { alert('아이디를 입력 바랍니다.'); } } document.getElementById('btnLogin').ad..

왼쪽 그림에 있는 태그들을 오른쪽 그림에 있는 태그들 처럼 감싸는 단축키를 설정해보도록 하겠습니다. 감쌀 때 emmet도 사용할 수 있어서 아주 유용 하답니다 자 그럼 VSCode를 실행 해 볼까요? 톱니바퀴모양 (setting)에 들어가시고 Keyboard Shortcuts을 눌려줍니다. 오른쪽 상단에 그림과 같은 아이콘을 눌려주시면 kebindings.json 파일을 열 수 있어요 여기에 아래의 코드를 붙여넣으면 끝 ! [ { //wrap tag "key": "ctrl+alt+r", "command": "editor.emmet.action.wrapWithAbbreviation" }, { //delete wrapping tag "key": "ctrl+shift+r", "command": "editor...

목차 [1] class 문법 사용 [2] 생성자 함수 사용 [3] 객체 리터럴 [4] 간단한 예제 [1] class 문법 사용 [2] 생성자 함수 사용 [3] 객체 리터럴 1회성 객체 만들기 [4] 간단한 예제 // 자바 스크립트에서 객체 만들기 // 1) class 문법 사용 { class Person { // 생성자 메소드 constructor(name, age) { this.name = name; this.age = age; } // 인스턴스 메소드 smile() { console.log(`${this.name}이 웃다`); } eat() { console.log(`${this.age}살 ${this.name}이 먹다`); } } const person = new Person('홍길동', 30); ..

목차 [1] 함수 선언문 [2] 함수 표현식 [3] 화살표 함수 [4] 간단한 예제 [1] 함수 선언문 [2] 함수 표현식(익명 함수) 함수 표현식 : 함수를 변수에 할당하는 방식 [3] 화살표 함수 화살표 함수 : 함수 표현식의 간결 표현, 주로 함수 실행문 1개일 때 유용 함수 표현식에서 function 키워드가 빠지고 매개변수와 본문 사이에 화살표 추가 함수 본문 내 실행문이 1개일 경우 중괄호{} 생략가능, 실행문 1개가 return문이면 return 생략 [4] 간단한 예제 // 문제) // 두 수의 차이(절대값)를 구하는 함수 만들기 calculateDifference라는 이름의 함수를 정의해 보세요 // 이 함수는 두 개의 숫자를 매개변수로 받아 두 수의 차이를 반환해야 합니다. // cas..

안녕하세요? 재삐 입니다. Oracle DataBase에서 SCOTT 계정으로 간단한 학습을 해보겠습니다 (단축키 : 생성된 테이블명에 커서를 놓고 Shift + F4를 누르면 테이블 정보가 나옵니다.) 요구사항 기준은 이런데 제약조건은 추가로 몇 가지 더 넣을 것입니다. 더보기 기본 요구사항: 1. Customers, Orders, OrderDetails, Product 네 개의 테이블을 생성합니다. 2. Customers 테이블에는 CustomerID, CustomerName, Loc 컬럼이 있어야 합니다. 3. Orders 테이블에는 OrderID, CustomerID, OrderDate, Status 컬럼이 있어야 합니다. 4. OrderDetails 테이블에는 OrderDetailID, Orde..

오라클 데이터베이스 저번 게시글에서 설치해 두었던 sqldeveloper에서 관리용계정 (SYSTEM) 접속과 학습용 계정인 SCOTT 계정 연결을 해보겠습니다. 이 계정으로 SQL 연습이나 SQLD자격증 취득을 위해서 실습을 해보실 수 있습니다. 목차 [1] SYSTEM 계정 연결 [2] SCOTT 계정 연결 [3] 기타 설정 [1] SYSTEM 계정 연결 CMD(명령 프롬프트)나 Cmder에서 sqlplus를 입력해 봅시다. 사용자명 입력 / 비밀번호 입력이 나오는데 사용자명 입력 : system 비밀번호 입력 : 설치시 설정했던 비밀번호를 입력 해 줍니다. 경로 표시가 SQL> 로 바뀌었다면 연결에 성공 한 것입니다.!! 이제 SQL Developer를 실행해서 + 버튼을 눌려줍니다. Name에 자..

오라클 데이터베이스(Oracle Database, Oracle RDBMS) 관계형 데이터베이스 관리 시스템 Express Edition을 설치해보자 목차 [1] Oracle 회원가입 [2] 서버(Server) 설치 [3] 클라이언트(Client) 설치 [4] 설치 후 설정 [1] Oracle 회원가입 우선 Oracle 사이트에서 회원가입을 해 줘야 한다. => 회원이여야 프로그램 다운로드 가능 [2] 서버(Server) 설치 상단 카테고리 Resources(리소스) - Developer Downloads(개발자 다운로드) 를 들어가 준다 Database를 클릭 Database Express Edition 클릭 21c를 받아도 되지만 나는 하단에 Prior Release Archive버튼을 눌려 이전 버전..

JAVA 단어 맞추기 행맨 콘솔 구현 입니다. 규칙1. 사용자는 남은 시도 횟수 안에 정답 단어를 맞추면 게임에서 이기게 되고 그렇지 않으면 진다. 규칙2. 단어를 맞출 수 있는 회수는 단어의 문자수 + 3 1. Main 클래스의 모습입니다. 2. HangMan 클래스의 구조 3. HangMan의 객체가 생성 될 때 생성자로 문제로 낼 단어들을 호출 합니다. 4. 초기화 된 단어 중 랜덤으로 뽑을 Random 클래스와 단어를 맞춰야하니 Scanner 클래스를 생성 해 줍니다. 5. 랜덤으로 발생한 수를 idx에 넣고 words[idx]를 이용하여 인덱스를 랜덤으로 접근해 문제를 낼 단어를 랜덤으로 뽑아 word에 저장합니다. 6. makeUnderLine(랜덤으로 뽑은 단어의 길이) 메소드를 이용하여 _..

- 영화관 좌석 예매 프로그램 - 1. 배열 선언과 초기화 그리고 좌석번호 할당 2. 배열 출력 3. 사용자에게 번호를 입력 받음 4. 입력한 번호를 2차원 배열에 맞는 값으로 계산 5. 이미 예약된 좌석 예매실패 표시 6. 구현 영상 7. 코드 1. 영화관자리 세로 6, 가로 10 크기의 방을 만들고 1~60까지 번호 할당 cnt를 이용하여 1씩 증가되게 할당 2. 2차원 배열 출력 3. 사용자에게 번호를 입력받게 하여 -> 0을 입력했을 때 무한루프를 종료 -> 1보다 작거나 60보다 큰 숫자를 입력시 좌석번호를 정확히 입력하라는 문구 출력 4. 입력한 수와 배열의 위치를 비교하는게 너무나 머리아팠다... 공책에 적어가며 seats[0][0] = 1 seats[1][3] = 14 seats[1][9]..