bonoitlog의 등록된 링크

 bonoitlog로 등록된 티스토리 포스트 수는 61건입니다.

11. oracle (LEAD, LAG) [내부링크]

특정 값의 위, 아래 값을 구하고 싶으면 LEAD와 LAG을 사용한다. LEAD (칼럼명, 숫자, 디폴트값) LAG(칼럼명, 숫자, 디폴트값) sal 을 기준으로 오름차순으로 표시한 상태이다. LEAD, LAG 함수를 사용해서 이전..

9. oracle(JOIN) [내부링크]

https://tragramming.tistory.com/74 JOIN 하나의 테이블로 원하는 칼럼정보를 참조 할수 없는 경우 관련된 테이블을 논리적으로 결합하여 원하는 칼럼 정보를 참조하는 방법 을 JOIN 이라고 한다. 형식 SELECT 칼..

8. oracle (복수행 함수, GROUP BY, HAVING) [내부링크]

복수행 함수 여러개의 row 당 하나의 결과값을 반환하는 함수. COUNT(칼럼명) 해당 칼럼이 존재하는 ROW 의 갯수를 반환한다. 단, 저장된 데이터가 NULL 인 칼럼은 세지 않는다. SQL>SELECT..

7. oracle (단일행 함수, 숫자 함수, 날짜 함수, 변환함수) [내부링크]

숫자함수 ABS(숫자) 숫자의 절대값을 반환한다. SQL>SELECT ABS(-10) FROM DUAL; CEIL(소수점이 있는 수) 파라미터 값보다 같거나 가장 큰 정수를 반환(올림) SQL>SELECT CEIL(3.1234) FROM DUAL; SQL>SELECT CEIL..

6. oracle(단일행 함수,문자 함수) [내부링크]

단일행 함수 CHR(아스키 코드) SQL>SELECT CHR(65) FROM DUAL ; CONCAT(칼럼명, '붙일문자') 문자열 연결함수 SQL>SELECT CONCAT(ename, ' 님' ) name FROM emp ; INITCAP( '문자열' ) 시작문자를 대문자로 바꿔준..

5. oracle (SPOOL, HOST) [내부링크]

자주쓰는 코드는 메모장에 저장해서 파일이름.sql로 저장해서 필요할때 사용할 수 있다. 마지막 코드는 미리 작성한 sql파일을 사용하기 위해서 @를 타이핑 후 파일을 끌어와서 작성된 코드이다. SPOOL, SPOOL O..

4. oracle (연산자) [내부링크]

비교연산자 =, !=, >, <, >=, <= 논리연산자 AND, OR , NOT SQL 연산자 IN, ANY, ALL, BETWEEN, LIKE ,IS NULL, IS NOT NULL 비교연산자 != 예시 부서번호가 30번이 아닌 사람들의 이름과 부서번호를 출력 SQL>SEL..

3. oracle (scott, 실행순서, 데이터 양식, ASC, DESC, AS) [내부링크]

oracle 실행순서 실행순서  형식 5 SELECT 1 FROM 2 WHERE 3 GROUP BY 4 HAVING 6 ORDER BY (ASC | DESC) 기본 데이터 양식 emp = 테이블명 empno = 사원번호 ename = 사원이름 job = 직업, 직책 mgr = manager's..

2. oracle (ED) [내부링크]

명령어 정리 ED 메모장으로 편집 / ED 편집 후 실행하면 행 추가 SET LINESIZE 테이블 넓이 설정 ex) SET LINESIZE 200 SELECT*FROM member COLLUMN FORMAT 칼럼 간격 설정 ex) COLLUMN member FORMAT(A10, A15) ..

1. oracle 시작하기 (기초 명령어) [내부링크]

DB에 저장하는 정보는 주로 숫자, 문자, 날짜로 구성되며 표(table) 형식으로 정보를 저장한다. 오라클은 대소문자를 구분하지 않지만 명령어와 임의의 명칭을 구별하기 위해 명령어는 대문자로 작성하였다. 데이..

bootstrap 정리 [내부링크]

