KT 에이블스쿨 AIVLE school 4기 AI트랙 14주차 후기

14주차 일정

11/06 IT 인프라

11/07 - 11/08 웹프로그래밍

11/09 - 11/10 WEB/WAS/DB

 

11/06 IT 인프라

몰아쳤던 미프기간이 끝나고 STEP 2 시작!

IT 인프라는 말 그대로 인프라에 관련된 서버, 스토리지, 네트워크, 클라우드, 보안 등등등 모든 것을 배웠습니다.(?) 

난 분명히.. 학교에서 전공 수업 열심히 들었는데.. 왜 이렇게 새로운 내용이지.. 시험지에 소설을 쓰고 나왔나..

한 학기 내용을 하루 만에 다루다 보니 내용이 너무 많아서 어떻게 정리해야 할 지도 잘 모르겠다.. 이걸로 퉁!

 

11/07 - 11/08 웹프로그래밍

웹프로그래밍부터 WEB/WAS/DB까지는 하나의 프로젝트를 가지고 실습을 했다.

먼저, 웹 프로그래밍에서는 프론트엔드 개발을 위한 html/css/javascript를 다루었습니다.

웹 개발 깔짝 대기 시작! 하면 html/css까지는 어떻게 하겠는데 javascript가 은근히 어렵게 느껴지곤 했다.

하지만 javascript도 언어 중의 하나이기 때문에 강사님을 따라서 기초 문법들을 배워보니 오? 은근히 할만한데? 하는 이상한 자만심이 빛났다. 사라져.

 

이번 수업의 최대 수확 1: 간단한 코드로 여러 개의 엘리먼트를 생성할 수 있는 Emmet 기능 

• 하위 레벨 태그 생성 >

<!-- p>span -->
<p><span></span></p>

• 묶음 태그 생성 ()

<!-- (p>span)+(p>span)+(p>span) -->
<p><span></span></p>
<p><span></span></p>
<p><span></span></p>

• 반복 태그 생성 *

<!-- p>span*3 -->
<p><span></span><span></span><span></span></p>
<!-- (p>span)*3 -->
<p><span></span></p>
<p><span></span></p>
<p><span></span></p>

• id, class 태그 생성 # .

<!-- p#data>span.no1 -->
<p id="data"><span class="no1"></span></p>

• 텍스트 태그 생성 {}

<!-- p#data>span.no1{data1} -->
<p id="data"><span class="no1">data1</span></p>

• 부모 element 접근 ^

<!-- p>span^p>span -->
<p><span><span></p>
<p><span><span></p>

 

이번 수업의 최대 수확 2: javascript 문법

• 비교 연산자
  • ==, !=: 데이터만 비교
  • ===, !==: 데이터, 데이터 타입 모두 비교

var data = 1, data2 = '1';
console.log(data1, data2);
console.log(typeof data1, typeof data2); // number string
console.log(data1 == data2, data1 === data2); // true false

• 함수선언식과 함수표현식

// 선언식은 코드의 최상단으로 올라가서 선언됨 
//(호출 -> 선언 순으로 코드를 작성해도 내부적으로는 선언 -> 호출 순: 호이스팅)
console.log(plus1(1, 2));
function plus1(n1, n2) {
    return n1 + n2;
}

// 표현식은 코드가 작성된 순서대로 실행됨 
//(호출 -> 선언 순으로 코드를 작성하면 실행 시 에러 발생)
console.log(plus2(1, 2));
var plus2 = function(n1, n2) {
    return n1 + n2
}

• 익명함수

// 익명함수: 선언과 동시에 호출하는 함수
(function minus2(n1, n2) {
    console.log(n1 - n2);
}(4, 1)); // 선언과 동시에 호출

minus2(5, 1) // 익명함수는 호출할 수 없음

• json 객체
  • 웹 서비스에서 데이터를 주고받을 때 사용하는 포맷
  • 웹 서비스에서는 문자열만 사용 가능
  • 객체 → 문자열: JSON.stringify(data)
  • 문자열 → 객체: JSON.parse(json)

