2016년 3월 31일 목요일

웹 프로그래밍 3/31 - 7장 CSS 응용과 레이아웃

7장 CSS 응용과 레이아웃


실습


  • 상단 메뉴바는 고정(fixed) 임.
  • 메뉴 아이템의 크기는 100px로 지정하였고, 메뉴 텍스트의 내용이 커지면 ...으로 표시하도록 하였음(메뉴 - 1334... 와 같이)
  • 본문 내용의 가로 길이는 500px, 바탕색은 orange, 그리고 중앙 정렬하였고, padding은 20px을 주었음.



작성자: 시간:
라벨: ,

2016년 3월 29일 화요일

임베디드 OS 3/31 실습 - 크로스 컴파일과 원격 디버깅

크로스 컴파일과 원격 디버깅

이클립스를 이용하여 라즈베리 파이 타겟을 위한 프로그램을 크로스 컴파일하고 원격 디버깅하는 실습

작성자: 시간:
라벨: , ,

Java 3/29 4장 클래스와 객체(객체 배열, 생성자, 오버로딩)

4장 클래스와 객체(객체 배열, 생성자, 오버로딩)

실습

사각형(Rectangle) 클래스 완성하기 - 교재 p.235 실습문제 2번 변형
아래 소스에서 TODO로 되어 있는 부분의 내용을 채워서, main()이 적절히 동작하도록 만드시오. equals(), in(), overlap()은 모두 true를 리턴하게 됨
https://github.com/jyheo/JavaExercise/blob/master/src/classes/Rectangle.java

  • setPoints() - 인자로 받은 x, y 좌표들이 모두 0보다 커야 함
  • getWidth() - 가로 길이(x좌표 이용)
  • getHeight() - 세로 길이(y좌표 이용)
  • getArea() - 면적
  • equals() - 인자로 받은 사각형과 위치와 크기가 동일하면 true리턴
  • in() - 인자로 받은 사각형 내부에 위치한다면 true리턴
  • overlap() -인자로 받은 사각형과 겹치는 부분이 존재한다면 true리턴

이론

https://github.com/jyheo/JavaExercise/blob/master/src/classes/Set.java

  • 객체 배열 -> 정확히는 객체 레퍼런스의 배열
    • Set[] sets = new Set[5];
  • this 레퍼런스
    • 객체 자신을 가리키기 위한 레퍼런스
    • this.array
    • this.size
  • 생성자(Constructor)
    • Set()
    • Set(int[] a)
    • Set(Set s)
    • 생성자에서만 사용 가능한 this()
  • 메소드 오버로딩
    • addElement(int )
    • addElement(int[] )
    • 생성자 3개도 오버로딩임
  • Garbage collection
    • 더이상 참조하는 레퍼런스 변수가 존재하지 않는다면, 즉 어떤 객체를 참조할 방법이 존재하지 않는다면, 쓰레기가 되어 자동으로 처리됨.
    • 자바에서는 new로 만든 객체의 소멸에 대해 신경쓸 필요 없음.

실습2


  • 앞의 예에서 System.arraycopy() 대신에 사용할 적당한 private 메소드를 만들어서 쓰시오.
  • public static Set intersection(Set A, Set B)를 구현하시오.
  • Set(int[]) 생성자의 내용에서 인자로 받은 배열을 그대로 복사하지 말고, 집합 원소 중복되지 않게 검사하면서 추가하도록 고치시오. addElement(int[])를 활용하면 됨


작성자: 시간:
라벨: ,

2016년 3월 27일 일요일

인터넷시스템 3/28 - 2장 Application Layer (Web and HTTP)

2장 Application Layer (Web and HTTP)


2.1 principles of network application

  • Application architecture:
    • clinet-server
    • p2p
  • addressing = IP + port
  • App-layer protocol

2.2 Web and HTTP

  • HTTP overview
  • Non-persistent/Persistent
  • HTTP message
    • request
    • response
  • Cookie
  • Web caching