bootstrap https://getbootstrap.com/ CDN links CSS https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css JS https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstra..

bootstrap 기초(반응형 폭 조절) [내부링크]

세계에서 가장 인기있는 HTML, CSS, JS 라이브러리인 bootstrap의 기본적인 사용법을 소개한다. 예시가 있다고 가정해보자. ex) col은 row 안에 넣어서 작성한다. (tr,td 와 비슷한 원리) row = 행 col = 열 여기..

loop_test2(배열 응용 반복문 복습) [내부링크]

array type(배열)을 사용하는 반복문의 가장 기본적인 형태이다.

loop_test (함수의 형태와 반복문 복습) [내부링크]

함수의 형태와 반복문에 대한 예시를 간단하게 작성하였다. 첫번째 버튼과 두번째 버튼은 보이는 기능은 같지만 분명한 차이가 있다. 첫번째와 다르게 두번째 버튼의 코드는 global area에 작성되는 전역 함수를..

Step07_operator(연산자)스터디 [내부링크]

1. 산술 연산자 산술 연산자는 +, -, , /, % 등을 의미한다. 숫자 뿐만 아니라 문자열 데이터 타입도 산술 연산자를 사용할 수 있다. 익숙한 연산자들은 설명을 생략하겠다. % 연산자는 나머지를 구하는 연산자이..

Step06_example2(creatElement, append 응용)스터디 [내부링크]

creatElement 와 append를 사용해서 일정 정보가 html table 형식으로 입력되는 기능을 만들었다. 2022.07.10 - [javascript] - Step04_createElement(createElement, append, this, remove)스터디

Step06_example(beforeend)스터디 [내부링크]

이름과 주소를 동적으로 추가하는 문서객체를 만드는 연습을 할 계획이다. 추가하는 방식을 3가지로 작성하여 버튼이 3개다. 2022.07.10 - [javascript] - Step04_createElement(createElement, append, this, rem..

Step06_innerHTML(innerHTML, insertAdjacentText, insertAdjacentHTML, beforeend)스터디 [내부링크]

innerText 입력된 문자열을 그대로 넣는다 innerHTML 입력된 문자열을 html 형식으로 넣는다. --함수-- insertAdjacentElement ex) targetElement.insertAdjacentElement(position, element) insertAdjacentEleme..

Step05_random(floor(Math.random()*숫자))스터디 [내부링크]

Step02_example9에서 배웠던 랜덤한 정수를 출력해주는 floor(Math.random()*숫자)를 사용하여 숫자 맞추는 게임을 만들었다. 2022.07.08 - [javascript] - Step02_example9(Math.random, Math.floor) Step02_exa..

Step05_example(&&, 비동기 작업, 가위바위보)스터디 [내부링크]

Step02_example11에서 만든 가위바위보 게임과 Step03_quiz에서 배운 &&을 사용하여 가위바위보 게임을 다시 만들었다. 2022.07.08 - [javascript] - Step02_example11 (가위바위보 게임, if else if) 2022.07.10..

Step05_createElement2(setAttribute)스터디 [내부링크]

버튼을 누르면 이미지가 순서대로 출력되는 기능을 작성해보자 setAttribute setAttribute()는 선택한 요소(element)의 속성(attribute) 값을 정한다.

Step04_createElement(createElement, append, this, remove)스터디 [내부링크]

createElement javaScript를 통해 HTML 요소를 생성한다. ex) createElement let div = document.createElement('div'); //div 추가 let div = document.createElement('div class=myDiv'); // css를 가진 div를..

Step03_quiz(논리 연산자 &&)스터디 [내부링크]

논리 연산자 &&을 사용한 예제이다. 논리 연산자 &&은 양쪽이 조건이 모두 맞아야 되는 연산자이다. 중고등수학에서 사용되는 and와 같은 의미라고 생각할 수 있다. 예시에서는 h>=150 && w 조건을 충족했을 때..

Step03_if3(keydown, keyCode==13)스터디 [내부링크]

