2023.04.03 Spring 과 JSP 의 차이점을 알고 싶어, JSP 를 공부하였습니다. 가장 근본인 게시판 프로젝트를 통해, 어떤 차이점이 있는지 확인해보겠습니다. JSP 먼저 한 후, Spring으로 할 예정입니다. 프로토 타입 <!-- 프로젝트 생성 BBS: 게시판을 자주 BBS로 표현함 (톰캣 10 버전 에러로 8.5버전으로 진행) ![](https://velog.velcdn.com/images/ohoh7391/post/f80aa1d8-6615-4875-85b0-2dc43aaa397c/image.png

JSP/서블릿 간단히 연습 2023.04 프로젝트 생성 꼭 메이븐으로 만들어줘야함. archetype-webapp 으로 생성. (Arhetype)버전은 크게 상관없음. porm.xml 여기엔 리포지토리를 넣을 예정. 깃 처음 연동 git init 로컬환경의 저장소에 파일을 올려서 깃허브에 올리겠다는 뜻 git config --global user.name "sjMun09" git config --global user.email "ohoh7391@naver.com" 로컬에 있는 저장소랑 깃허브랑 연결 git remote origin https://github.com/sjMun09/sjMun09-JSP_community.git er

해당 파트에서 쿠키는 먹는 쿠키가 아닙니다! 영어 철자는 똑같습니다 ㅋㅋ.. Cookie의 유래는, (웹입니다. 먹는 쿠키 xxx) 웹 브라우저가 활동하면서 남기는 사용자의 자취들이 마치 먹다 떨어뜨린 과자부스러기(Cookie Crumbles)와 유사한 점에서 비롯한 것이라고 합니다. 웹의 기본 로직 기본적으로 웹에서 클라이언트와 서버가 통신할 때는 HTTP 프로토콜을 이용하여 통신합니다. HTTP 프로토콜의 대표적인 특성 중의 하나는 상태가 유지되지 않는다는 것입니다. 즉, 클라이언트가 서버로 요청을 한 번 하고 서버가 요청에 대한 응답을 하면, 요청한 클라이언트와 응답을 한 서버의 관계는 소멸됩니다. 즉, 상태가 유지되지 않습니다. 따라서, 로그인이라든지 장바구니 기능 등 서버와 클라이언트의 상태가 유지되어야 하는 프로그램을 구현하기가 어렵습니다. 이런 단점을 보강하기 위해 즉, 클라이언트와 서버의 관

서블릿에 대해 자세히 파헤쳐 보도록 하겠습니다. 제가 매일 공부한 곳까지 수시로 업데이트 할 예정입니다. 그래서 내용이 체계적이지 않을 수 있다는점 양해바랍니다. 웹 프로그래밍이란 ? 웹 상에서 사용자와 기업 또는 사용자들 간의 연결을 가능하게 하는 프로그래밍 언어 (사용자에 의해 동적 변화)데이터는 사용자에 의해 계속적으로 변화된다. 클라이언트(client)와 서버(server)로 구축되어있음. 즉, 클라이언트(사용자)가 요청(request, 결과 보여달라고)을 웹 서버에 보내면 응답(response) 형태로 구성됨. (자세한 내용은 http 참고) 동적 데이터 처리 (CGI, ASP, PHP,JSP 등) CGI 응용 프로그램과 웹 서버 사이의 정보를 주고받는 방식이나 규약들을 정해 놓은 것이며, 웹 서버에서 동적인 데이터를 처리해 클라이언트에 HTML 문서로 전송하기 위해 (크게, ASP, PHP,JSP 등) ASP

스프링 스터디 2023 3월 15~18일 // 챕터 6까지 예제 공부 (원래는 4까지나 필자는 뒤처진다 생각하여 조금 더 진행) 주교재 : 스프링 5 프로그래밍 입문 Configuration 해당 클래스를 스프링 설정 클래스로 지정합니다. Bean @Bean 애노테이션을 붙이면 해당 메서드가 생성한 객체를 스프링이 관리하는 빈 객체로 등록합니다. 스프링은 객체를 생성하고 초기화하는 기능을 제공하는데, 스프링이 생성하는 객체를 빈(Bean) 객체라고 합니다. 이 빈 객체에 대한 정보를 담고 있는 메서드가 greeter() 메서드, 이 메서드의 첫 번째 파라미터는 @Bean 메서드 이름인 빈 객체의 이름이며, 두 번째 파라미터는 검색할 빈의 타입입니다. getBean() 메서드 해당하는 빈 객체를 제공 스프링 컨테이너 ApplicationContext(또는 BeanFactory) 등을 스프링 컨테이

2023년 3월 15일, 스터디에서 배웠던 내용을 먼저 포스팅 얕은복사 & 깊은복사 (가끔 배열을 이용한 리스트 문제 풀 때 볼 수 있습니다.) 얕은 복사 : '주소 값'을 복사한다는 의미 간단히 주소 복사. 정리하면, 얕은 복사의 경우 주소 값을 복사하기 때문에, 참조하고 있는 실제값은 같게됩니다. 얕은 복사를 통해 '주소 값'을 변경한다면,참조하고 있는 실제 값은 동일하고, 복사한 객체가 변경된다면 기존의 객체도 변경이 됩니다. -> 주소 값을 통해 변경했기 때문입니다. 깊은 복사 : '실제 값'을 새로운 메모리 공간에 복사하는 것을 의미 간단히 그냥 복사. 깊은 복사를 구현하는 방법은 여러가지가 있으며, 대표적으로 Cloneable 인터페이스 구현, 복사 생성자, 복사 팩터리 등이 있습니다. 깊은 복사는 얕은 복사와는 다르게 Heap 영역에 새로운 메모리 공간을 생성하여 실제 값을 복사하게 됩니다.

스터디를 하면서 스터디원들끼리 대화를 하였으나, 한번쯤은 들어봤으나, 제대로 숙지하지 못했거나, 처음 듣는 용어들을 정리해보았습니다. 프로세스 프로세스란 단순히 실행 중인 프로그램이라고 할 수 있습니다. 즉, 사용자가 작성한 프로그램이 운영체제에 의해 메모리 공간을 할당받아 실행 중인 것을 말합니다. 이러한 프로세스는 프로그램에 사용되는 데이터와 메모리 등의 자원 그리고 스레드로 구성됩니다. 쓰레드 프로세스 내에서 실행되는 흐름의 단위 혹은 CPU 스케줄링의 기본 단위 라고 할 수 있다. 쓰레드는 다음과 같은 특징을 가지고 있다. 쓰레드는 프로세스 내에서 Code, Data, Heap 영역을 공유합니다. 리터럴 리터럴은 데이터(값) 그 자체를 뜻한다. 즉, 변수에 넣는 변하지 않는 데이터를 의미 합니다 참고, 작업할 때, pull 자주 땡기는 습관이 중요함

위치 속성 요소의 고정 위치와 상대 위치 지정 절대 위치,position:absolute left, right, top, bottom 의 프로퍼티 값으로 정하면, 이 값들은 부모(body)태그 안에서의 상태 좌표입니다. 고정 위치, position:fixed left, right, top, bottom 의 프로퍼티 값으로 뷰포트(브라우저 보이는 영역)의 특정 위치에 고정시키는 방식입니다. 정적 위치, position:static 웹 페이지가 작성된 순서대로

시험 & 자격증 & 과제폭탄 으로 인하여 포스팅을 이제야 다시 시작합니다 ! 가시 속성 태그가 화면에 보이는 방식을 지정 display 속성 (보통 태그는 블록(한 행을 다 잡아먹음) 속성을 가집니다) _에 들어오는 속성 1.none : 화면에 보이지않음 (숨김) 2.block : 블록 박스 형식으로 지정 3.inline : 인라인 박스 형식으로 지정 (옆에 내용이 올 수 있게함) => 자주 쓰임 4.inline-block` : 블록과 인라인의 중간 형태로 지정 1) none 키워드 >style 속성 # : id 선택자 . : 클래스 선택자 2) block #box태그의 display 속성을 block 키워드로 바꿈 3) di

웹프로그래밍을 수강중인데, 해당 교과목은 3시간 수업 후 20~30분 이내에 교수님이 띄워주신 것을 만들어 내야하는 수업입니다. (html -> css -> Js) 순의 커리큘럼 1 (원래는 다른 ui이나, 위에 예시는 제가 만든 것임을 참고하여 주시면 감사하겠습니다.) 조건1, 테이블 앞 부분(열)을 클릭(이벤트)시 뒷 열 text input에 입력할 수 있게끔 처리. 조건2, 나중에 db랑 연동할 예정임으로 각각의 저장소(?)를 지정하여라. 조건3, 빈칸 클릭시 색상변경 조건4, 내용 빈칸 란은 작성 크기 크게 작성할 수 있게끔 처리 조건5, box가 table의 테두리와 맞닿지 않게

css 속성 h1 { color : red; } h1 : 선택자 color : 스타일 속성 red : 스타일 값 박스 속성 csss는 각 요소가 박스라는 사각 영역을 생성함 (박스 단위로 움직임) 생성한 영역이나 영역을 둘러싼 테두리에 크기, 색상, 위치 등과 관련한 속성을 지정하여 스타일을 변경함 웹 페이지의 레이아웃을 구성할 때 가장 중요함. 박스 크기와 여백 width 와 height 속성 : 글자를 감싸는 영역의 크기를 지정함 (image 도 해당 태그 사용) border 속성 : 테두리 두께를 지정함 margin : 테두리와 다른 태그의 간격을 지정함 padding : 테두리와 안쪽 여백을 지정함 div 태그로 만든 박스 크기와 패

예제 코드 Tip. (주석 처리한 것을 우선시하여 확인해서 학습해야함) 정말 예제 2 자손선택자 특정 태그의 자손을 선택할 때 사용 형태 설명 선택자 A > 선택자 B 선택자 A의 자손인 선택자B 선택 `` 태그 요소 선택할 대 자손

클래스 선택자 ( .클래스 ) 특정한 클래스가 있는 태그를 선택하여 속성을 지정함 1. 클래스 사용자를 1개 사용하기 Document .select {color: red;} 사과 바나나 오렌지 감

자손 선택자와 후손 선택자 HTML 문서에 CSS3 스타일 시트 만드는 방법 3가지 태그에 스타일 시트 작성 style 속성에 스타일 시트 작성 스타일 시트를 별도 파일로 작성 `` 태그로 불러 사용 (가장 많이 쓰임) CSS 개요 ![](https://velog.velcdn.com/images/ohoh7391/post/2ea59404-2505-49be-a

선택 가능한 입력 양식 1. 한 항목만 선택하기 : `` 태그 사용 목록으로 보여 주는 항목 중 하나 또는 여러 개를 선택할 때 사용 기본적으로 하나만 선택가능 `, ` 태그를 함께 사용 2. 여러 항목 선택하기 : `` 태그의 multiple 속성 사용 3. 선택

필자는 해당 교과목을 제일 안 좋아하였으나, 교수님의 수업 진행 방식이 너무나 마음에 들어 제일 좋아하는 교과목으로 바뀌게 되었습니다. 해당 과목명은 html->css -> Js 까지 학습하는 '웹프로그래밍' 입니다. 처음에 html을 학습할 때만 해도 "어떻게 해?" 라고 하였으나, 백문이불여일타. 치다보니 어느새 교수님께서 말씀하시는 내용이 무엇인지 이해하고, 흥미를 느끼고 있습니다. 해당 과제는 수업 내용을 바탕으로 그날 배웠던 것을 마지막 30분 이내에 전부 다 스스로 풀어 제출해야하는 당일 과제입니다. 이를 저는 '타임어택 과제' 라고 부릅니다. > 해당 언어(기본기?) 를 처음 학습하기 때문에 코드로 구현할 때 보기 불편함을 느끼실 수 있음을 양해 부탁드립니다 ! 더 나은 방법이 있다면 댓글 남겨주시면 참고하여 학습하도록 하겠습니다. 1번 ![](https://velog.velcdn.com/images/ohoh7391/post/690dd863-05fd-4

입력 양식 사용자에게 정보를 입력 받는 요소 입력 양식 개요 `` 태그 : 영역 생성 데이터 전달 방식 `` 태그는 method 속성의 방식으로 action 속성 장소에 데이터 입력 양식 종류 (1) (2) ![](https://velog.velcdn.com/image

테이블 태그 태그 설명 table 표 삽입 tr 표에 행(세로) 삽입 th 표의 제목 셀 생성 td 표의 일반 셀 생성 => 열 생성(몇 칸인지 = 가로) 시간표 만들기 표 만들기 표에 셀 추가하기 <img src="https://velog.velcdn.com/images/ohoh7391/post/3e154ca4-3fce-43e9-aab4-5d0380029dd1/i

HTML 태그 -1 HTML5에서 지원하는 기본 태그 페이지에서는 글자 태그가 비중이 큼 제목과 본문 글자 태그 문서의 제목을 표현할 때 사용 h는 Heading을 의미 본문 글자 입력 시 사용 p : paragraph br : break hr : horizontal rule 예제 3-1 제목 표현 <img src="https://velog.velcdn.com/images/oho

HTML5 기본 용어 태그와 요소 요소 - HTML 페이지를 구성하는 각 부품(제목, 본문, 이미지 등) 태그 - 요소를 만들 때 사용하는 작성 방법 생성 방법에 따른 요소 구분 속성 태그에 추가 정보를 부여할 때 사용하는 것 html 주석 코드 설명 기록 (프로그램 실행에 영향 x) html5 페이지의 구조 ![](https://velog.velcdn.com/images/ohoh739