거니의 velog

[MemberVO.java] package kr.or.ddit.ch11.vo; public class MemberVO{ private String mem_id; private String mem_pw; private String mem_name; private String mem_sex; public String getMem_id() { return mem_id; } public void setMem_id(String mem_id) { this.mem_id = mem_id; } public String getMem_pw() { return mem_pw; } public void setMem_pw(String mem_pw) { this.mem_pw = mem_pw; } public String getMem..

create table emp ( e_id int not null primary key, e_name varchar(50), gen varchar(1), addr varchar(400) ); select * from emp; * 1시간 오류 딜레이로 MSSQL은 안함. MariaDB로 변경. https://mariadb.org/download/?t=mariadb Download MariaDB Server - MariaDB.org REST API Release Schedule Reporting Bugs … Continue reading "Download MariaDB Server" mariadb.org https://www.heidisql.com/download.php Download HeidiSQL Ad..

[validation.js] function CheckAddProduct() { var productId = document.getElementById("productId"); var name = document.getElementById("name"); var unitPrice = document.getElementById("unitPrice"); var unitsInStock = document.getElementById("unitsInStock"); // 상품아아디 체크 if (!check(/^P[0-9]{4,11}$/, productId, "[상품 코드]\nP와 숫자를 조합하여 5~12자까지 입력하세요\n첫 글자는 반드시 P로 시작하세요")) return false; // 상품명 체크 if (na..

2. 모달 만들기 * 모달이란, 다음 이미지와 같이 기존의 내용을 가리고 나타나는 메시지박스 같은 형태의 UI 를 의미한다. * 이번에는 이런 UI 를 HTML 과 JavaScript 를 사용하여 만들어보자. * 우선, Codesandbox 에서 새로운 Vanilla Sandbox 를 만들자. * 그리고, index.js 를 열고 맨 위 import "./styles.css"; 하단의 코드를 지워주자. 이번에 우리는 스타일링을 할 것이기 때문에 css 를 불러와야 한다. * 그 다음에, index.html 을 열어서 다음과 같이 수정해보자. 안녕하세요! 내용내용내용 버튼 열기 * 이렇게 화면이 나타났는가? * 그 다음엔, 버튼 아래에 다음 내용을 보여주자. 안녕하세요! 내용내용내용 버튼 열기 안녕하세요 ..

* HTML 을 사용하면 브라우저에서 우리가 보여주고 싶은 UI (유저 인터페이스) 를 보여줄 수 있다. 만약에 사용자의 인터랙션 (상호작용) 에 따라 동적으로 UI 를 업데이트하고 싶다면, JavaScript 를 연동해주어야 한다. * 보통 인터랙션이 많은 경우에는 Vanilla JavaScript (별도의 라이브러리/프레임워크를 사용하지 않는 형태) 를 사용해서 하기에는 코드의 양도 많아지고 코드 관리도 어려운 편이라 보통 React, Vue, Angular 등의 도구를 사용한다. * 그래도, 해당 도구 없이 하는 기본적인 방법 또한 이해를 해둬야 앞으로 라이브러리/프레임워크를 공부하게 될 때 이해에 도움을 주므로, 간단한 예제 몇가지를 함께 만들어보자. 1. 카운터 * 첫번째로 만들어볼것은, 버튼을..

2. async/await * async/await 문법은 ES8에 해당하는 문법으로서, Promise 를 더욱 쉽게 사용 할 수 있게 해준다. * 기본적인 사용법을 알아보자. function sleep(ms) { return new Promise(resolve => setTimeout(resolve, ms)); } async function process() { console.log('안녕하세요!'); await sleep(1000); // 1초쉬고 console.log('반갑습니다!'); } process(); * async/await 문법을 사용할 때에는, 함수를 선언 할 때 함수의 앞부분에 async 키워드를 붙여주고, Promise 의 앞부분에 await 을 넣어주면 해당 프로미스가 끝날때까지 ..

1. Promise * 프로미스는 비동기 작업을 조금 더 편하게 처리 할 수 있도록 ES6 에 도입된 기능이다. 이전에는 비동기 작업을 처리 할 때에는 콜백 함수로 처리를 해야 했었는데, 콜백 함수로 처리를 하게 된다면 비동기 작업이 많아질 경우 코드가 쉽게 난잡해지게 되었다. * 한번 숫자 n 을 파라미터로 받아와서 다섯번에 걸쳐 1초마다 1씩 더해서 출력하는 작업을 setTimeout 으로 구현해보자. function increaseAndPrint(n, callback) { setTimeout(() => { const increased = n + 1; console.log(increased); if (callback) { callback(increased); } }, 1000); } increaseA..

* 자바스크립트의 동기적 처리와 비동기적 처리에 대해서 알아보자. * 만약 작업을 동기적으로 처리한다면 작업이 끝날 때까지 기다리는 동안 중지 상태가 되기 때문에 다른 작업을 할 수 없다. 그리고 작업이 끝나야 비로소 그 다음 예정된 작업을 할 수 있다. 하지만 이를 비동기적으로 처리를 한다면 흐름이 멈추지 않기 때문에 동시에 여러 가지 작업을 처리할 수도 있고, 기다리는 과정에서 다른 함수도 호출할 수 있다. * 그러면, 한번 코드를 보고 이해해보자. * 연산량이 많은 작업을 처리하는 함수를 만들어보자. * 우선, Codesandbox 의 설정에서 sandbox.config.json 을 열어서 Infinite Loop Protection 이라는 속성을 비활성화하자. * 그 다음에, index.js 를 ..

8. 자바스크립트의 Scope 에 대한 이해 * 이번에는 자바스크립트의 Scope 에 대해서 알아보자. Scope란, 우리가 변수 혹은 함수를 선언하게 될 때 해당 변수 또는 함수가 유효한 범위를 의미한다. Scope 는 총 3가지 종류가 있다. 1. Global (전역) Scope : 코드의 모든 범위에서 사용이 가능하다. 2. Function (함수) Scope : 함수 안에서만 사용이 가능하다. 3. Block (블록) Scope : if, for, switch 등 특정 블록 내부에서만 사용이 가능하다. (1) 예시를 통한 Scope 이해 * 한번, 예시 코드를 보고 Scope 를 이해해보자. const value = 'hello!'; function myFunction() { console.log..

[데이터베이스] * Oracle을 그동안 배웠었다. * 관계형 데이터베이스(RDB)와 NoSQL (비관계형 DB)의 차이 * 이전에 은행 업무에서는 원장(장부)(Account 테이블)라 불렀다. * 홍길동 100만원 맡김, 전우치가 10만원 맡김. 홍길동이 10만원 빼가면 90만원. * 그런데 동명이인이 전우치. 얘가 또 100만원 빼감. 이런 경우를 해결하기 위해 member 테이블을 만듦. 홍길동을 S001이라 하고 홍길동이라 부름. 전우치는 S002. 강감찬은 S003. 다른 전우치는 S004. 이렇게 PK 값으로 구분. * 정규화 과정을 통해 테이블을 분리하여 관리. * join 문이 있다면 그것은 관계형 DB 이다. [Access] : File DB이다. 마이크로소프트의 office => Exc..