노트

이번 주 강의는 웹 페이지를 구성하는 HTML, CSS, Javascript에 기초적인 구조와 간단한 쇼핑몰 페이지를 구현하는 방법에 대해 설명해 주셨다. 복습 겸 실습으로 블로그의 CSS를 편집해서 다크테마를 적용해보자. 블로그 관리 -> 스킨 편집 -> html 편집 -> CSS 부분 코드를 편집해주면 된다. @media (prefers-color-scheme: dark) { ... } CSS 맨 밑에 위 코드를 추가해 주면 사용자의 시스템 컬러모드를 탐지해 다크모드일 경우 해당 코드가 동작한다. 이제 바꾸고 싶은 요소의 구조를 파악해 코드를 작성해 주면 되는데 F12를 눌러서 개발자 도구 모드를 켜고, Ctrl + Shift + C 를 누르거나 여기를 클릭 후 마우스 커서를 원하는 영역 또는 요소에..

UX/UIUX(User Experience): 사용자가 시스템이나 서비스를 이용하면서 느끼고 생각하게 되는 총체적 경험UI(User Interface): 사용자와 시스템 간의 상호작용이 원활하게 이뤄지도록 도와주는 장치나 소프트웨어CLI(Command Line Interface), GUI(Graphical User Interface)NUI(Natural User Interface): 사용자의 자연스러운 움직임으로 기기 조작UI의 기본 원칙직관성: 누구나 쉽게 이해하고 사용유효성: 사용자의 목적을 정확하고 완벽하게 달성학습성: 누구나 쉽게 배우고 익힘유연성: 사용자의 요구사항을 최대한 수용하고 실수를 최소화UI 설계 도구와이어 프레임: 페이지에 대한 대략적인 레이아웃이나 UI ..

HTML의 기본 문법에 대해 학습하던 중 항상 작성하는 DOCTYPE에 대해 궁금증이 생겨 간단하게 정리했다. DOCTYPE(Document Type Declaration) 브라우저는 .html과 같은 파일 확정자만으로 이게 어떤 규격으로 쓰인 것인지 알 수가 없기 때문에 이러한 문서 형식(Document Type)을 최상단에 명시해 표준 모드(Standards Mode)로 렌더링 하여 모든 웹 브라우저에서 같은 레이아웃으로 웹 페이지를 제공할 수 있도록 한다. HTML 문서 버전을 선언하는 것으로, 이 선언이 있으면 W3C의 표준안으로 확정한 HTML5로 웹이 랜더링 된다. HTML5 이전의 DOCTPYE 선언은 더 길고 복잡했으나 HTML5는 위와 같이 간소화 됐으며, 이전 버전들에 비해 문법적인 면..

인터페이스 기능 구현모듈 세부 설계서컴포넌트 명세서: 컴포넌트 개요, 내부 클래스의 동작, 인터페이스를 통해 외부와 통신하는 명세 등을 정의인터페이스 명세서: 컴포넌트 명세서에 명시된 인터페이스 클래스의 세부적인 조건 및 기능을 명시한 명세서미들웨어운영체제와 응용 프로그램 또는 서버와 클라이언트 사이에서 다양한 서비스를 제공하는 소프트웨어미들웨어는 표준화된 인터페이스를 제공함으로써 시스템 간의 데이터 교환에 일관성을 보장RPC(Remote Procedure Call, 원격 프로저 호출): 응용 프로그램의 프로시저를 사용하여 원격 프로시저를 마치 로컬 프로시저처럼 호출하는 미들웨어MOM(Message Oriented Middleware, 메시지 지향 미들웨어): 메시지 기반의 비동기형 ..

클라우드 컴퓨팅이란? 인터넷 기반 컴퓨팅의 일종 정보를 자신의 컴퓨터가 아닌 클라우드에 연결된 다른 컴퓨터로 처리하는 기술 사용자의 직접적인 관리 없이 데이터 스토리지와 컴퓨팅 파워와 같은 컴퓨터 시스템 리소스를 필요시 제공 즉, 개인이 가진 단말기에서는 주로 입출력 작업만 이루어지고 정보분석 및 처리, 저장, 관리, 유통 등의 작업은 클라우드라고 불리는 제3의 공간에서 이루어지는 컴퓨팅 시스템 형태라고 할 수 있음. 장점 민첩성(Agility) - IT 리소스의 구동이 빨라짐. 물리적인 서버를 설치하지 않고 AWS와 같은 가상의 서버를 이용 가능 탄력성(Elasticity) - 비즈니스 요구에 따라 리소스 운용의 확장, 축소가 용이해 동적으로 스케일링 비용 절감(Low cost) - 리소스를 사용한 만..