실습

작성자: 시간:
라벨: ,

웹 프로그래밍 3/29 6장 CSS 속성

6장 CSS 속성


  • 5장에서 배운 CSS 선택자를 이용하여 HTML 요소를 선택하고, 그 선택한 요소에 대해 속성을 부여함
  • 속성에는 여러가지 속성들이 존재하며, 각 속성마다 명목형, 크기, 색, URL 등의 값을 줄 수 있음

속성의 값

  • 명목형(교재에는 키워드 라고 나와 있음): 속성 이름과 콜론을 쓰고 Webstorm에서 Ctrl+Space를 누르면 선택 가능한 값이 나열됨
  • 크기: %, em, px 등
  • 색: 색 이름, rgb(r, g, b), rgba(r, g, b, a), #RRGGBB
  • URL: url('/back.jpg') 

속성 들

  • 박스 속성: margin, border, padding, width, height
  • 박스 테두리 속성: border-width, border-style, border-color, border-radius http://www.cssmatic.com/border-radius
  • 표시 속성: display 
  • 배경 속성: background-image, background-size, background-repeat, background-attachment, background-position, background-color
  • 글자 속성: font-size, font-family, font-style, font-weight, text-align, line-height
  • 위치 속성: position, overflow
  • float 속성: float
  • 그림자 속성: text-shadow, box-shadow http://www.cssmatic.com/box-shadow
  • 그레디언트: css gradient generator http://www.cssmatic.com/gradient-generator

실습


  • 자기소개서 페이지의 항목을 플로팅 박스로 만들기
    .floating-box {
            display: inline-block;
            width: 300px;
            margin: 10px;
            border: 3px solid deepskyblue;
            float: left;
    }

  • 박스에 그림자 적용하기
  • <h1>에 그레디언트 컬러와 둥근 모서리를 적용하고, 글자를 중앙에 위치시키기
  • 특정 박스에 대해 스크롤바 적용하기(height를 지정하고, overflow-y 속성 이용), 아래 예시에는 '허준영' 박스에 대해 적용한 것임
예시)
브라우져 크기에 따라 2열로 표시되기도하고 3열로 표시되기도 함. inline-block의 응용


작성자: 시간:
라벨: ,

임베디드 OS 3/29 - 스레드

스레드


  • 프로세스와 스레드
  • 사용자 수준(User-level) 스레드와 커널 수준(Kernel-level) 스레드
  • 멀티코어와 멀티스레드, 암달(Amdahl)의 법칙

강의 슬라이드:

https://drive.google.com/file/d/0B5tRdB4hr8DfLTNuUVU1Q1NlbDg/view?usp=sharing
작성자: 시간:
라벨: , ,

Java 3/28 4장 클래스와 객체(클래스, 객체 생성)

4장 클래스와 객체


객체지향의 3대 특징 (무조건 일단 외운다)

1. 캡슐화(encapsulation) - 클래스의 속성과 메소드(method), 접근지정자를 통해 실현
2. 상속(inheritance) - 클래스 상속을 통해 실현
3. 다형성(polymorphism) - 메소드 overriding(재정의) overloading(중복)으로 실현

클래스

객체를 정의하기 위한 틀
객체의 속성(상태, 필드, 멤버 변수)과 메소드(멤버 함수, 메시지, 행동, 액션)을 정의함
메소드는 객체의 속성을 변화시킴

예) 구구단 생성기

https://github.com/jyheo/JavaExercise/blob/master/src/classes/MultiplicationTable.java

  • 속성(필드): 
    • number 몇단?
    • max_number 최대 단 
  • 메소드:
    • setNumber() 단을 지정한다.
    • setMaxNumber() 최대 단을 지정한다.
    • printTable() 현재 단을 출력해라.

