Web Programming
-
웹 브라우저의 뜻 웹 브라우저란 : 사이트에 접속했을 때, HTML, CSS, Javascript 파일을 받아서 이를 번역하여 사용자가 볼 수 있도록 해주는 것. 정적(Static)인 웹페이지 : 서버에서 브라우저에 전송되는 그대로 표시되는 페이지 동적(Dynamic)인 웹페이지 : 서버로부터 데이터를 받아 화면이 실시간으로 내용을 변경하는 페이지 웹 브라우저 통신 방식 - 사용자가 웹 브라우저의 주소창에 URL을 입력한다. - 웹 브라우저는 입력받은 URL을 DNS 서버로 전달하여 해당 IP 주소를 찾게 된다. - DNS 서버는 도메인 이름을 IP 주소로 변환한다. - 웹 브라우저는 해당 IP 주소로 HTTP 요청을 전달한다. - IP 주소에 연결된 웹 서버는 요청(Request)을 받아 처리한다. -..
Node.js 기초 | 웹 브라우저 통신 방식과 원리 | 작동 예시웹 브라우저의 뜻 웹 브라우저란 : 사이트에 접속했을 때, HTML, CSS, Javascript 파일을 받아서 이를 번역하여 사용자가 볼 수 있도록 해주는 것. 정적(Static)인 웹페이지 : 서버에서 브라우저에 전송되는 그대로 표시되는 페이지 동적(Dynamic)인 웹페이지 : 서버로부터 데이터를 받아 화면이 실시간으로 내용을 변경하는 페이지 웹 브라우저 통신 방식 - 사용자가 웹 브라우저의 주소창에 URL을 입력한다. - 웹 브라우저는 입력받은 URL을 DNS 서버로 전달하여 해당 IP 주소를 찾게 된다. - DNS 서버는 도메인 이름을 IP 주소로 변환한다. - 웹 브라우저는 해당 IP 주소로 HTTP 요청을 전달한다. - IP 주소에 연결된 웹 서버는 요청(Request)을 받아 처리한다. -..
2023.08.25 -
이번에 웹 프로그래밍을 공부하며 처음으로 프로젝트를 진행했다. 청창사 중간평가 발표 일정이 겹쳐 바빴지만, 빠르게 집중해 회원가입, 로그인, 로그아웃 기능을 만들어 볼 수 있었다. 그러면 어떻게 진행했나 정리를 해보자. 1. 기획 과정 - 책 리뷰 사이트 항상 기획자의 역할을 해왔기 때문에, 이번에는 다른 관점을 배워보기 위해 아이디어가 있는 팀원을 적극 서포트 하려 노력했다. 와중에 책 리뷰 페이지를 만들고 싶다는 팀원분의 의견으로 책 리뷰 사이트를 만들기로 하였다. 추가적으로 크롤링 혹은 API로 외부 데이터를 조회하여 써보고 싶으시다는 팀원 분이 있으셔서 네이버 도서 API를 활용해 책 정보를 쉽게 작성할 수 있다는 사실을 알려드렸다. 1.1 와이어 프레임 설계 피그마 링크를 공유해드려 다 같이 와..
웹 미니 프로젝트 | 플라스크 | 회원가입, 로그인 구현 JWT 1편이번에 웹 프로그래밍을 공부하며 처음으로 프로젝트를 진행했다. 청창사 중간평가 발표 일정이 겹쳐 바빴지만, 빠르게 집중해 회원가입, 로그인, 로그아웃 기능을 만들어 볼 수 있었다. 그러면 어떻게 진행했나 정리를 해보자. 1. 기획 과정 - 책 리뷰 사이트 항상 기획자의 역할을 해왔기 때문에, 이번에는 다른 관점을 배워보기 위해 아이디어가 있는 팀원을 적극 서포트 하려 노력했다. 와중에 책 리뷰 페이지를 만들고 싶다는 팀원분의 의견으로 책 리뷰 사이트를 만들기로 하였다. 추가적으로 크롤링 혹은 API로 외부 데이터를 조회하여 써보고 싶으시다는 팀원 분이 있으셔서 네이버 도서 API를 활용해 책 정보를 쉽게 작성할 수 있다는 사실을 알려드렸다. 1.1 와이어 프레임 설계 피그마 링크를 공유해드려 다 같이 와..
2023.08.19 -
과제 : 자바스크립트 함수와 조건문을 활용하여 숫자 야구 프로그램 만들기 이번에 자바스크립트 과제로 숫자야구 프로그램 과제를 받았다. 2인 1조로 페어 프로그래밍을 진행했고, 다른 팀원분은 임의로 숫자를 뽑는 로직을 작성하는 역할을 담당하셨고, 나는 함수와 프런트를 담당했다. 챗지피티 디톡스를 하고 실력을 늘리기 위해 최대한 스스로 코드를 작성해보려 하였다. 과제 조건 컴퓨터는 0과 9 사이의 서로 다른 숫자 3개를 무작위로 뽑습니다. (ex) 123, 759 사용자는 컴퓨터가 뽑은 숫자를 맞추기 위해 시도합니다. 컴퓨터는 사용자가 입력한 세자리 숫자에 대해서, 아래의 규칙대로 스트라이크(S)와 볼(B)을 알려줍니다. 숫자의 값과 위치가 모두 일치하면 S 숫자의 값은 일치하지만 위치가 틀렸으면 B 기회는..
웹 프로그래밍 | 숫자야구 프로그램 만들기 | 자바스크립트과제 : 자바스크립트 함수와 조건문을 활용하여 숫자 야구 프로그램 만들기 이번에 자바스크립트 과제로 숫자야구 프로그램 과제를 받았다. 2인 1조로 페어 프로그래밍을 진행했고, 다른 팀원분은 임의로 숫자를 뽑는 로직을 작성하는 역할을 담당하셨고, 나는 함수와 프런트를 담당했다. 챗지피티 디톡스를 하고 실력을 늘리기 위해 최대한 스스로 코드를 작성해보려 하였다. 과제 조건 컴퓨터는 0과 9 사이의 서로 다른 숫자 3개를 무작위로 뽑습니다. (ex) 123, 759 사용자는 컴퓨터가 뽑은 숫자를 맞추기 위해 시도합니다. 컴퓨터는 사용자가 입력한 세자리 숫자에 대해서, 아래의 규칙대로 스트라이크(S)와 볼(B)을 알려줍니다. 숫자의 값과 위치가 모두 일치하면 S 숫자의 값은 일치하지만 위치가 틀렸으면 B 기회는..
2023.08.16