지금와서 이야기하는거지만 사실 뭔가 프로젝트를 그냥 시작하기엔 좀 어려운 부분이 있었다. 그래서 간단한 프로젝트들이라도 시도해보자고 듣게 된 부스트코스 강의 기획서 부분이 엄청 상세하다고 들었는데, 이런 게 도움이 되지 않을까 한 것도 있다. 백엔드 부분은 따로 정리하진 않았는데, Servlet 말고는 딱히 정리할 게 없어서 나중에 하려고 한다. 나는 딱히 코드 리뷰도 받을 것도 아니기도 하고(애초에 31일인가? 리뷰 서비스 종료한다고 한다.) 그래서 쓰던 IntelliJ, Springboot로 진행했다. 근데 참고로 소스코드는 보여줄 수가 없다. 왜냐면 이렇게 적혀있는걸 무섭게... 그래서 그냥 privated로 올릴까 하다 어차피 연습이니까 블로그만 남겨놓으려 한다. 나중에 조금 프로젝트 주제를 살짝..
1. CSS 기본 스타일 변경 HELLO World! ☺ 2. Element가 배치되는 방법(CSS layout, Rendering) 엘리먼트를 화면에 배치하는 것을 layout 작업이라고도 하고, Rendering 과정이라고도 한다. 부스트코스 강의에서는 편의상 배치라고 하고 있다. 기본 엘리먼트는 위에서 아래로 배치되는 것이 기본이다. 하지만 웹사이트의 배치는 다양하게 표현 가능하고 있다. 이처럼 다양한 방식으로 배치할 수 있도록 CSS에서 다양한 속성을 활용하고 있다. 중요하게 이해해야 할 속성은 다음과 같다. display(block, inline, inline-block) position(static, absolute, relative, fixed) float(left, right) 1) dis..
1. CSS의 구성 1) CSS 선언 방법 span { color : red; } span : selector(선택자) color : property red : value 2) style을 HTML페이지에 적용하는 3가지 방법 1. inline HTML 태그 안에다가 적용, 다른 CSS파일에 적용한 것보다 가장 먼저 적용된다. 2. internal style 태그로 지정, 구조와 스타일이 섞이게 되므로 유지보수가 어렵다. 별도의 CSS파일을 관리하지 않아도 되며 서버에 CSS파일을 부르기 위해 별도의 브라우저가 요청을 보낼 필요가 없다. ... 3. external 외부파일(.css)로 지정하는 방식, CSS 코드가 아주 짧지 않다면 가급적 이 방법으로 구현하는 것이 가장 좋다. 현업에서는 여러개의 CS..
1. HTML tag 태그는 링크, 이미지, 목록, 제목 등 의미에 맞춰 사용해야 한다. 자주 사용되는 태그로는 anchor 태그, img 태그, ul/li 태그, heading 태그, p 태그, div태그 등이 있다. 특히 div 태그는 block 엘리먼트라고 하는데 일반적인 영역을 표현할 때 가장 많이 사용한다. 태그들을 모두 외울 필요는 없으며, 필요한 태그를 찾아서 적절한 의미에 맞는 태그를 사용하는 것이 중요하다. 간단한 태그 실습 코드 반갑습니다. 여기 여러분들이 좋아하는 과일이 있어요. 사과 바나나 메론 귤 결과 2. HTML Layout 태그 HTML 태그로 감싸진 각 정보 요소를 화면 상의 어느 위치에 어떻게 자리 잡을지를 결정하는 것 기본적으로 상단의 Company Name Home H..
0. 부스트코스 시작 전 부스트코스는 직업에 필요한 역량을 향상시킬수 있는 온라인 교육 프로그램이다. 무료 강좌기도 하고, 더 많이 배워보고 싶어서 그 중 '웹프로그래밍(풀스택)' 이라는 강좌를 들어보려고 한다. 링크 : [boostcourse] 웹 프로그래밍(풀스택) 1. browser의 동작 브라우저는 월드와이드웹(WWW)에서 정보를 검색, 표현하고 탐색하기 위한 소프트웨어이다. 인터넷에서 특정 정보로 이동할 수 있는 주소 입력창이 있고, 서버와 HTTP로 정보를 주고 받을 수 있는 네트워크 모듈도 포함하고 있다. 그리고 서버에서 받은 문서(HTML, CSS, Javascript)를 해석하고 실행하여 화면에 표현하기 위한 해석기(Parser)들을 가지고 있다. 아래 그림이 대표적인 내용이다. HTML..