1. 캡슐화: 구구단 생성기를 사용하는 너는 구구단을 몰라도, 단을 입력하고 출력 명령만 내리면 구구단을 볼 수 있다.
2. 상속: 여기에서는 없음.
3. 다형성: 여기에서는 없음.

실습

구구단 예제를 2단부터 9단까지 출력하도록 고치시오.
단, main() 함수 내용만 수정할 것.
2x2=4
2x3=6
...
9x9=81

작성자: 시간:
라벨: ,

2016년 3월 23일 수요일

웹 프로그래밍 3/24 - 5장 CSS 선택자

5장 CSS 선택자(selector)

CSS 선택자(selector) - 스타일을 지정할 요소를 결정하는 방법
  • 기본 선택자  - 전체, 태그, 아이디, 클래스
  • 속성 선택자
  • 후손/자식 선택자
  • 반응 선택자 - 마우스 커서가 올라가거나 클릭하거나
  • 상태 선택자 - 체크, 포커스, 활성/비활성 여부
  • 구조 선택자 - 나열된 요소들의 첫 번째, 마지막, 반복 위치의 요소

참고: http://www.w3schools.com/cssref/css_selectors.asp

실습

교재의 예제 5-9를 아래와 같이 바꿔보기.
먼저 홀수칸의 배경색은 lightblue, 짝수칸의 배경색은 deepskyblue
그리고 마우스 커서가 홀수칸으로 올라가면 배경색을 black, 글씨 색은 yellow
짝수칸으로 올라갔을 때에는 배경색 black, 글씨 색은 white
힌트:
li:first_child:hover 와 같이 선택자를 사용할 수 있음


작성자: 시간:
라벨: ,

2016년 3월 22일 화요일

Java 3/22 - 3장 반복문과 배열, 예외처리 (2차원 배열, 예외처리)

3장 반복문과 배열, 예외처리 (2차원 배열, 예외처리)

실습

두 int[] 배열의 교집합과 합집합을 구해보자.
두 int[] 배열에 중복 원소는 없다고 가정한다.
실습용 소스:
완성한 소스는 pull request하세요.
(git사용법을 모르는 사람은 다시 fork하세요. 제대로 하려면 원본(upstream)과 sync하는 방법을 사용해야 함)

2차원 배열

int[][] iiArray = new int[2][5];
iiArray.length
iiArray[0].length
iiArray[1].length

2차원 배열은 1차원 배열의 배열임
int[][] iiArray = new int[2][];
iiArray[0] = new int[5]; // iiArray의 첫번째 원소가 1차원 배열
iiArray[1] = new int[3]; // 두번째 원소도 1차원 배열, 크기는 첫번째와 달라도 됨.

main()의 인자

public static void main(String[] args) {
    // args 배열에는 명령    
    for (String s : args)
        System.out.println(s);
}
java.exe Main apple android window 로 실행하면, 아래와 같이 출력됨.
apple
android
window

예외처리(Exception)

try/catch/finally

String[] strArr = new String[5];

try {
    strArr[6] = "hello";
} catch (ArrayIndexOutOfBoundsException e) {
    System.out.println("array index oob exception!");
}

try {
    strArr[6] = "hello";
} catch (Exception e) {
    System.out.println("exception");
}

작성자: 시간:
라벨: ,

2016년 3월 21일 월요일

웹 프로그래밍 3/22 - 5장 CSS 선택자(selector)

5장 CSS 선택자(selector)

CSS는 HTML 문서 내용의 요소들에 모양, 위치와 같은 스타일을 추가하는 방법임.
보통 <style></style> 태그 내에 쓰거나 외부 파일로 연결하여 사용함.

CSS 선택자(selector) - 스타일을 지정할 요소를 결정하는 방법
  • 기본 선택자  - 전체, 태그, 아이디, 클래스
  • 속성 선택자
  • 후손/자식 선택자

참고: http://www.w3schools.com/cssref/css_selectors.asp

실습

