개발롬의 개발일지

분명 !! 아는 내용인데 꼭 면접이나 누군가한테 설명할 때 머리가 하얘지고 말이 안나오는 밥 오의 CSS 우선순위 정리.... 더보기 !important >>> inline >>> id선택자 >>> class명 >>> HTML태그 >>> DOM구조 상위 상속 1. !important 속성 값 뒤에 !important를 붙인 속성이다. hello world .box { color: pink !important; } .box { color: blue; } 이러케! 이러케 하면 hello world는 핑크색이 되겠죠 2. HTML 코드에 inline 스타일링 hello world .box { color : black; } 이러케 ! 3. id로 선언 hello world #title { color: red; ..

지난 8월 1년정도 다니던 회사가 경영악화로 회사가 증발되면서 나도 같이 증발됐다. 그간 나는 1년동안 그 회사에서 React로 홈페이지, 우리회사 채용사이트, 규모가 꽤 있는 쇼핑몰플랫폼도 만들어 보았기에 좀 자만했었다. 1년이라는 시간동안 그래도 많은 경력을 쌓았다고 생각했고, 예전에 처음 취업 준비를 할 땐 이렇게까지 빡센(?) 느낌이 아니었다. 솔직히 그냥 HTML, CSS, Javascript만 어느정도 다룰 줄 알면 데려가서 가르쳐주고 역량을 키우게 하려는 회사들이 많았다. (개인적인 생각, 그리고 거의 스타트업 위주) 그래서인지 요즘의 취업시장에 대해 잘 몰랐고 그냥 자만 한 채로 몇달을 그냥 나태하게 지냈던 것 같다. 그러다가 이제 막 취업을 해야겠다 발등에 불떨어진 사람마냥 급하게 포트폴..

인덱스 활용 테이블 조회 시간을 단축하기 위해 사용하는 인덱스의 개념을 이해하고, 인덱스를 생성하는 DDL(Data Definition Language) 명령문을 작성할 수 있다. 인덱스 개요 1. 인덱스 개념 인덱스는 데이터를 빠르게 찾을 수 있는 수단으로서, 테이블에 대한 조회 속도를 높여 주 는 자료구조를 일컫는다. 인덱스는 다음 그림과 같이 테이블의 특정 레코드 위치를 알려 주는 용도로 사용하는데, 이러한 인덱스는 자동으로 생성되지 않는다. PK 컬럼은 PK를 생성할 때 자동으로 인덱스가 생성된다. 즉, PK 컬럼은 PK를 생성할 때 자동으로 PK 인덱스가 생성된다. 예를 들어 위의 그림과 같은 테이블에서 일련번호를 기본키(Primary Key)로 하는 경우, 일련번호에 대한 인덱스는 자동으로 생..

DDL 활용 테이블의 구조와 제약 조건을 생성, 삭제하고 수정하는 DDL(Data Definition Language) 명령문을 작성할 수 있다. DDL 개요 1. DDL 대상 DDL(Data Definition Language)은 `데이터를 정의하는 언어'로서, 보다 엄밀하게 말하면 `데이터를 담는 그릇을 정의하는 언어'이며, 이러한 그릇을 DBMS에서는 오브젝트라고 한 다. DDL을 통해 정의할 수 있는 대상, 오브젝트 유형은 다음과 같다. 2. DDL 조작 방법 오브젝트를 생성, 변경 그리고 제거하기 위해 다음과 같은 명령어를 사용한다. DDL 명령어로 분류되지는 않지만 DDL과 같이 사용되는 명령어가 있다. 비상용 제품인 M*SQL의 경우, 생성된 오브젝트의 목록을 조회하기 위해서는 SHOW 명령..

