웹개발

웹 서비스! 클라이언트가 서버에 요청을 하면 서버에서 요청에 맞게 응답(제공)을 하는 것

클라이언트 = 서비스이용자( + 브라우저)
웹서버 = 컴퓨터

(튜터님의 명강의 ppt발췌)

헷갈리는 용어가 있다면 바로 사전을 찾아서 해석하고 가기!!

프로젝트 파악하기

logging

로깅을(파이썬에선 print. JS에선 console.log)통해 해당 프로젝트의 기술들을 습득할 수 있어야 한다.

python의 venv

venv는 가상의 컴퓨터 셋팅을 만들어 놓은 것. 파이썬의 환경이 계속해서 변하기 때문에 필요.

서버 만들기

내가 가진 컴퓨터로도 서버를 만들 수 있다.(서버 = 컴퓨터) 여기서 내 컴퓨터를 지칭하는게 '로컬 호스트'라고 한다. // (로컬 호스트의 고정된 아이피 127.0.0.1)
이 컴퓨터가 인터넷에 연결되어 있다면 서버가 될 수 있다.
내 컴퓨터(localhost)의 여러가지 프로그램이 있다. 이 프로그램중 하나가 app.py(이번 강의에서 flask를 이용한 웹페이지를 예시로 사용)인데 구동 전에는 연결이 되지 않는다.

연결된 모습

running 중인 것이 서버가 구동이 됐으며, 요청을 기다리고 있는 것이다.

route

클라이언트에게 요청이 들어오면 어디로 가게끔 정해 주는것.

첫번째 route의 경우 지정된 경로('/')가 없기 때문에 home에 머물게 됨

• def는 return값을 받기위한 장치!
  -> 'home'을 실행했을때 reder(제공)_template(템플릿) 템플릿('index.html')을 제공하는 것

port

'5000'이 port.
컴퓨터(서버)는 인터넷에 연결되어 있고 많은 사람들이 인터넷을 통해 정보를 접근할 수 있다.
이를 방지하기 위해 모든 연결을 막아놓고 허용한 곳으로만 접속 할 수 있게 해주는 것이다.
port번호로 허용한 곳으로 접속을 하면 그 곳의 process를 따른다.(port 번호는 process 식별자)
이게 맞는지...? 가벼운 마음으로 보고 검색했다가 너무 깊게 들어가는 기분이 드네요

log

log = 일지
프로그램이 제대로 작동하고 있는지 터미널에서 확인!!

터미널 명령어

터미널 명령어는 자주쓰이는 것은 외우는 것이 좋음.(깃 벨로그 확인)

• ls - 현재폴더 리스트
• pwd - 경로
• cd - 폴더 이동('cd ..' 상위폴더로 이동)
• touch - 파일 생성
• clear - log 지우기(터미널 창의 텍스트 지우기)

GET,POST

• GET : 파라미터 노출
• POST : 파라미터 노출x
  parameter(매개 변수) : 웹상의 정보를 담아 서버로 보낼 때 담는 정보를 말함 (ex: 로그인시 ID PW 입력한 정보)

  GET POST는 parameter를 주고 받는 행위!!

  GET: 파라미터 노출하기때문에 렌더링 정도만 이용
  ex) 127.0.0.1:5000/id='kng',password='testpw' => 파라미터 노출되니 사용하면 안됌

  POST: 파라미터 노출X DB통신에 쓰임!

비동기

동기 시스템 : 여러가지 요청이 들어왔을때 하나씩 해결!
비동기 시스템 : 여러가지 요청이 들어왔을때 각각을 따로 해결!
ex) 웹서비스에서 요청했을때(베너를 눌렀을 때) 시간이 걸리는 동작이라면 실행하기까지 동기 시스템은 멈춰버리지만, 비동기 시스템은 실행중에도 계속해서 웹서비스가 동작중임!
비동기 방식 : 요청이 올 때까지 기다리지 않고 동작중 -> 쾌적한 UX(사용자 경험)

• 비동기 방식의 좋은 예시 : skeleton ui

---

프론트엔드에 대해서 근본적인 개념들과 기본을 알 수 있는 유익한 시간이었고,
프로젝트를 통해 설명해 주시니 구동되는 원리도 한번 더 알 수 있었습니다.
생각보다 단어들이 직관적이어서 단어의 뜻만 알더라도 어느정도 진행방향을 알 수 있다는 것을 알았습니다. GET/POST 부분은 받고, 보내고의 간단한 수준으로 이해했었는데, 웹개발 강의를 통해 원리를 좀 더 파악해야겠다고 생각이 드네요...