교재의 종합예제1 HTML버전에 CSS를 간단히 추가하여 아래와 같이 각 요소들으 위치와 배경색을 변경해보시오.

작성자: 시간:
라벨: ,

2016년 3월 20일 일요일

임베디드 OS 3/22 - 프로세스 기술과 제어

운영체제 프로세스 기술과 제어

  • 프로세스(process)란?
  • 프로세스 상태(state)
  • 프로세스 기술(description) = PCB(Process Control Block)
  • 프로세스 제어
    • 모드 전환(Mode Switch), 커널 모드와 유저 모드
    • 프로세스 전환(Process Switch)
    • 프로세스 생성

강의 슬라이드

https://drive.google.com/file/d/0B5tRdB4hr8DfZ0FFa1pOQVdFdzg/view?usp=sharing
작성자: 시간:
라벨: , ,

2016년 3월 19일 토요일

Java 3/21 - 3장 반복문과 배열, 예외처리(1차원 배열과 for-each)

3장 반복문과 배열, 예외처리(1차원 배열과 for-each)

이론:

  • 1차원 배열과 for-each

실습:

단어 5개를 입력받아서 역순으로 출력하는 프로그램을 작성하시오.
예)
감 배 사과 포도 수박
수박 포도 사과 배 감
작성자: 시간:
라벨: ,

2016년 3월 17일 목요일

웹 프로그래밍 3/17 - 4장 멀티미디어와 입력(form) 태그

4장 멀티미디어와 입력(form) 태그


  • audio, video 태그
  • form, input 태그
  • textarea, fieldset, legend

실습:

아래와 같이 입력(form) 페이지를 만들어 본다.
남여 라디오 버튼과 좋아요 라디오 버튼은 서로 다른 라디오 버튼 그룹임.
'다시' 버튼은 reset이고 '쓰기' 버튼은 submit 임
내용에 있는 textarea의 크기는 5행 80열 임.

작성자: 시간:
라벨: ,

임베디드OS 3/17 실습 - 우분투와 Raspberry Pi 툴체인 설치

우분투와 Raspberry Pi 툴체인 설치





Ubuntu 14.0.4 http://idisk.hansung.ac.kr:8081/api.link/3d_baLoAHb7eROUD_A~~.iso

작성자: 시간:
라벨: , ,

2016년 3월 14일 월요일

Java 3/15 - 3장 반복문과 배열, 예외처리 (반복문, 1차원 배열)

3장 반복문과 배열, 예외처리 (반복문, 1차원 배열)


실습:


  • 가위바위보 게임 완성하기
  • 구구단 출력하기(교재 p.123 예제3-4 그대로 따라하기)
  • 구구단 확장하기(11단부터 19단 만들기)

이론:


  • 반복문, for, while, do-while
  • 1차원 배열, for-each 다음 시간에...
작성자: 시간:
라벨: ,

웹 프로그래밍 3/15 - 3장 HTML 기본태그 (목록, 테이블, 이미지, 공간 분할 태그)

3장 HTML 기본태그 (목록, 테이블, 이미지, 공간 분할 태그)


  • 목록 태그: <ul>, <ol>, <li>
  • 태이블 태그: <table>, <tr>, <th>/<td>
  • 이미지 태그: <img>
  • 공간 분할 태그: <div><span>
  • 시맨틱 태그: header, nav, aside, section, article, footer - [w3school] 

실습: 과목 목록과 시간표 만들기


자세한 내용 보기 »
작성자: 시간:
라벨: ,

임베디드OS 3/15 - 이론: 운영체제 개요

운영체제 개요

  • 운영체제란?
  • 운영체제 발전, 역사
  • 운영체제 요소

강의 슬라이드:

https://drive.google.com/file/d/0B5tRdB4hr8DfRnh6YjVhTk85cHc/view?usp=sharing

작성자: 시간:
라벨: , ,

