daniel7481의 개발일지

4) CSS 기본 Style 변경하기 font, background 관련된 속성을 배워보자. font-size로 글크기를 정할 수도 있다. px단위로도 설정할 수 있지만 1em으로 설정 할 수도 있다(1이 아니라 다른 양수도 가능하다). em은 기본값의 몇 배라는 뜻인데, 여기서 기본값은 항상 16이 아닐 수도 있다. 다음 예를 보자 myspan class는 위의 body > div 부모 노드로부터 font-size 32px을 상속받았기 때문에 나오는 값은 32*2인 64px이다. 백그라운드 색은 background-color : 색;으로 설정할 수 있다. font-family 이미 정해진 글꼴(맑음, 굴림 등)으로 설정할 수도 있다. font-family : Gulim;이런식으로 설정하면 된다. 5) ..

1) CSS 선언 방법 선택자, property, value로 구성되어 있다. span(selector(선택자)) { color(property):red(value); } 대개 이런식으로 표현한다. style을 HTML 페이지에 적용하는 세 가지 방법 -inline -internal -external 같은 property에 다른 value를 넣었을 때 위 순서대로 적용이 된다(inline이 제일 우선이다) inline html 태그 안에다가 넣는 방법 구조를 설명하는 코드에 CSS가 들어있으니 구조와 스타일이 섞여 있어서 유지 보수가 어렵고 관리하기가 어렵다 internal head 안에 style을 바로 넣는 방법 장점: 별도의 CSS 파일을 관리하지 않아도 된다. 서버에 CSS 파일을 부르기 위해 별..

마치며 웹 개발의 이해를 마치며 실제 영상 길이는 길지 않았지만 정말 많은 양의 정보를 담고 있었다. 정리가 안된 상태에서 다시 돌아가서 보기도 하고 그랬던 것 같다. 복습하는 겸 중요한 점 몇 가지를 적어보기로 했다. 만약 틀린 개념이 있다면 언제든 지적해주길 바란다. 인터넷 - 네트워크의 네트워크로 각 네트워크는 서로 다른 포트를 차지하는데, 웹은 80번이다. 웹은 인터넷에 속해있다. HTTP: 웹에서 사용하는 프로토콜(규약)으로 클라이언트 서버 모델을 따른다. 대표적인 특징으로 무상태(stateless)가 있으며 서버가 요청에 응답하면 바로 연결을 끊는 특징을 의미한다. 장점으로는 불특정 다수에게 서비스를 제공하는데 유리하지만 단점으로는 클라의 이전상황을 알 수 없기 때문에 Cookie 등의 기능으..

6) 웹서버 웹 서버란? -통산 소프트웨어를 말하지만 소프트웨어가 동작하는 컴퓨터를 말한다. -가장 중요한 기능은 클라(웹 브라우저, 웹 크롤러)가 요청하는 HTML 문서나 각종 리소스를 전달하는 것 -웹 브라우저나 웹 크롤러가 요청하는 리소스는 컴퓨터에 저장되어 있는 정적(static) 데이터(이미지, HTML 파일, CSS 파일, JavaScript파일 같이 컴퓨터에 저장되어 있는 파일)나 동적인 결과(웹 서버에 의해 실행되는 프로그램을 통해서 만들어진 결과물)가 될 수 있음 웹 크롤러: 검색 사이트에서 다른 웹사이트 정보를 읽어갈 때 사용하는 소프트웨어 웹 브라우저와 웹 서버는 보통 HTTP를 통해 통신한다. URL 주소가 HTTP(인터넷 상 데이터를 주고 받기 위한 프로토콜(규약))로 시작되는 이..

5)browser에서의 웹 개발 - 1 크롬에서 amazon.com을 들어가고 개발자 도구(윈도우면 ctrl shift i)를 들어가보자. 네트워크에 들어가고 새로고침을 하면 waterfall이 엄청나게 요동치는게 보이는데, 맨 위에 보면 www.amazon.com 이라는 html 문서가 보인다. 이것이 서버가 보낸 첫 번째 응답이다. response칸을 들어가면 html css javascript 코드가 보이는데 자바 스크립트 코드는 압축이 되어 있다. html코드는 meta, script, 등등의 태그가 보인다. meta 태그는 이 문서가 어떤 것인지 브라우저에 알려주는 것이다. html코드 사이에 CSS와 Javascript코드가 많이 섞여 있다. 살펴보고 깨달은 점: -HTML문서는 html이라는..

3) 웹 Front_End와 웹 Back_End-1 웹 프론트앤드(웹 브라우저) 사용자에게 웹을 통해 다양한 컨텐츠(리소스)를 제공한다. 사용자의 요청에 반응해서 동작한다. 역활 웹 컨테츠를 잘 보여주기 위해 구조를 만들어야 함(신문, 책 같이) 적절한 배치와 일관된 디자인등을 제공해야 함(보기좋게), 사용자 요청을 잘 반영해야 함(소통하듯이) 순서대로 HTML(언어), CSS(디자인), JavaScript(프로그래밍을 할 수 있는 언어)를 이용해서 만든다. 마스터님은 Amazon을 예시로 들며 브라우저를 설명하였다. 4) 웹 Front_End와 Back_End-2 백조를 비유했을 떄, 물 위로 보이는 백조는 프론트엔드고, 밑에서 발길질을 하고 있는 것을 백엔드라고 할 수 있다. 백엔드 개발자는 문제를 ..