Web/JSP국비지원 수업 정리 14

JavaScript Object와 JSON

둘의 구분 1. 자바스크립트 오브젝트(JSO) {name:"John", age:31, city:"New York"} 2. JSON {"name":"John", "age":31, "city":"New York"} 둘의 대표적인 차이는 필드명에 큰따옴표(" ")를 이용하냐 하지 않냐이다. JSON의 선언 및 활용 json은 우리가 한번에 선언할 수 있는 객체가 아니다. 그렇기때문에 일단 JSO로 선언을 해준 후 JSON.stringify를 통해 myJSON 이라는 객체로 선언해주었다. 반대로 우리가 이것을 다시 JSO로 돌려주고 싶을땐 JSON.parse를 사용해주면 된다. 사용할때의 차이 제이슨을 연습해보겟어요~ 눌러봐~ JSON1 눌러봐~ obj1 뭘봐 가장 중대한 차이점으로는 JSO는 각 필드를 불러와..

다른 컴퓨터의 DB에 MYSQL로 원격 접속하기

1. Workbench에서 새로운 연결 추가 2. Workbench에서 새로운 연결 추가 Connection Name : 내 워크벤치에서 어떤 이름으로 저장해둘지 정한다. 나에게만 보이므로 중요하지는 않다. Hostname : 접속하고자 하는 사람의 아이피주소이다. Port : 접속하고자하는 사람이 열어준 포트번호이다. Username : 해당 DB내의 아이디 Password : Store in Valut... 을 눌러 비밀번호를 입력하고 저장한다. Default Schema : 접속하면 붙게될 스키마를 말한다.

<input>의 attribute pattern (유효성 검사)

input의 attribute 중에서 pattern 에 대해 알아보자. pattern은 input을 통해 받는 값의 유효성을 jsp차원에서 1차적으로 검사해준다. 예시들을 미리보자. 이메일 주소: 전화번호(숫자만 허용): 우편번호(숫자 또는 숫자와 하이픈으로 이루어진 5자리 또는 5자리와 4자리): 문법 [ ] : 대괄호에 들어가는 내용은 들어갈 값의 모음을 나타낸다. 항상 패턴의 종류에따라 다르기도 하므로 확인후 사용하자. { } : 중괄호에 들어가는 내용은 여기에선 글자 수를 뜻한다. 이또한 상황마다 의미가 다르니 알아보고 사용하자.

jsp-Session

Session ※정의 request 객체와 비슷한 맥락으로 쓰인다. 자료를 화면에 나타내거나 웹에 저장하는 용도로 쓰인다. 중요한 차이점으로는 정보를 가지고있고, 우리가 만들어 준 후에 일정시간동안 유지가 된다. 그것을 이용해 우리는 로그인여부를 결정하는 페이지를 만들 수 있다. ※시작하기 jsp 파일의 머리부분에 이것을 적어줌으로서 우리는 session을 사용할 것이라 명시한다. ※문법 1.기본객체로 쓰기 getid(), getCreationTime(), getLastAccessedTime() 2.기본객체의 속성을 사용하기 setAttribute(), getAttribute() 3. 세션유효시간확인 session.getLastAccessedTime() ▶xml 파일을 통해서 유효시간을 설정할 수 있다...

Web 수업(servlet )

Servlet servlet의 생명주기 1. 서블릿로딩 : 서블릿컨테이너를 서블릿 클래스에 로드한다. init()을 호출한다. 2. 초기화 init() : 설정값을 초기화하고, DB를 연동한다. 3. 요청처리 : client가 요청할때마다 service 메서드를 호출한다. 요청방식에 따라 호출되는 메서드가 달라진다. 요청을 처리하고 응답을 생성 doGet() : get방식 요청시 호출 doPost() : post방식 요청시 호출 doPut() : put방식 요청시 호출 doDelete() : delete방식 요청시 호출 ※getMethod() 를 통해서 확인하여 사용할 수 있다. 4. 소멸 destory() : DB연갤해제, 리소스 반환 등등.. jsp에서의 java코드 를 통한 호출과 java파일의 c..

Web 수업(JQUERY사용법 / HTML를 쓰는 뼈대 / CSS를 통한 동적 활용)

JQUERY JQUERY란 JQUERY는 가장 대중적으로 알려진 JAVASCRIPT이다. 새로운 언어는 아니기때문에 사용법만 숙지하고 가자 문법 ▶많이 쓰이는 문법우선 정리 0. function의 기입 / element의 생성 $('선택자').(function(){ function의 실행부; }); 1.선택자 (Selectors): $뒤의 공간에 선택자를 선언함으로서 어떤 요소를 건드릴지 언급해주어야한다. 요소 선택자: $('element') - HTML 요소 선택 클래스 선택자: $('.class') - 클래스 이름에 따라 선택 ID 선택자: $('#id') - ID에 따라 선택 2.이벤트 처리 (Event Handling) : 선택자 뒤에 .(온점)을 붙인 뒤에 나오는 형식이며 어떠한 반응을 일으킬지..

Web DB 연동 수업내용(JQUERY-1회차)

데이터 모델링 ※데이터 모델링의 순서 개념적 모델링 > 논리적 모델링 > 물리적 모델링 정보처리기사에서도 자주 나오는 질문이니 확실히 숙지하자 https://aquerytool.com/ AQueryTool AQueryTool은 웹 기반 ERD 툴 + SQL 자동 생성 프로그램입니다. aquerytool.com 해당사이트를 이용하여 테이블 5개 짜리 DB를 먼저 제작했다. MYSQL로 DB구축하기 웹프로젝트는 MYSQL에서 진행하겠다. 1.설치 https://dev.mysql.com/downloads/installer/ MySQL :: Download MySQL Installer Select Operating System: Select Operating System… Microsoft Windows Sel..

Web 6일차 수업내용(javascript이어서 + jquery)

javascript에서 변서 선언방법 4가지 자동인식 var 변수명 let 변수명 const 상수명 예시 추가로 연습하기 javascript에서 객체에 접근하는 방식 ※기본적으로 알아야할 것 1.객체를 찾을때의 문법 상위객체.하위객체 2.window객체는 brower 객체들 중에서 최상위 객체이다. 이것들을 생각해보면 Window.document.form객체.form하위객체 와 같은 모양으로 객체의 호출이 이루어지겠다. 3. 변수의 선언 let formElement = documnet.form; let 뒤에 변수명을 붙여줌으로서 우리가 부르기 편하게 가져온다. External Javascript 파일을 통한 유효성 검사 회원가입 사이트를 개인적으로 다시 단순히 만들어 보았다. 회원가입 창 필드셋을 만들었..

Web 5일차 수업내용(form / input / javascript function / js로 유효성 검사)

input의 element에 따른 attribute들 input의 type에서 file을 고르면 이와 같이 파일을 고를 수 있는 형태의 선택지가 아닌 버튼이 생긴다. ※파일을 받아올때는 꼭 post을 이용해야한다. 이유는 나중에... input의 type에서 email을 고르면 입력을 받을때 유효성을 스스로 검증한다. @이 있는지 없는지 정도만 보는데, 더 자세한 유효성 검사는 우리가 다른 기능을 이용해야한다. input의 type에서 시간과 관련된 것들 input type에서 시간에 관련한 type을 알아보자. 구분좀 해줄게요 date : datetime-local : datetime : month : week : time : 종류로는 date, datetime-local, datetime, month..