2016년 3월 12일 토요일

Java 3/14 - 2장. 자바 기본

2장. 자바 기본


실습: 가위바위보 게임

교재 p106 참고

참고 코드:

https://github.com/jyheo/JavaExercise/blob/master/src/basic/KawiBawiBo.java


실습한 내용을 github에 올려서 리뷰 받기

http://jylecture.blogspot.kr/p/java-github.html

작성자: 시간:
라벨: ,

2016년 3월 9일 수요일

웹 프로그래밍 3/10 - 3장 HTML기본 태그 - 3.1 글자 태그

3장 HTML 기본 태그 - 3.1 글자 태그


3.1 글자 태그


  • 제목 글자 태그, h1, h2, h3, ...
  • 본문 태그 p, br, hr
  • 하이퍼링크 태그 <a href="">링크</a>
  • 글자 모양 태그 b, i , small, sub, sup, ins, del

자세한 내용 보기 »
작성자: 시간:
라벨: ,

임베디드OS 3/10 실습: 라즈베리 파이 사용하기

실습: 라즈베리 파이 처음 사용해보기





자세한 내용 보기 »
작성자: 시간:
라벨: , , ,

2016년 3월 8일 화요일

Java 3월 8일 - 2장. Java 기본

2장. Java 기본


실습

수의 개수를 임의로 임력받아 평균을 계산하기. 숫자를 모두 입력한 후에는 엔터와 Ctrl+D로 입력을 종료시켜야 함.

힌트:
Scanner의 nextInt를 좀 더 제대로 써서 실습하기
http://www.tutorialspoint.com/java/util/scanner_nextint.htm
hasNext()와 hasNextInt() 메소드를 활용, while, if문과 함께 사용

while(scanner.hasNext()) {
    scanner.nextInt()
}

이론

연산자
조건 if
switch/case
작성자: 시간:
라벨: ,

웹 프로그래밍 3/8 - 2장 HTML기본 구조와 작성법

2장 HTML기본 구조와 작성법


HTML, CSS, javascript 초간단 예제를 통해 기본 구조와 작성법을 배움.

실습:

다음과 같이 자기 소개서 페이지를 만들어보자. 내용은 자유롭게...


작성자: 시간:
라벨: ,

임베디드OS 3/8 - 임베디드 시스템 개요

임베디드 시스템 개요






  • 임베디드 시스템과 소프트웨어
  • 임베디드 시스템 개발 챌린지
    • 멀티 프로세서
    • 메모리 제약
    • UI
  • 임베디드 시스템 설계 구성
  • 소프트웨어의 비중 증대
  • 재사용 소프트웨어 요소
  • RTOS
  • 개발 단계
  • 단계별 디버거 사용

작성자: 시간:
라벨: ,

2016년 3월 3일 목요일

Java 3월7일 - 2장. Java 기본

2장. Java 기본

교재(명품 자바 프로그래밍) 2장 자바 기본 프로그래밍

강의 내용

  • 자바는 어디에서 프로그램이 시작되는가? 기본적인 구조
    • C언어에서는? main()
  • 자바에서 사용가능한 데이터 타입은? 기본 타입에 대해
    • C언어에서는? int, char, short, unsigned, long, float, double 등
  • 입출력은 어떻게 하는가? System.in/out
    • C언어에서는? printf(), puts(), scanf_s(), gets()
  • 입력을 좀 더 편리하게 하려면? Scanner
    • C언어에서는? scanf_s()

실습:

수 5개를 입력받아서 평균을 계산하는 프로그램을 작성하시오.
예시1)
3 4 5 6 7 (엔터)
5.0
예시2)
3.2 4.3 5.2 6.7 8.8 (엔터)
5.64
작성자: 시간:
라벨: ,

2016년 3월 2일 수요일

2016년 임베디드 OS 강의 소개

2016년 임베디드 OS 강의 소개

무엇을 배우는가?