keyup 키보드에서 손을 땠을 때 실행 keydown 키보드를 눌렀을 때 실행 키보드를 누르고 있을 때 한번만 실행된다. keypress 키보드를 눌렀을 때 실행 키보드를 누르고 있을 때 계속 실행된다. 점수를 입력하고 En..

Step03_if2(placeholder, 양수 판별)스터디 [내부링크]

input에 텍스트를 입력 후 버튼을 누르면 양수인지 아닌지를 판별해주는 코드를 작성하고자한다. placeholder를 활용하여 input에 입력할 정보를 미리 안내하는 문구를 적었다. script에서는 Number()함수를 활용..

Step02_example11 (가위바위보 게임, if else if) [내부링크]

배운 것들을 활용하여 가위바위보 게임을 만들고 승패를 표시할 수 있는 기능을 넣어보자 사용자의 value값에서 컴퓨터의 value값을 뺀 다음, 각 승부별로 나오는 값의 특징을 활용하여 if문을 구성했다. 기존의..

Step02_example10 (change, value) [내부링크]

기존에 addEventListener 함수를 쓸때 click을 사용했던 것과 다르게 change를 사용했다. button 태그에 click을 사용했듯이, option 태그와 함께 쓰기에 용이하다. option에 value 값을 정해놓지 않는다면 해당..

Step02_example9(Math.random, Math.floor) [내부링크]

랜덤한 숫자를 얻을 수 있는 방법이다. Math.random() 0이상 1 미만의 랜덤한 실수 Math.random()*10 0이상 10 미만의 랜덤한 실수 Math.floor(숫자) 내림해서 정수로 변경 Math.floor(Math.random()*10) 0이상 9..

Step02_example8(이미지 확대 축소,for, if else) [내부링크]

Step02_example6 의 변형 예제로 5개의 이미지를 각각 클릭시 확대 축소를 가능하게 만들었다 확대만 가능 2022.07.08 - [javascript] - Step02_example6 (for, length) 한개만 가능 2022.07.08 - [javascript] -..

Step02_example7 (if else) [내부링크]

if(){} ()안이 true면 {}을 실행한다. if(){}else{} ()안이 true면 첫번째 {}를 실행하고 false면 두번째 {}를 실행한다. 해당 예제는 Step03_example6에서 이미지를 클릭시 크기를 키우는 코드만 작성했다면 이번..

Step02_example6 (for, length) [내부링크]

for 반복문을 예제를 활용하여 복습하려고 한다. for 반복문을 활용하여 클릭한 이미지만 확대되게 만들었다. 변수명.length를 사용하여 img가 늘어나도 javascript를 수정할 필요 없게 작성하였다. 이후 transit..

Step02_example4 (변수 연산, if, return) [내부링크]

다음은 변수를 활용한 연산의 복습이다. 2022.07.07 - [javascript] - Step02_example1,2 (변수 연산, if, CamelCase) div1~div10까지의 innerText가 바꾸기 버튼을 누를때마다 하나씩 김구라로 바뀌는 예제이다...

css 선택자 모음 [내부링크]

https://code.tutsplus.com/ko/tutorials/the-30-css-selectors-you-must-memorize--net-16048 반드시 기억해야 하는 CSS 선택자 30개 여러분은 id, class, descendant 기초를 알고 있겠죠. 과연 그게 전부일까요?..

Step02_example3 (반복문, for) [내부링크]