UI 제작 UI화면 제어기능을 어떤 방법으로 할 것인지 선택할 수 있다. 자가 검증을 위하여 단위별 상세 체크리스트를 작성할 수 있다. UI 구현 표준에 따라서 GUI 디자인 가이드를 기반으로 UI를 제작할 수 있다. UI 개발환경 수립 1. UI 디자인 및 퍼블리싱 환경 수립 UI 제작을 위하여 시스템의 목표 및 범위에 따라 그래픽 저작도구 및 퍼블리싱 도구를 PC에 설치하여 이미지로 만들고, HTML 및 CSS로 웹 문서화하는 퍼블리싱을 수행한다. 2. UI 개발환경 수립 제작된 이미지와 퍼블리싱된 파일을 개발하기 위하여 Web 및 App 환경의 엔진 및 통합 개발도구를 설치한다. UI 제작 1. UI 디자인 가이드 숙지 제작될 UI의 공통 규칙(네이밍 규칙, 폰트, 색상 등) 및 리소스 내용(레이아..

UI 저작도구 파악 개발환경에 적합한 저작도구를 파악할 수 있다. UI 개발환경 파악 WEB 개발환경 파악 WEB 애플리케이션 개발을 위해서 구축해야 하는 개발환경을 파악한다. 보통 자바 실행을 위한 JDK(Java Development Kit), 자바와 JSP(Java Server Page) 통합 개발을 위한 Eclipse (자바 개발 프로그램), JSP로 구축된 웹사이트 파일을 실행시켜 주는 엔진 역할의 톰캣 (Tomcat)을 개발 환경에 설치한다. App 개발환경 파악 App이 실행될 운영체제는 대체로 디바이스에 따른 안드로이드와 iOS로 구분된다. 안드로 이드는 구글에 의해 개발되고 배포되는 운영체제이며, iOS는 애플의 스마트기기에 내장되 어 있는 운영체제이다. 스마트기기에서 실행되는 애플리케이..

와이어프레임 작성 기획된 UI/UX 콘셉트에 따라서 화면의 기본 구조를 정의할 수 있다. 사용자 인터페이스 요소의 구성에 따라 모든 화면들을 간략하게 설계할 수 있다. UI 기술과 개발 난이도를 고려하여 요소별 액션을 정의할 수 잇다. 구조도(사이트맵) 구조도 정의 (1) 정보 공간의 형태를 개괄적으로 보여주며, 각각 사이트 개발자와 사용자를 위한 요약 도 기능을 한다. (2) 페이지와 다른 콘텐츠 요소들 간의 관계를 보여주기 때문에 조직화, 내비게이션, 레이 블링 시스템을 표현하는 용도로 사용하는 것이다. 구조도 설계 (1) 상위 레벨 구조도 메인 페이지에서 시작해서 하위 페이지들을 추가하고 단순성을 유지하며 구조에 계속 적으로 살을 붙여 나가며 사용자의 예상 접근 경로뿐 및 조직화 및 콘텐츠 관리에 ..

정보구조 설계 결정된 콘텐츠와 기능에 따라서 정보 구조를 설계할 수 있다. 정보구조 설계에서의 모호성 분류시스템은언어기반위에서성립되는것이며, 언어는하나의단어로여러가지뜻을나 타내는 경우가 많다.‘배’라는 단어도 먹는 배와 타는 배 그리고 사람의 배와 같이 다양한 뜻이 있다. 이와 같이 단어의 모호함은 정보를 분류하는 시스템을 구축하는 데 불안정한 요 소로 작용한다. 홈페이지에서 우리는 정보의 그룹을 설명할 때 대부분의 경우 단어를 사용해 서 표현을 하는데, 이런 언어의 모호함으로 이용자에게 혼돈을 줄 수 있으며 이런 문제들이 홈페이지 전체에서 일어난다면 심각한 문제가 될 수도 있다. 정보를 분류할 때는 이런 모호 성을 충분히 염두에 두고, 되도록이면 이용자들이 한번에 인식을 할 수 있는 직관적인 단어 를 ..

운영체제 설치 및 운용 응용개발을 위하여 선정된 운영체제를 설치하고 운용할 수 있다. 운영체제 선택 및 설치 윈도즈 계열 운영체제 선택 윈도즈 계열 운영체제는 개인용, 기업용, 워크스테이션용으로 출시된다. - Windows Home: 개인 사용자에게 최적화된 운영체제이다. - Windows Pro: 소규모 기업용으로 최적화된 운영체제이다. Pro는 Home에 비해 관리 및 배포, 도메인 가입, 엔터프라이즈 모드, 원격 데스크톱 지원, Hyper V와 같이 향상된 기 능을 제공한다 - Windows Pro for Workstation: 트랜잭션이 몰리거나 복구 기능을 필요로 하는 소규모 기업용 운영체제이다. Pro에 비하여 CPU를 4개까지 동시 지원하여 동시 처리 성능이 뛰어나며 메모리도 6테라바이트까지..

네트워크 계층 구조 파악 네트워크 계층 구조에서 각 층의 역할을 설명할 수 있다. 네트워크 개요 원하는 정보를 원하는 수신자 또는 기기에 정확하게 전송하기 위한 기반 인프라를 네트워 크라고 한다. 정보 전달 시에는 약속한 규칙에 따라야 하는데 이를 프로토콜이라고 한다. WAN(Wide Area Network) 국가, 대륙과 같이 광범위한 지역을 연결하는 네트워크이다. 거리에 제약이 없으나 다양한 경로를 지나 정보가 전달되므로 LAN보다 속도가 느리고 에러율도 높다. 전용 회선 방식 은 통신 사업자가 사전에 계약을 체결한 송신자와 수신자끼리만 데이터를 교환하는 방식 이며, 교환 회선 방식은 공중망을 활용하여 다수의 사용자가 선로를 공유하는 방식이다. (1)회선 교환 방식 물리적 전용선을 활용하여 데이터 전..