임베디드OS, 운영체제 이론
- 학사과정 개편으로 운영체제를 듣지 못하였기 때문에 운영체제 이론을 포함하였음
리눅스 커널 내부 이해, 커널 모듈, 디바이스 드라이버 프로그래밍
라즈베리를 이용한 실습(외부 장치 연결, OS포팅)

무엇을 만들 수 있는가?

간단한 센서/엑츄에이터를 연결한 소형 네트워크 임베디드 시스템
이를 기반으로 다양한 임베디드 SW개발 기술 기초를 익힘

강의 교재

운영체제 내부구조 및 설계원리 8판, 윌리엄 스톨링 저, 프로텍 미디어
강의 블로그에 올라오는 슬라이드
참고 교재: 임베디드 소프트웨어의 모든 것, 콜린 월즈 저, 에이콘 출판사

일정

이론(화)실습(목)
03월 01일삼일절 휴강03월 03일강의 소개
03월 08일임베디드 소프트웨어03월 10일라즈비안 설치, 네트워크 설정, 원격 접속, 업데이트
03월 15일운영체제 개요, 프로세스03월 17일개발 환경/리눅스 설치(ArchiLinux), 사용하기
03월 22일스레드03월 24일크로스 컴파일과 디버깅
03월 29일리눅스 커널 프로세스와 스레드03월 31일리눅스 커널 프로세스와 스레드 (이론)
04월 05일병행성: 상호배제와 동기화04월 07일병행성: 상호배제와 동기화 (이론)
04월 12일병행성: 교착상태와 기아04월 14일병행성: 교착상태와 기아 (이론)
04월 19일중간시험04월 21일실습 없음.
04월 26일가상메모리04월 28일GPIO: 버튼과 LED
05월 03일리눅스 커널 가상 메모리05월 05일어린이날 휴강
05월 10일스케줄링05월 12일PWM: servo motor
05월 17일RTOS 스케줄링05월 19일Flask, 웹 서버로 주변 기기 제어
05월 24일입출력 관리05월 26일리눅스 커널 모듈 프로그래밍
05월 31일파일 관리06월 02일리눅스 커널 디바이스 드라이버
06월 07일리눅스 파일 시스템06월 09일리눅스 커널 디바이스 드라이버 ioctl
06월 14일기말시험06월 16일실습 없음.

시험 안내:

중간시험은 4월 19일 예정
기말시험은 6월 14일 예정

강의 평가

출석(10), 중간 시험(30), 기말 시험(30), 과제/실습(30)

실습 도구

VirtualBox, ArchiLInux(or Ubuntu), putty, gcc, notepad++, python 등

작성자: 시간:
라벨: ,

2016년 3월 1일 화요일

2016년 1학기 웹 프로그래밍 강의 소개

2016년 1학기 웹 프로그래밍 강의 소개


무엇을 배우는가?

기본 웹 기술 - HTML, CSS, Javascript,
라이브러리 - jQuery, Bootstrap

무엇을 만들 수 있는가?

Bootstrap 데모 사이트

https://expo.getbootstrap.com/
https://bootstrapbay.com/blog/built-with-bootstrap/

모바일 앱 개발툴 Fuse 사이트

https://www.fusetools.com/examples

강의 교재

HTML5 웹 프로그래밍 입문, 윤인성 저, 한빛아카데미
교재 소스 코드 - http://www.hanbit.co.kr/exam/4027/

온라인 교재 

지준 교수님 강의 자료 - http://jun.hansung.ac.kr/cwp/

온라인 무료 강의:

생활코딩 - https://opentutorials.org/course/1

시험 안내:

중간시험은 4월 19일 예정
기말시험은 6월 14일 예정

강의 평가

출석(10), 중간 시험(30), 기말 시험(30), 과제(30)

실습 도구

webstorm


작성자: 시간:
라벨: ,
피드 구독하기: 글 (Atom)