for 반복문의 형식 for ( let 변수명 = 초기값; 변수명 < 종료값; 변수명++ ) {}; ex) for (let i=0; i 해당 예제는 20개지만 더 많은 숫자의 데이터를 작업하려면 수작업으로 하기에는 어려움이 있을 것이다. 이..

Step02_example1,2 (변수 연산, if, CamelCase) [내부링크]

다음은 배운 것들을 활용한 예제이다 2022.07.07 - [javascript] - Step02_event3 여기서 count 값을 미리 let으로 정의해두고 addEventListener을 작성한 것을 알 수 있다. 이후 count+"px" 연결연산을 활용하여..

Step02_event3 (이벤트 목록, 좌표값) [내부링크]

배운 것들을 응용해서 예제를 작성해보자 1,2번 예제는 2022.07.07 - [javascript] - Step02_event (addEventListener) 2022.07.07 - [javascript] - Step02_event2 (css에 접근하기) 이전 배운 것들을 참고하여..

Step02_event2 (css에 접근하기) [내부링크]

최근까지 javascript로 html에 접근하는 방법을 배웠다면 이번에는 css에 접근하고 변경하는 방법을 배워보자. myDiv를 id 값으로 가지고 있는 div를 변수 div1으로 지정하여 css를 변경했다. 물론 변수를 지정하..

Step02_event (addEventListener) [내부링크]

그동안 onclick을 활용하여 일련의 javascript를 동작하게 했었다. 이는 script glabal area에 함수를 만들게끔 강제되는 것으로 global area에 함수가 많아지면 여러 단점이 존재하기에 addEventListener 함수를..

Step01_example3 2 (코드 줄여보기) [내부링크]

다음은 Step01_example3에서 작성했던 코드이다. 2022.07.06 - [javascript] - Step01_example2,3 (inner Text, value 변경, Number()) 이것을 더 간결하게 작성하려 한다. 자주쓰는 코드를 input1, input2, res..

Step01_example2,3 (inner Text, value 변경, Number()) [내부링크]

input 요소에 사용자가 입력한 문자열을 javascript로 접근할때 innerText가 아닌 value로 접근할 수 있다. 다음은 예시 문제이다. 입력값은 value, 결과값은 innerText로 작성해준 것을 볼 수 있다. let msg=d..

Step01_example1 2 (querySelector) [내부링크]

Step01_example 에서 연습한 예제를 확장시켰다. 2022.07.06 - [javascript] - Step01_example (javascript에서 태그 접근하기) 해당 모든 데이터를 array type으로 출력해주는 querySelectorALL과 다르게 queryS..

Step01_example1 (javascript에서 태그 접근하기) [내부링크]

html, head, meta, title, body, p 등의 태그는 object type 형식을 띄고 있다. javascript로 특정 p태그에 접근해보기 앞서 배웠듯이 document.querySelectorAll("p") 에서 document는 뒤에 .이 있기에 object..

Step01_dataType11 (confirm, prompt, if ) [내부링크]

alert 빌트인 함수는 기존에 배웠듯이 팝업창을 실행시켜주는 빌트인 함수이다. confirm이라는 모양새가 비슷한 빌트인 함수도 존재하는데 가장 큰 차이는 취소버튼이 추가된 것과 출력값이 boolean type으로 출..

Step01_dataType (let, 변수) [내부링크]

javascript는 html, css와는 다르게 동적인 언어라고 할 수 있다. javascript 영역은 head와 body 상관없이 작성 가능하다 브라우저에서 확인 가능한 console 영역 역시 javascript의 영역으로 추후에 작업할때..

git 사용하기 3 [내부링크]

git Bash Here 클릭 후 git clone +(git hub 주소)를 입력하면 git hub에 저장했던 자료를 가져올 수 있다. 이때 원격 저장소(git hub)에 저장된 자료를 가져오는 것을 fetch라고 한다. 이후 origin/master가 head..

Step01_dataType10 2 (type 복습, 참조 데이터) [내부링크]

1. number type let 변수명=숫자; 2. string type let 변수명="문자"; 3. boolean type let 변수명=true; let 변수명=false; 4. object type - 여러가지 타입을 묶어서 사용할때 사용한다. let 변수명={key:value,..

Step01_dataType10 (매개 변수, 연결연산) [내부링크]

함수에 매개변수를 미리 정해놓고 대입값을 매개변수에 적용할 수 있다. 물론 매개변수는 설정한 함수에서만 사용 가능하다. 10과 hello를 검색하여 매개변수에 대입한 예시이다. let을 활용하여 만든 변수명을..

Step01_dataType9 (return, type 유추) [내부링크]

각각의 함수 안에 let을 활용하여 object 혹은 array 함수로 일련의 정보를 입력해놓고 return으로 이동시켜 값을 출력할 수 있도록 작성했다. 예시에서 getData() 는 object type 형식으로, getFriends()는 arr..

Step01_dataType7,8 (function, return, sources) [내부링크]

함수 만드는 3가지 방법을 소개한다. 방식에 차이가 있다. 첫번재와 세번째 방식인 f1과 f3 함수는 let을 이용하여 함수를 준비해놓고 호출시키지는 않은 상태라고 볼 수 있고 두번째 방식인 f2 함수는 준비도 되..

Step01_dataType6 (function type, ==) [내부링크]

function type은 data를 준비해놓아야할 경우 사용한다. function type은 function(){} 형식으로 작성한다. 기존에 배웠던 console.log() (페이지 로딩시에 결과 값을 출력시켜 주는 함수) 를 활용하여 f1이라는..

Step01_dataType5 (array type) [내부링크]

배열은 주로 한가지 type의 데이터만 담는 것이 일반적이고 안에 object type을 삽입할 수 있다. 이전과 같은 방식으로 array type에 저장된 특정 정보만 확인할 수 있다. 형태를 보고 type을 유추해 볼 수 있다..

Step01_dataType4 (array type) [내부링크]

앞서 dataType2,3 (https://bonoitlog.tistory.com/10)에서 공부한 object type은 순서가 중요치 않을때 사용된다. 반면에 순서가 중요한 상황에서는 array type을 사용하고 let key=[value1, value2] 형식을 사..

Step01_text [내부링크]

처음 visual studio를 열고 ! tap 혹은 ! enter를 타이핑해본다. 기본 html 형식이 나온다. 이후 이런식으로 body에서 텍스트, 하이퍼링크, 이미지 등이 삽입 가능하고 style을 활용하여 글자크기, 배경색상 등..

visual studio 단축키 모음 [내부링크]

visual studio에서 활용 가능한 단축키를 정리해 놓은 사이트로 활용도가 높다. 필자는 html을 처음 배울때 UI/UX 웹디자인 웹퍼블리셔 과정에서 배웠는데 당시 여러가지 이유(수강생 중 일부가 맥을 사용하고 윈..

Step01_dataType2,3 (boolean type, object type) [내부링크]

프로그래밍에서는 참과 거짓을 나타낼때 사용하는 boolean type이 존재한다. 위의 사진은 boolean type을 사용할때 활용되는 연산 및 연산자를 사용한 예시이다. javascript에 대표적인 3가지 타입이다. 이외에..

visual studio code 설치하기 [내부링크]

https://code.visualstudio.com/ Visual Studio Code - Code Editing. Redefined Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applications...

git hub 사용하기 [내부링크]

git hub를 가입한 후 우측상단을 보면 New repository 기능이 있다. 다른 설정들은 조작하지 않고 저장소를 만들어준다. 저장소를 만들면 나오는 추천 명령어 중에 git remote add origin https:github.com으로..

git 사용하기 2 [내부링크]

git 사용하기 1(https://bonoitlog.tistory.com/4)에서 했던 것과 같은 파일에서 같은 방식으로 branch를 만들어줬다. html에 기능을 추가한 뒤에 add, commit을 했다. master branch로 checkout을 한 뒤에..

git 사용하기 1 [내부링크]

폴더에 html 파일을 만든 후 Git Bash Here을 클릭한다. git init을 하면 .git라는 폴더가 생긴다. commit하지 않은 index.html 파일이 생긴 것을 git이 인식한다. index.html을 add하고 git status로 확인하..

git 시작하기 [내부링크]

https://git-scm.com/ git 초기 설치 후 git.exe를 명령 프롬포트에 입력하여 잘 설치되었는지 확인할 수 있다. init : 특정 저장소를 git으로 관리할 때 사용. add : commit 전에 commit의 대상을 설정할 때 사..

티스토리 블로그 시작하기 [내부링크]

정확한 지식을 공유하는데 목표를 두고 운영할 계획이다. 국비지원학원에서 개발자 양성과정을 수강하며 복습과 정보공유에 목적을 두고 블로그 운영을 결심하게 되었다. 학원에 다니기 전 개발 공부를 독학하며..