풀스택 77

Oracle ■ DML SELECT(2)-그룹쿼리

◈ DML ◈ • ORDER BYSELECT에 의해서 조회된 데이터를 정려해주는 구문으로써, 데이터의 조회 후 실행되기때문에 SELECT문의 가장 마지막에 실행됨아래의 옵션은 생략 가능함 • ORDER BYEMPLOYEE_ID 컬럼을 내림차순으로 정렬  • 그룹함수여러 개의 행을 묶어 연산하여 결과를 반환하며 자주 쓰이는 그룹 함수는 아래와 같음 * Oracle의 내장함수 중 한가지 분류임. 그룹함수 외에도 문자함수, 수치 함수, 날짜 함수 등의 내장 함수들이 존재함  • 그룹함수 - MAXEMPLOYEES 테이블에 있는 SALARY 컬럼의 최대 값을 반환  • 그룹함수 - MINEMPLOYEES 테이블에 있는 SALARY 컬럼의 최대 값을 반환  • 그룹함수 - AVGEMPLOYEES 테이블에 있는 S..

Back-End/Oracle 2024.07.15

Oracle ■ DML SELECT(1)

◈ DML ◈ • DML(Data Manipulation Language)데이터 조회 및 변경하기 위한 명령어 • DML의 종류1. 조회 : SELECT2. 삽입 : INSERT3. 삭제 : DELETE4. 변경 : UPDATE • 스키마 오브젝트(Schema Object)테이블, 뷰, 인덱스와 같은 구조를 포함하는 데이터의 저장 구조를 가진 객체 • 스키마(Schema)여러 개의 스키마 오브젝트가 모인 집합사용자가 생성한 데이터베이스 객체들을 의미하며 스키마의 이름은 계정명을 따라감ex) eunsik이라는 계정이 테이블 등의 객체를 만들었다면 eunsik 스키마가 됨 • SELECT데이터를 조회할 때 사용하는 명령어-> 문법 : SELECT [컬럼명] FROM [테이블명]; 각각의 컬럼을 조회할 수 있..

Back-End/Oracle 2024.07.10

Oracle ■ 데이터베이스 종류와 기초

◈  데이터베이스 ◈  • 데이터베이스(DataBase)통합하여 관리되는 데이터의 집합 * 앞으로 배울 데이터베이스의 특징으로는 엑셀과 같은 열과 행이 있는 표 형식으로 데이터를 표현함 • DBMS (DataBase Management System)데이터베이스를 관리하기 위한 소프트웨어 • NoSQLRDBMS 외의 다른 유형의 데이터베이스를 지칭하며 구체적인 정의는 없음 * 대한민국이 아닌 모든 나라를 외국이라고 부르는 것과 비슷함 • 관계형 데이터베이스(RDBMS)데이터를 모아둔 테이블들이 서로 관계를 맺고 모여있는 집합체 • RDBMS의 종류    ◈  개발환경 구축하기 ◈ * 상황마다 방식이 다를수있습니다. • 설치 전 주의사항1. 드라이브 바로 아래에 설치 X-> ex) C드라이브 아래에 orac..

Back-End/Oracle 2024.07.09

JavaScript ■ 비동기

◈  비동기 ◈   • 동기적(Synchronus)동기적은 하나의 작업이 모두 수행될 때 까지 다른 작업을 수행 하지 못함  • 비동기적(Asynchronous)비동기는 작업의 결과를 기다리는 동안 다른 작업을 미리 수행하는 것 오래 걸리는 작업들에 대해 백그라운드에서 처리되며 그동안 다른 작업을 계속 수행할 수 있도록 함  • 비동기 작업의 대표적인 예시와 함수/문법1. Ajax, setTimeout2. Callback 함수, Promise, async/await • 비동기 확인하기예상했던 코드의 동작과 콘솔 로그에 찍히는 로그의 차이점 확인하기-> 비동기적  ◈  setTimeout 흐름 파악하기 ◈     ◈  setTimeout 흐름 파악하기 -2◈  • 상황  setTimeout이 0초로 설정되..

JavaScript ■ 함수

◈ 함수 ◈  • 함수(Function)특정 동작을 수행하거나 코드를 재사용하기 위해 사용 • 함수의 종류1. 일반 함수2. 익명 함수3. 화살표 함수4. 생성자 함수5. 내부 함수6. 재귀 함수7. 콜백 함수8. …  • 일반 함수일반적으로 사용되는 함수로써 return문을 사용하여 값을 반환함 * 호이스팅 가능  • 익명 함수익명 함수는 일반적으로 한번만 사용하는 기능이 필요할 경우에 쓰임 -> 메모리 관리에 대한 방안으로, 일반 함수는 호이스팅 되어 불필요한 메모리를차지하게 되지만 익명 함수는 실행 후 사라짐  • 화살표 함수코드의 라인을 줄이기 위해 사용  • 생성자 함수객체를 생성하여 재사용 하기 위해 사용됨-> 코드의 재사용이 아닌, 객체의 재사용-> 관례적으로 생성자 함수는 앞 글자를 대문자..

