웹 개발을 하면서 디자인 적으로 수정할 일이 생깁니다. 정렬을 하거나 글자색을 바꾸거나 할 수 있죠. 이걸 자주 하게 되면 어느 순간 적용이 안된다고 느껴질 때가 있습니다. 문법적인 실수를 하지 않았나 다 체크해보지만 멀쩡해요. 되야만 할 때 안된다면 우리의 잘못이 아닐 수 있습니다. 문제 발생 이유 우리가 사용하는 브라우저는 캐시라는 기능을 지원합니다. 페이지에 다양한 리소스가 있다면 이를 따로 저장해둡니다. 갈 때 마다 로딩을 하면 느리다고 느끼고 우리는 불편함을 느끼죠. 더 빠른 웹을 위해 캐시를 사용하게 됩니다. 여기서 문제가 발생합니다. 나는 현재 css나 js를 수정했는데 브라우저는 예전에 받아둔 파일이 있다면서 새걸로 적용을 안해줍니다. 해결 방법 파일명 변경 가장 간단하게는 파일명 자체를 ..
web
목표 오늘의 운세를 보기 위해 카드를 선택하는 페이지를 만들자. Radio 사용하기 Radio는 여러 항목중에서 단 하나의 값만 선택하도록 합니다. 중요한 점이 있다면 name = "blah" 하면서 모두 같은 값을 넣어주셔야 합니다. name을 따로 지정하지 않으면 각각을 다른 그룹으로 인식해서 중복 선택이 가능합니다. 또한 servlet에서 값을 받아올때도 복잡해지니 name = ""하면서 같은 이름을 지정해주세요. 메이저 타로 카드는 총 22장입니다. 즉 22개의 radio를 만듭니다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 The Fool The Magician The High Priestess The Emp..
안녕하세요!! 제가 만들고 싶은 웹을 만들기에는 아직 배워야 할게 많습니다. 그러나 그걸 다 배우고 프로젝트 진행하려면 중간에 까먹을 수 있고 루즈해져서 재미가 없잖아요. 그래서 그냥 잠깐 쉬는 타임으로 공부용 실습이 아닌 개인 실습을 진행할까 합니다. 여러 분들도 중간중간 복습 차원에서 뭔가를 만들어 보시는 게 어떤지요?? Atom 프로젝트 이클립스로 옮기기 초반에는 제가 Git때문에 Atom에서 진행을 했습니다. 그런데 이미 사용중이던 eclipse에서도 지원하는 걸 알게 됐습니다. 톰캣 설정도 다 되어 있는 상태라서 작성중이던 타로 웹을 옮기기로 결정했어요. 기왕 옮기는 거 html로 작성하던 파일도 jsp로 바꾸려고 합니다. 미래를 위하여 미리미리!! New Dynamic Web Project 를..
드디어 사용자가 입력한 데이터를 받아와서 처리하는 방법에 대해 다룰 시간이 되었습니다. 클라이언트가 서버에 요청하는 방식 중에 하나인 GET 요청을 이용해서 다루려고 합니다. GET 요청이란? GET 방식은 URL(URI)을 이용합니다. 일반적으로 많이 사용되는 방식입니다. http://localhost:8080/hello?cnt=3 이런 방식으로 요청합니다. 나 hello라는 문서에 접근할 거야 대신 cnt에 3이라는 값을 넣어줘~ 하는 거죠. 서버에서는 이 값을 받아와서 무엇인가를 처리하면 됩니다. GET 방식의 특징 GET 요청을 캐시 할 수 있습니다 GET 요청은 브라우저 기록에 남아 있습니다 GET 요청을 북마크 할 수 있습니다 민감한 데이터를 다룰 때 GET 요청을 사용해서는 안됩니다 GET ..
굳이 알아야 할까? Servlet의 LifeCycle... 생명주기라고 해야 하나요?? 개발하는 데 필수로 익혀야 할 내용은 아닙니다. 사용하는 기술에 대한 기본적인 내용을 알면 더 깊은 이해를 통해 양질의 작품을 만들 수 있다고 생각합니다. Servlet의 Life Cycle 서블릿의 전체 생명주기는 javax.servlet.Servlet 인터페이스를 사용하여 서블릿 컨테이너에 의해 관리됩니다. 생명주기는 4단계로 구성됩니다. 서블릿은 init () 메서드를 호출하여 초기화됩니다. 서블릿은 service () 메서드를 호출하여 클라이언트 요청을 처리합니다. 서블릿은 destroy () 메서드를 호출하여 종료됩니다. 마지막으로, 서블릿은 JVM의 가비지 수집기에 의해 가비지 수집됩니다. init() 메서..
지난번에는 Servlet을 이용해 콘솔에 Hello world를 찍어보았습니다. 관련 글 : https://coding-nyan.tistory.com/26 생각을 해보면 System.out.println("Hello World"); 는 콘솔에 출력하는 코드입니다. 웹의 경우에는 서버에서 클라이언트로 값을 전달해서 출력을 해줘야 할 텐데 그렇다면 다른 방식이 필요하지 않을까요?? 웹에 출력하기 웹에 출력하기위해 HttpServletRequest와 HttpServletResponse를 이해하기 쉽게 한 단어로 짚고 넘어갈게요. HttpServletRequest = 입력 도구이고 HttpServletResponse = 출력 도구입니다. 출력을 하기 위해 HttpServletResponse response 객체..
안녕하세요 드디어 백엔드와 관련된 포스팅을 할 차례가 왔습니다. 원래대로라면 HTML과 CSS에도 할 이야기가 더 많고 Javascript까지 하면 분량이 많았을 겁니다. 그러나 저는 백엔드를 위주로 다루고 싶어서 실습용 웹을 만들 정도로만 살펴봤습니다. 서론이 길었네요. Servlet이란? http://www.가상의 주소. com/user를 요청한다고 합시다. 보통 서버에서는 root 혹은 홈 디렉터리 기준으로 해당 문서를 찾아나갈 겁니다. 정적인 문서라면 바로 찾아서 페이지를 response 해주면 되겠죠 그런데 만약 저 user라는 페이지가 항상 고정된 값이 아니라 변동이 된다면 어떡할까요? Server application을 작성해 데이터베이스에서 해당 user와 관련된 테이블을 찾고 뭔가 실행하..
HTML로 페이지의 구조를 다듬었다면 CSS로 꾸밀 수 있습니다. 꾸미기 위한 다양한 옵션들이 존재합니다. 폰트를 바꿀 수 있고, 글자 크기, 배경 색, 기울기 등 창의력만 있다면 여러 가지 구현 가능합니다. 1.CSS 문법 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 body { background-color: gray; } Hello cs CSS는 위의 예시처럼 작성이 가능합니다. 태그로 묶인 그 범위가 CSS입니다. 위의 예시에서 body는 적용할 범위를 나타내는 선택자입니다. 특정 태그 전체에 적용할 때는 특별한 기호 없이 사용 가능합니다. background-color은 속성이고 콜론 뒤에 따라오는 값은 속성 값이라고 칭합니다. 속성은 매우 다양하기에 여기에 전부 담기는 힘듭..
HTML(HyperText Markup Language) 마크업 언어는 대부분 태그를 이용해 구조를 표현합니다. HTML 또한 태그를 활용하는 언어입니다. 수많은 태그 중에서 사람들이 자주 사용하는 태그들만 정리해보겠습니다. , , html의 구조를 이루는 태그들입니다. 로 열고 로 닫는 방식으로 사용합니다. 주로 태그 영역 안에 사용합니다. 해당 문서의 이름을 표시합니다. TEST 을 할 경우 다음처럼 브라우저 탭에 이름이 표시됩니다. meta 태그는 의 형식으로 스스로 닫습니다. 를 자주 사용하는데 해당 문서를 어떤 방식으로 인코딩할지 알려줍니다. 그 외에는 meta라는 이름처럼 metadata를 표시하는데 이용합니다. div는 특별한 기능은 없지만 제일 중요하다고 생각합니다. 제가 원하는 부분만큼 ..
HTML은 웹 페이지를 만들기 위한 가장 기본적인 뼈대를 다듬는 언어입니다 실습하기에 앞서서 준비물이 필요합니다. 웹 브라우저 에디터 사실상 브라우저는 다들 있으실 겁니다. 우리가 무엇인가를 작성하고 그것을 볼 수 있는 화면이 1번에 해당합니다. 그다음으로는 에디터인데 선택이 다양해요. 따로 설치하기 싫으신 분들은 메모장을 이용해서 작업하셔도 괜찮습니다. 에디터 리스트 Notepad++ https://notepad-plus-plus.org/ Notepad++ What is Notepad++ Notepad++ is a free (as in “free speech” and also as in “free beer”) source code editor and Notepad replacement that supp..