대내 활동/웹프로그래밍 상상튜터링
웹 프로그래밍 멘토멘티 프로그램 5회차
웹 서버 우리가 웹사이트에 접속을 하면 홈페이지들이 보이는데 그게 그냥 보이는 것이 아닌 우리 JS, HTML, CSS등을 이용해서 홈페이지를 만든 것 처럼 우리가 접속하는 해당 홈페이지도 각종 웹 파일들이 필요할 건데 그게 우리 컴퓨터에 저장이 되어있다면 괜찮겠지만 그런 것이 아니기 때문에 해당 홈페이지에 필요한 웹 페이지 파일들을 웹 서버라는 곳에 요청을 해서 웹페이지를 보여주게 됩니다. 1. 클라이언트는 서버에 HTML 문서를 요청 2. 웹 서버는 사용자가 요청한 HTML문서를 웹 브라우저에게 전달 3. 웹 브라우저는 웹 서버로부터 전송받은 HTML문서를 읽어들인 후 해석 HTML문서를 보여주기 위해 필요한 img,CSS,JS 같은 리소스들에 대해 URL을 추출하며 동시에 웹 서버에 여러 개의 리소..
웹 프로그래밍 멘토멘티 프로그램 4회차
Javascript Node HTML 문서의 정보는 노드 트리(node tree)라고 불리는 계층적 구조에 저장됩니다. 이러한 노드 트리는 노드들의 집합이며, 노드 간의 관계를 보여줍니다. 노드 트리는 최상위 레벨인 루트 노드(root node)로부터 시작하여, 가장 낮은 레벨인 텍스트 노드까지 뻗어 내려갑니다. 자바스크립트에서는 HTML DOM을 이용하여 노드 트리에 포함된 모든 노드에 접근할 수 있습니다. 노드 간의 관계 노드 트리의 모든 노드는 서로 계층적 관계를 맺고 있습니다. 노드 트리의 가장 상위에는 단 하나의 루트 노드(root node)가 존재합니다. 루트 노드를 제외한 모든 노드는 단 하나의 부모 노드(parent node)만을 가집니다. 모든 요소 노드는 자식 노드(child node)..
웹 프로그래밍 멘토멘티 프로그램 3회차
Javascript (JS) 자바스크립트(JavaScript)는 객체(object) 기반의 스크립트 언어입니다. HTML로는 웹의 내용을 작성하고, CSS로는 웹을 디자인하며, 자바스크립트로는 웹의 동작을 구현할 수 있습니다. 자바스크립트는 주로 웹 브라우저에서 사용되나, Node.js와 같은 프레임워크를 사용하면 서버 측 프로그래밍에서도 사용할 수 있습니다. 현재 컴퓨터나 스마트폰 등에 포함된 대부분의 웹 브라우저에는 자바스크립트 인터프리터가 내장되어 있습니다. 1. 자바스크립트는 HTML의 '내용'을 변경할수 있습니다 2. 자바스크립트는 HTML의 '속성'을 변경할수 있습니다. 3. 자바스크립트는 HTML의 '스타일'을 변경할수 있습니다. Javascript 문법 var firstVar = 10; /..
웹 프로그래밍 멘토멘티 프로그램 2회차
css HTML 등의 마크업 언어로 작성된 문서가 실제로 웹사이트에 표현되는 방법을 정해주는 언어. CSS의 C가 Cascading의 약자인데, 이는 상위 요소의 스타일 속성을 자손 요소들에게 상속시켜주는 모습이 DOM 트리구조에서 마치 폭포수처럼 내려가는 모습을 닮았기 때문이다. 이해못해도 됨 css 문법 h1 { color: red; font-size: 20px } 주석 p { color: red; /* This is a single-line comment */ text-align: center; } /* This is a multi-line comment */ Visual Studio Code 꿀팁 Ctrl + / 누르면 자동주석 됨 Selector CSS 선택자(Selector)란? 선택자란 말 ..
웹 프로그래밍 상상튜터링 프로그램 1회차
계획 1차 8/25 (7~9시) Web Programming, HTML 웹 프로그래밍 과목에 대해서 기본적인 이해와 전반적인 소개를 한다. 전체적인 흐름 알려주고 날짜별 계획을 말해줌으로써 큰 틀을 숙지한다. HTML의 이해와 기본 문법에 대해서 공부를 한다. HTML의 각종 태그들을 이용해서 간단한 홈페이지 만들기 여러 태그들을 사용해보고 태그들에 대한 이해를 한다. Form과 Table을 사용해보고 전반적인 이해를 한다. 2차 9/1 (7~9시) CSS CSS에 대한 기본적인 이해와 기본 문법에 대해서 공부를 한다. HTML과 CSS를 이용해서 홈페이지를 만드는 실습을 해본다. HTML과 CSS를 이용한 간단한 홈페이지 만들기 스타일링을 적용할 수 있는 CSS를 이용해서 홈페이지를 만들어본다. id와..