var data = {name: 'andy', addr: 'seoul'};
console.log(typeof data, data); // object

// 객체 > 문자열
var json = JSON.stringify(data);
console.log(typeof json, json); // string

// 문자열 > 객체
var jsonObj = JSON.parse(json);
console.log(typeof jsonObj, jsonObj); // object

• html selecting
  • 아이디: document.getElementById('#id')
  • 클래스: document.getElementByClassName('.class')
  • 셀렉터: document.querySelector('css selector)

<input id='no1' type='text' value='kt aivle 1'>
<input id='no2' type='text' value='kt aivle 2'>
<script>
    var element1 = document.querySelector('#no1');
    var element2 = document.querySelector('#no2');
    console.log(element1.value);  // console 창에 출력
    alert(element2.value);        // alert 창에 출력
</script>

 

11/09 - 11/10 WEB/WAS/DB

이렇게 저렇게 구성한 화면을 실제 웹 서버에서 접근할 수 있도록 뒷받침해 주는 여러 개념들과 지식들을 배웠다.

DB는 학교에서도 정처기에서도 이것저것 주워 먹다 보니 어렵지 않았는데 NoSQL에 대해 자세히 알 수 있었던 것 같아서 새로웠다.

그중 하나인 MongoDB를 파이썬 환경에서 사용할 수 있도록 도와주는 pymongo를 사용해 가볍게 다뤄봤던 것도 재밌었다.

connect server & collection 선택

client = pymongo.MongoClient('mongodb://{username}:{password}@{ip address}')
collection = client.kt.user # client 서버의 > kt이름의 데이터 베이스에 있는 > user 컬렉션

CRUD

• CREATE: collection.insert_many()
• SELETE: collection.find()
  • lt: 미만, lte: 이하
  • gt: 초과, gtd: 이상
• UPDATE: collection.update_many()
• DELETE: collection.delete_many()

# CREATE
result = client.zb.oneroom.insert_many(json_data) # client > zb > oneroom에 추가

# SELECT
documents = collection.find() # collection에 있는 데이터 모두 찾기
documents = collection.find({'deposit': 1000}) # deposit=1000인 데이터 선택

# UPDATE
collection.update_many({'item_id': 38658066}, {'$set': {'deposit': 1500, 'rent': 35}}) # item_id가 38658066인 데이터의 deposit을 1500으로, rent를 35로 변경

# DELETE
collection.delete_many({'deposit': 1500}) # deposit=1500인 데이터 삭제

 

그리고 마지막 날 Flask를 배웠는데 시간 부족으로 인해 조금은 정신없고 알쏭달쏭했던..

그래도 장고를 책 따라 한 번 해봤더니 비슷한 느낌도 들어서 대~충 원리는 이해했는데 직접 하라고 하면 못할 듯^^;;

• Flask 프로젝트의 디렉토리 구성
  • main.py : route 정의
  • static : 정적 파일 저장 : img, pdf, css, js ....
  • templates : html 파일 저장
  • 실제 프로젝트에서도 파일 구성을 동일하게 해야 함

 

 

한 달 동안 웹 잘 배워서 7차 미프랑 빅프 잘 해내야 하는데 잘할 수 있을까?

이거 쓰는 것만 해도 숨이 차는데!!!!!

2차 코마도 시작되어서 수업 복습에 코마에 스터디에 놀기도 해야 되고 이것저것 할 게 많은데.. 전략을 잘 세워봐야겠다..

코마 난이도가 1차 때보다 높아진 것 같아서 너무 코마에 힘을 쓰기보단 내 속도대로 스터디했던 내용들 정리하면서 여유있을 때 코마를 푸는 게 낫지 않을까라는 생각!

맨날 교육장 가다가 집에서 들으려니 집중도 안되는 것 같고 ~~ 힘들다 ~~