2Days) 웹개발 기초

nacSeo (낙서)·2022년 10월 25일
0

◉ 학습목표

1. 컴퓨터와 프로그래밍에 관하여 이해하고 설명할 수 있다.
2. 웹 클라이언트와 웹 서버의 차이를 이해하고 설명할 수 있다.
3. 개발 환경을 세팅할 수 있다.
4. Intellij 기본 툴을 이해하고 사용할 수 있다.
  1. 컴퓨터의 이해

⦿ 학습내용

• 컴퓨터 🖥

: 입력받은 데이터를 정해진 규칙대로 처리해서 결과를 저장하고 출력하는 장치

• 컴퓨터의 구성요소 🌟

① 소프트웨어 : 물리적 형태x, 하드웨어를 동작시키는 규정된 명령어들의 집합

☞ 시스템 소프트웨어 (System Software)
: 응용 소프트웨어를 실행하기 위한 플랫폼 역할, 하드웨어와 직접적 소통
ex) 운영체제, 장치드라이버

☞ 응용 소프트웨어 (Application Software)
: 시스템 소프트웨어를 제외한 모든 소프트웨어
ex) 프로그램 (=애플리케이션, 앱)

② 하드웨어 : 컴퓨터를 구성하는 기계적 장치들의 집합

☞ 중앙처리장치 (CPU) : 프로그램 실행, 데이터 처리 담당. 핵심적 역할! 🔥
✔︎ 구성요소
✓ 제어장치 : CPU 모든 동작 및 데이터 통제 및 관리
✓ 연산장치 : 프로그램에 기술되어 있는 명령어 수행, 코드를 실질적으로 실행시키는 장치
✓ 레지스터 : CPU 내 작고 빠른 기억장치 및 연산장치. 필요한 데이터 임시 보관 및 제공

☞ 기억장치 (Memory Device) : 필요한 데이터 장기 or 단기적 보관
✔︎ 장기적 보관 - 보조기억장치 (ex. SSD, HDD)
: 컴퓨터에 필요한 모든 정보를 반영구적 저장. 큰 용량 데이터 저장o / 데이터 읽고 쓰기 느림.
✔︎ 단기적 보관 - 주기억장치 (ex. RAM, ROM)
: 프로그램 수행에 필요한 모든 데이터 저장. 큰 용량 데이터 저장x / 데이터 읽고 쓰기 빠름.
CPU는 연산 속도가 엄청 빠름, 따라서 주기억장치와 직접적 소통
캐시 메모리 : CPU보단 주기억장치 속도가 느려서 미리 불러다 대기시켜두는 역할

☞ 입력장치 (Input Device) : 사용자가 컴퓨터 내부로 데이터를 입력
ex) 키보드, 마우스, 마이크, 트랙 패드

☞ 출력장치 (Output Device) : 컴퓨터가 사용자에게 데이터를 출력
ex) 모니터, 스피커, 프린터

☞ 시스템 버스 (System Bus) : 각 하드웨어 장치 간 통로
✔︎ 데이터 버스 : 데이터 전달 통로
✔︎ 주소 버스 : 데이터가 어디로 도착해야 하는지?
✔︎ 제어 버스 : CPU 내 제어장치가 생성한 제어 신호를 전달

• 컴퓨터의 동작

① 로딩 : CPU 작업을 위해 보조기억장치에서 주기억장치로 프로그램 파일을 옮기는 과정
② 실행중인 프로그램인 프로세스에 출력
③ 입력장치를 통해 동작

  1. 프로그래밍의 이해

⦿ 학습내용

• 프로그래밍

: 프로그램을 만드는 과정, 알고리즘을 프로그래밍 언어를 사용해 코드로 작성하는 과정.

• 프로그램

: 프로그래밍의 결과, 목적 달성을 위한 컴퓨터 명령문의 집합체

• 프로그래밍 언어

: 컴퓨터가 이해할 수 있는 언어(기계어)를 사용하여 컴퓨터 언어(저수준 언어)와 사람 언어(고수준 언어)를 매개해주는 언어.

• 컴파일

: 소스코드를 기계어 코드로 번역하는 과정, 빌드 과정의 일부

• 빌드

: 소스 코드를 실행 가능한 산출물로 변환시키는 과정

• 통합개발환경 (IDE)

: 코드 작성 시 사용하는 프로그램, 프로그래밍에 필요한 모든 작업(코드작성, 편집, 디버깅, 빌드)을 하나의 프로그램 안에서 처리하는 프로그램. (ex. Visual Studio, Intellij, Eclipse)
  1. 웹 클라이언트 vs 웹 서버

⦿ 학습내용

• Client Server Architecture (= 2-Tier Architecture 설계방식)

☞ 리소스가 존재하는 곳(서버)과 사용하는 앱(클라이언트)을 분리시킨 것.
☞ 서버 : 단순히 리소스 전달
☞ 데이터베이스 : 리소스를 저장하는 공간

• 3-Tier Architecture 설계방식

☞ 기존 2-Tier Architecture에 데이터베이스가 추가된 형태.

• 프론트엔드

☞ 클라이언트처럼 사용자가 직접 보고 상호작용하는 앱 개발.
☞ 웹사이트(웹앱), 스마트폰/태블릿용 앱(ex.iOS, Android), 데스크탑 앱(ex.Windows)

• 백엔드

☞ 서버처럼 사용자가 볼 수 없으나 정보 노출, 로그인/아웃, 사용자 인증 등을 다루는 개발.
☞ 웹 서버, 파일 서버, 메일 서버, 데이터베이스 서버

◉ 느낀 점

☞ 처음 컴퓨터공학에 진학했을 당시 배웠던, 잊고 있던 컴퓨터 입문부분들을 리마인드할 수 있는 시간이었다. 그 이후부터 최근 정보처리기사를 취득할 때까지 소프트웨어적인 지식만 신경써왔는데, 뗄려야 뗄 수 없는 하드웨어적인 지식을 외면해왔다는 것을 깨달았다.

'컴퓨터를 정의해봐라.', '소프트웨어, 하드웨어의 구성요소에는 어떤 것들이 있지?', '컴퓨터는 어떻게 동작하는 지 설명해봐라.'라는 질문들이 막상 던져지면 어떻게 말해야할 지 말문부터 막히던 나였는데 덕분에 앞으로 나아가는 길에 있어 조금이라도 더 깊이감이 생긴 것 같아 뜻깊은 시간이었다 :)
또한, 백엔드 개발에 앞서 내가 진짜 하려고 하는 것이 무엇인지 확실히 알았다! 지피지기면 백전불태라고 앞으로 잘 따라갈 수 있는 자신감이 붙는 시간들이었다.

앞서 배웠던 이론들과 더불어 개발 환경을 세팅하고 Intellij와 친해지는 시간을 가졌는데, 그 동안 윈도우와 안드로이드 환경만 사용해왔던 내게 처음 접하는 Mac환경에서의 Intellij는 낯설게만 느껴졌다..😅 앞으로 매일 만나면서 얼른 친해져야지..!

어제, 오늘은 신발끈 묶는 단계고 다음주는 맛보기 느낌으로 협업을 대비하여 프론트엔드에 대해 공부하며 워밍업하는 단계라고 한다! 시작이 반이라고 다음 주까지 잘 준비해 완주할 수 있는 준비를 갖추도록 하겠다.😤

◉ 내일의 키워드

・ HTML
・ CSS
profile
백엔드 개발자 김창하입니다 🙇‍♂️

0개의 댓글