1. 개발환경 구축개발 도구 분류빌드 도구: 작성한 코드의 빌드 및 배포(Ant, Maven, Gradle)구현 도구: 코드의 작성과 디버깅, 수정(Eclipse, InteliJ, VS)테스트 도구: 코드의 기능 검증, 전체적인 품질 향상(xUnit, PMD, Sonar)형상 관리 도구: 산출물에 대한 버전 관리(Git, SVN, CVS)서버 하드웨어 개발환경웹 서버: HTTP를 이용한 요청, 응답 처리(Apache 웹 서버, Google 웹 서버)웹 애플리케이션(WAS): 동적 컨텐츠를 처리하고 제공(Tomcat, Jeus, Resin)DB 서버: 데이터 수집, 저장(MySql, Oracle, MS-SQL)파일 서버: 파일 저장 하드웨어, 물리 저장 장치를 활용한 서버(HDD, ..

연계 메커니즘응용 소프트웨어와 연계 대상 모듈 간의 데이터 연계 시 요구사항을 고려한 연계방법과 주기를 설계주요 연계 기술직접 연계: 중간 매개체 없이 송수신 시스템이 직접 연계하는 방식DB 링크: DB에서 제공하는 DB링크 객체를 이용DB 연결: 수신 시스템의 WAS에서 송신 시스템 DB로 연결하는 DB 커넥션 풀을 생성, 연계 프로그램에서 해당 DB 커넥션 풀 명을 이용하여 연결API(Application Programming Inteface): 송신 시스템의 DB에서 데이터를 읽어서 제공JDBC(Java DataBase Connectivity): 자바에서 DB 프로그래밍을 하기 위한 API, 수신 시스템의 프로그램에서 JDBC 드라이버를 이용하여 송신 시스템 DB와 연결하이퍼 링크:..

ORM(Object-Relational Mapper) 관계형 데이터베이스(RDB)의 테이블과 객체지향 프로그램의 클래스 사이를 자동으로 연결해 주는 것 ORM을 이용하면 SQL 문장이 아닌 클래스의 메서드를 이용해 데이터베이스 접근, 조작가능 ex) USER라는 테이블에 매핑된 클래스의 객체가 user 일 때, USER 테이블의 데이터를 조회하는 방법 SQL: SELECT * FROM USER -> user.findAll() 장점 반복적이고 복잡한 쿼리를 대신 직관적인 코드로 데이터 조작이 가능해 코드 가독성 증가 코드의 재사용성, 유지보수가능성, 리팩토링 용이성 향상 대부분의 ORM이 특정 DB에 종속적이지 않아 DBMS 교체 작업도 어렵지 않음. 단점 객체와 테이블이 서로 완전히 모델링이 일치하기 어..

7. 관계 데이터베이스 모델튜플(Tuple) or 레코드(Recode); 행(Row), 카디널리티(Cardinality) = 튜플의 수속성(Attribute) or 필드(Field): 열(Column), 차수(Degree) = 속성의 수도메인(Domain): 하나의 속성이 가질 수 있는 값의 범위관계 대수 - 절차적: 원하는 데이터를 찾기 위한 처리 과정을 명시SELECT: 선택 - σ (테이블)  -> 조건을 만족하는 튜플의 부분 집합PROJECT: 추출 - π (테이블) -> 리스트에 제시된 속성 값만을 추출JOIN: 연관된 튜플 결합 - R ⋈ S -> 공통 속성을 중심으로 두 릴레이션을 하나로 합침DIVISIN: 관련있는 튜플 반환 - R ÷ S -> R에서 S 조건에 맞는 것만 분리∪(Un..

1. 데이터 베이스 개념데이터베이스 정의공유 데이터: 여러 응용 프로그램들이 공동으로 사용하는 데이터저장 데이터: 컴퓨터가 접근 가능한 저장 매체에 저장된 데이터통합 데이터: 검색의 효율성을 위해 중복이 초소화된 데이터의 모임운영 데이터: 조직의 목적을 위해 존재 가치가 확실하고 반드시 필요한 데이터데이터 언어정의어 DDL(Definition): DB의 구축과 변경 목적으로 사용, 데이터 형식, 구조, 제약조건 명시조작어 DML(Manipulation): 검색, 삽입, 삭제, 갱신 연산을 포함한 집합제어어 DCL(Control): 데이터 무경성(Integrity), 보안(Security), 권한(Authority) 검사, 병행 제어(Concurrency Control)3계층 스키..