JavaScript ■ HTML 태그 접근과 데이터 입출력

◈ getElement ◈  • getElementHTML 요소의 Class, Name, Id, Tag 값을 이용하여 요소에 접근 • querySelectorCSS 선택자를 사용하여 요소에 접근 • getElement vs querySelector일반적으로 getElement가 더 많은 브라우저에서 지원되며 *속도가 빠르기 때문에 더 많이 사용되나, 성능보다는 개발의 편의성을 위해 querySelector를 사용하는 개발자도 있음 * HTML Collection vs NodeList ◈ getElement의 종류 ◈ • getElement의 종류id는 동일한 값을 가질 수 없기 때문에 getElement Tag, Class, Name은동일한 값을 여러 태그에서 가질 수 있기 때문에 getElements ..

JavaScript ■ 개요 및 변수

◈ JavaScript ◈  • JavaScriptJavaScript는 브라우저에서 실행되는 언어로써 인터프리터 방식의 객체지향 프로그래밍 언어이다. • ES6ES란 JavaScript의 표준 규격을 의미 하는데, 이는 ECMA에서 정하게 된다. ES6은 가장 최근의 표준 규격으로써 JavaScript 개발 시 ES6 이상의 버전을 사용하는것이 권고됨 ◈ JavaScript 작성 방식 ◈ • inline자바스크립트의 코드가 매우 짧거나 간단한 용도로 사용해야할 때 HTML 태그 안에 직접 코드를 작성하는 방식  • internalHTML 태그 내에 직접 작성하는 것이 아니라, 를 별도로 작성하여 사용하는 방식. 자바스크립트 코드의 위치는 head, body 안에 작성 하거나 이후에 작성할 수 있음  • ..

CSS ■ 화면 설계 및 구현

◈ 와이어 프레임 ◈  • 와이어 프레임(WireFrame)UI/UX 기획 과정에서 진행되는 작업으로써 선(Wrie)을 이용하여 윤곽선(Frame)을 잡아 페이지의 구조를 보여주는 설계도로써 프로젝트의 초창기에 설계됨와이어 프레임을 도와주는 여러가지 툴들이 있지만, 실습 시 파워포인트 또는 drawio로 진행 • 장점1. 개발자 : 사이트의 기능을 시각적으로 보기 때문에 쉽게 이해할 수 있음2. 디자이너(퍼블리셔) : 디자인 컨셉을 명확히 잡아 구현할 수 있음3. 클라이언트 : 요구사항이 잘 전달되어 진행되고 있는지 확인할 수 있음 • 예시(drawio의 기본 템플릿)  ◈ 스토리 보드 ◈  • 스토리보드기획 과정에서 페이지의 전체적인 흐름(텍스트, 이미지, 등)이 어떻게 진행되는지 구체적인 내용들을 모..

Front-End/CSS 2024.06.21

CSS ■ 애니메이션, 키프레임, 미디어쿼리

◈ 애니메이션 ◈  • Animation애니메이션은 웹 요소들을 부드럽게 움직이거나 변화시키는 기능을 수행함*keyframe 외에도 다른 속성과 기능들이 있음 • 속성  ◈ 애니메이션 속성 ◈ • animation-name: [이름]애니메이션 이름 • animation-duration: [초]s애니메이션이 완료(0%  100%) 까지 걸리는 시간 • animation-timing-function: [속성값]애니메이션의 시간에 따른 변화 속도 • 속성값 종류1. linear : 처음부터 끝까지 일정한 속도로 진2. ease : (Default) 천천히 시작되어 빨라지고, 마지막에 다시 느려짐3. ease-in : 천천히 시작4. ease-out : 천천히 종료5. ease-in-out : 천천히 시작되어..

Front-End/CSS 2024.06.19

CSS ■ 가상 클래스 선택자와 트랜지션

◈ 가상 클래스 선택자 ◈   • 가상 클래스 선택자특정 상태에 있는 요소를 선택하기 위해 사용 • 종류 • :active사용자가 활성화 한 요소 (버튼 클릭, 메뉴에서 특정 게시판 선택 등)  • :hover사용자가 마우스를 올렸을 때 • :focusinput 박스 등 입력칸이 포커싱 되었을 때  • :link한번도 방문한 적 없는 링크 • :visited방문한 적 있는 링크  ◈ 트랜지션 ◈  • 트랜지션(Transition)CSS의 프로퍼티 값의 변화가 일정 시간에 걸쳐 일어나도록 해주는 기능 • 종류  • transition-timing-function  오늘은 가상 클래스 선택자와 트랜지션에 대해 정리를 해보았습니당 곧 세미 프로젝트 끝나는데 화이팅하고 공부 더 열심히하면서 블로그 업로드 해야겠..

Front-End/CSS 2024.06.19