Plummmm♪

웹이란 무엇일까? WWW (World Wide Web) 이란 말은 다들 들어봤을 거임. 여기서 3번째 W(Web)이 지금 우리가 공부할 Web을 뜻한다. WWW란, 일종의 정보를 공유하는 공간이다. 전세계 모든 시스템들은 네트워크로 연결이 되어있다. 우리는 월드 와이드 웹을 통하여 이 모든 것들을 공유할 수 있다. 웹에 관련된 기술들은 W3C(World Wide Web Consortium)에서 제정한다. (역사나 발전과정 이런 부분들은 설명하지 않겠음.) 그렇다면 Web은 어떤식으로 동작할까? 우리가 늘상 사용하는 웹브라우저의 주소창에 있는 주소를 URL(Uniform Resource Locator) 이라고 하는데, URL의 구조가 Web동작 형태에 맞추어 구성되어 있다. 그림을 보면서 설명하겠음. 인터..

루비 온 레일즈는 웹 서버 개발을 위한 프레임워크이다. 프레임워크.. 이게 정확하게 이건 뭐다 뭐다 정의하기가 애매하다. 그냥 '사용자가 개발할 때 편하게 하기 위해 뼈대를 미리 구축해둔 틀' 정도로 이해하면 된다. Sinatra, Padrino 등의 웹 프레임워크도 있지만 레일즈의 사용비율이 가장 높다. 레일즈의 특징이 몇가지 있는데 알아보자. 1. 개발 속도가 빠른다. 2. 유연성이 높다. (수정이 쉽다.) 3. 비용이 적게든다. 4. 개발 커뮤니티가 활성화 되어 있다. 트위터, github 같은 우리 주변에서 많이 볼 수 있는 웹 사이트들 다수가 루비 온 레일즈로 만들어졌다. 그럼 이제 레일즈의 핵심 요소들에 대해 좀 알아보자. 예전에 JSP를 배우며 스프링 프레임워크를 살짝 맛봤었는데 그때 스프링..

CSS의 기본적인 문법? 이라고 할 수 있는 선택자에 대해 공부해 보겠다. 여러가지 선택자가 있지만 가장 많이 쓰이는 4개만 알아보겠다. 하기 이전에 선택자는 뭔가? 뭘 선택하는 녀석인가. 앞에서 CSS 기본 개념 설명할 때, 중괄호 앞에 * 붙이고 테그 이름붙이고 그랬잖아. "style 속성을 적용할 대상" 이게 선택자이다. CSS는 박스 단위로 선택해서 스타일 적용 시킨다고 저번에 말했다. *은 모든 박스를 다 선택해서 적용시키는 것, 테그를 직접 집어서 스타일을 적용하는 방법 이 두가지는 알았는데, 박스 3개가 나란히 있는데 첫번째, 세번째에만 적용하고 싶으면 어떻게 함? 바로 이것 때문에 선택자에서 몇가지 개념들이 더 등장한다. 표에다 정리를 하고 설명해드리리다. 보세요. 먼저 * (asteris..

이번에는 css 박스 모델에 대해 알아보자. 박스 모델이란게 도대체 무엇일까??? HTML의 대부분의 구성요소들은 모두 박스 형태이다. 저번 포스팅에서 배경색을 바꾸니 박스형태로 설정이 된거.. 봤죠? 이런식으로.. CSS는 이 박스에 대한 이해만 잘해도 반이상 먹고 가는거라고 한다. 위 예제는 아무 설정도 하지 않은 박스다. CSS에서는 이 박스단위로 여러가지 스타일 지정을 한다. 그래서 중요하지. 사진을 담는 액자와 비슷한 개념이라고 생각하면 될 것이다. 그 액자는 크기가 조정도 되고 위치를 옮길 수 도 있다. 테두리를 칠 수도 있고 액자 안에 넣는 그림, 문자 등은 사용자 임의로 자유롭게 설정할 수 있다. w3schools에서 따온 그림을 함 보자. 딱보면 뭔지 느낌이 오지 않는가. Margin :..

CSS란 무엇인가. 클라이언트 사이드 스크립트가 아니어라 Cascading Style Sheet의 약자로, 웹페이지를 꾸미는 녀석이다. HTML과 항상 붙어다니는 실과 바늘같은 존재라고 보면됨. 이녀석이 없으면 그냥 HTML페이지는 허접함 그 자체이다. 뼈만 앙상하게 남은 가시고기 같은.. 거기에 살을 덕지덕지 붙여주는게 CSS다. 여타 우리가 알던 언어들과는 다르게 그냥 코딩된거 보면 더럽다. 그냥 구글 홈에서 페이지 소스보기하면 이렇게 나온다. css덕분에 이런 멀미를 유발하는 소스가 존재하게 되는거임. 그렇다고 우리가 이런식으로 CSS를 코딩하라는건 아님. 기초적인 구조만 알면 디자인하는 툴들이 많으니. 기본적으로 어떤식으로 돌아가는지 정도는 알아야 할거 아닙니까. 더군다나 CSS 이놈은 브라우저마..