분류 전체보기171 HTML Layout 태그 들어가기 전에'레이아웃(Layout)'이란 '배치'라는 뜻으로, HTML 태그로 감싸진 각 정보 요소를 화면상의 어느 위치에 어떻게 자리잡을지 결정하는 것을 말한다. 기본적으로 상단의 , 하단의 그리고 가운데의 본문 영역이 있다. 학습 목표1. 레이아웃(전체 페이지 구성)을 위한 적절한 HTML 태그들을 이해한다. 핵심 개념- HTML layout 태그들 레이아웃을 위한 태그- 레이아웃을 구성하는 태그도 역시 그 의미에 맞춰서 쓴다.· header· section· nav· footer : 제대로 인식을 지원하는 브라우저는 제한적이다. HTML5에서 새로 추가된 태그이기 때문에, 보통 데스크탑 버전에서는 쓰지 않고, 최신 브라우저들이 많은 모바일 환경에서 주로 사용한다.· aside : side 쪽에서 .. 2019. 1. 16. HTML Tags 들어가기 전에HTML 태그는 많은 종류를 가지고 있고 각각의 쓰임새에 대한 정확한 의미가 있다. '각각의 의미를 지닌다'는 것을 'Semantic'한 태그, 혹은 'Semantic하다'라고 표현한다. 그렇기 때문에 많은 태그를 각각의 용도와 쓰임에 맞게 잘 사용해야한다. 이번에는 그 의미에 맞게 사용할 수 있도록, HTML의 중요한 태그에 대해서 알아보자. 학습 목표1. HTML 태그를 이해하고, 이를 사용할 줄 안다. 핵심 개념- HTML tag tag의 종류- HTML 태그는 굉장히 많은 것들이 있다. 태그들은 모두 다 각각의 쓰임새에 대해서 정확한 의미를 가진다.- 태그는 그 의미에 맞춰서 사용해야 한다.· 링크· 이미지· 목록· 제목- anchor 태그, img 태그, ul / li 태그, hea.. 2019. 1. 16. WAS 들어가기 전에 WAS는 무엇이고, 왜 필요한지, 그리고 어떤 종류의 WAS가 있는지 알아보자. 또한, 웹 서버와의 차이점은 무엇인지 알아보자. 학습 목표1. WAS가 무엇인지 알아보자.2. WAS의 종류를 알아보자.3. 웹 서버와 WAS의 차이점을 설명해보자. 핵심 개념- WAS(Web Application Server)- Apache Tomcat 클라이언트/서버 구조- 클라이언트(Client)는 서비스(Service)를 제공하는 서버(Server)에게 정보를 요청하여 응답 받은 결과를 사용한다.· 웹 서버와 웹 클라이언트가 대표적인 서버와 클라이언트의 관계 DBMS(Database Management System)- 다수의 사용자들이 데이터베이스 내의 데이터를 접근할 수 있도록 해주는 소프트웨어· DB.. 2019. 1. 15. 웹 서버 들어가기 전에 웹 브라우저를 실행한 후 주소 입력창에 URL 주소를 입력하면, 그 URL 주소에 해당하는 결과물이 화면에 보인다. 우리가 현실에서 주소를 보고 집을 찾아가는 것 처럼, 웹 브라우저는 URL 주소에 해당하는 웹서버(Web Server)에 연결하고, 해당 주소에서 볼 수 있는 내용을 읽어들여 보여주게 된다. 웹 브라우저의 요청을 받아 HTML 문서나 오브젝트를 반환하는 웹 서버에 대하여 알아보도록 하자. 학습 목표1. 웹 서버의 기능에 대하여 알아보자.2. 웹 서버의 종류에 대하여 알아보자. 핵심 개념- Apache- Nginx- HTTP- 클라이언트(Client)- 서버(Server) 웹 서버란?- 웹 서버는 소프트웨어(software)를 보통 말하지만, 웹 서버 소프트웨어가 동작하는 컴퓨.. 2019. 1. 15. browser에서의 웹 개발 들어가기 전에웹 클라이언트 코드는 브라우저 안에서 동작한다. HTML, CSS, JavaScript의 실제 소스코드를 보면서 웹페이지 소스의 구성을 살펴보자. 학습 목표1. HTML 요청 이후 브라우저에서 해석되는 웹페이지(HTML) 안의 내용구성과 소스코드를 어떻게 위치시키면 될 지 이해한다. 핵심 개념- Browser 안에서 동작할 수 있는 HTML, CSS, JavaScript의 코드 구현 방법 HTML 문서구조- 뜯어보자 웹사이트 !· 크롬 브라우저에서 개발자도구(Ctrl + Shift + i) 열기 : 브라우저에서 직접 코딩하는 것이 아니라 작서한 코드가 잘 동작되는지 확인, 디버깅 - 알게 된 몇가지 특징· HTML 문저는 태그로 시작해서 태그로 끝난다.· 는 무엇을 하는걸까? : HTML 문.. 2019. 1. 15. browser의 동작 들어가기 전에 웹을 통해서 전달되는 데이터는 어딘가에서 해석되어야 한다. 서버에서 전송한 데이터(HTML과 같은)가 클라이언트에 도착해야 할 곳은 'Browser' 이다. Browser에는 데이터를 해석해주는 파서와 데이터를 화면에 표현해주는 렌더링엔진이 포함되어 있다. 이런 작업의 대부분은 브라우저 내부에서 이루어지기 때문에 반드시 알아야하는 것은 아니지만 브라우저의 내부를 이해하면 웹 개발을 하면서 맞닥뜨리는 난해한 문제를 해결할 수 있고, 보다 최적화된 웹개발을 할 수 있다. 학습 목표1. HTML 파일이 올 때 브라우저가 어떻게 렌더링과정을 거쳐서 화면에 보이게 되는지 간단히 이해한다. 핵심 개념- Web Browser Rendering Browser의 동작 1 - 브라우저는 월드와이드웹(WWW).. 2019. 1. 15. 웹 Front-End와 웹 Back-End 들어가기 전에 웹은 프론트엔드(FE)와 백엔드(BE)로 나눠진다. 우리가 인터넷을 하기 위해서 브라우저에서 웹을 탐색하곤 하는데, 이 때 사용자에게 보여지는 브라우저를 프론트엔드 또는 클라이언트라고 한다. 백엔드는 인터넷 사용자에게는 보이지 않는 것이다. 프론트는 물 위에 떠있는 백조의 몸, 백엔드는 물 아래에서 열심히 물갈퀴질을 하고 있는 백조의 발 쯤 학습 목표1. 웹 프론트엔드에 대한 역할과 기술적 구성2. 웹 백엔드에 대한 역할과 기술적 구성 핵심 개념- HTML- CSS- JavaScript- 클라이언트- 서버 웹 프론트엔드사용자에게 웹을 통해 다양한 컨텐츠(=리소스 : 문서, 동영상, 사진 등)을 제공한다. 또한 사용자가 마우스로 클릭하는, 키보드로 작성하는 요청(요구사항)에 반응해서 동작한다.. 2019. 1. 14. 웹의 동작 (HTTP 프로토콜 이해) 들어가기 전에사람과 사람이 전화 통화를 하기 위해서도 몇가지 규약이 필요하다. 서로 알아들을 수 있는 말을 사용해야 하며, 한쪽이 말할때 다른 쪽에서는 들어야한다. 또한, 전화 연결이 끊어지면 더이상 대화를 할 수가 없다. 웹 브라우저와 웹 서버 간에도 서로 통신하기 위해서는 규약이 필요하다. 이때 필요한 규약이 HTTP이다. 학습 목표1. HTTP 프로토콜의 작동 방식에 대해 알아보자.2. HTTP 프로토콜의 요청/응답 데이터 포맷에 대해 알아보자. 핵심 개념- HTTP- Request 형식- Request Method- Response 형식- 응답 코드 인터넷(네트워크 통신)의 이해- 인터넷 != WWW(World Wide Web)· WWW가 인터넷의 전부는 아님· 인터넷 기반의 대표 서비스 중 하나.. 2019. 1. 14. 웹 프로그래밍을 위한 프로그램 언어들 들어가기 전에프로그램을 만들기 위한 프로그래밍 언어의 종류는 굉장히 다양하다. 10년을 주기로 보통 40-50개의 프로그래밍 언어가 탄생하고 있다. '수많은 프로그래밍 언어 중에서 어떤 언어를 선택하여 개발할 것인가?'도 프로그래밍을 처음 배우는 사람에게 많은 고민을 안겨준다. 수많은 프로그래밍 언어 중에서 어떤 언어를 선택하는 것이 좋을까? 학습 목표1. 다양한 프로그래밍 언어의 종류에 대하여 알아보자2. 웹 프로그래밍에 좀 더 최적화된 프로그래밍 언어의 장단점에 대해 알아보자. 핵심 개념- 저급언어- 고급언어- 컴파일러 저급언어저급언어는 기계 중심의 언어라고 말할 수 있다. 기계가 직접 알아들을 수 있는 말로, '프로그램 코드를 작성한다'고 말할 수 있다. 컴퓨터는 전기로 동작한다. 즉, 전기신호인 .. 2019. 1. 14. 이전 1 ··· 16 17 18 19 다음
