1. DB 모델링: 모두 식별관계로 연결 2. 프로젝트 설명 및 시연 3. 마치며 1) 느낀점: 처음 모델링 하는 과정에서 관계 설정을 명확하게 해야 후에 데이터 추가 할 때도 문제가 없다. 여기서 오류 발생한 부분에 대해서 수정하면서 모델링에 대해 이해도를 높일 수 있었다. 2) 협업 과정에서 배운 점: 깃허브를 사용하며 merge 과정에서 오류가 발생 되었던 부분을 수정해보며 충돌 시 해결 과정에 대해 알 수 있었고, 팀원들과 지속적으로 소통을 하면서 새로운 아이디어들을 결합해보며 더욱 더 좋은 아이디어가 양산 되었다. 3) 발전 방향: 자신의 mbti 성향과 잘 맞는 사람들과 게시판을 통해 소통하며 채팅 기능 및 쪽지 기능을 구현하고, history 구현까지 완료해서 기존 검사 이력을 한 눈에 확인..
t-order 프로그램 프로젝트 1. 개발 의도 - 편리한 주문 시스템 구축 및 관리자의 편의성 도모 2. 프로젝트 상세 1] DB 모델링 - 개념적 데이터 모델링 - 논리적 데이터 모델링 2] 기술 설명 - JDBC: Driver loading - Driver loading: Class.forName(“드라이버 이름”); - Connection: Con = DriverManager.getConnection(url, id, pw); - Statement: Stmt = con.createStatement(); - Query: String sql = “select * from member”; - Run: Stmt.executeQuery(sql); 쿼리문을 실행하기 위한 Statement 객체 Connecti..
1. day62-js 카카오 로그인 - google에서 js 쿼리 스트링 값 가져오기 검색 * 예제 - 카카오 로그인 연결 결과 페이지 로그인 창으로 * 카카오, 네이버 등 다른 api 활용해서 가져와보는 연습 해볼 것
1. 자바스크립트 비동기 AJAX - AJAX ( Asynchronous Javascript and XML) 은 웹 페이지의 이동없이 필요한 데이터만 전송하는 기술입니다. 일반적인 경우 데이터 처리는 요청 순서대로 진행하지만 AJAX는 순차적으로 진행하지 않습니다. 이런 방식을 비동기 방식 이라고 합니다. 자바스크립트의 비동기 방식은 상당히 까다로운데, 이를 간단히 사용할 수 있게 해주는 최신 자바스크립트 API인 fetch API를 이용하도록 하겠습니다. - API가 뭔가요? (application programming interface) 우리 기능을 사용 할려면 너는 x1, x2, x3, x4, x5 .... x100을 처리해야해 하지만 너무 어렵고 많은 것을 해야 하잖아? 그럼 우리가 사용 방법을 ..
1. day60-js 이어서 bom 1) location 객체 - 자바스크립트 페이지 이동: location.href = 주소; - 자바스크립트 새로고침: location.reload() * 예제(location 객체) 네이버 이동하기 2) history객체 - history.go(-1); : 기록 이동 - history.back(); : 뒤로가기 - history.replaceState(저장 할 데이터 , 바꿀제목 , 바뀐주소 ); : 새로운 기록 추가(현재의 기록을 지운다거나, 앞에 null값을 변경 하는 데이터 조정을 통해 뒤로 가기 확인이 가능함) - history.state : 페이지 데이터 - history.pushState: 브라우저에 기록을 추가하는 것 여기서 pushState와 repla..
* 실습 1 - 메뉴를 선택할 때마다 밑에 div가 메뉴 이름으로 나오고 애니메이션 추가해줌. 메뉴1 메뉴2 메뉴3 토글메뉴1 토글메뉴2 토글메뉴3 1. DOM - DOM은 문서 객체 모델이라 하며, document객체를 의미합니다. - DOM은 요소(element)의 선택, 삭제 생성 등을 위해 사용합니다. - DOM객체를 이용한 요소의 접근은 자바스크립트의 강력한 기능이며 반드시 외워야 하는 기능입니다. 1) form 객체 - form객체는 document 객체의 하위 객체 중 하나 입니다. - form을 이용하면 form 유효성 검사 등을 할 수 있습니다. - form객체는 document의 하위 객체이므로 유일하게 name속성으로 선택이 가능합니다 ex) document.폼명.요소명 * 예제(fo..
1. 노드의 속성 추가 및 제거 - getAttribute(): 요소의 속성 취득 - setAttribute(): 요소의 속성 저장 - removeAttribute(): 요소의 속성 제거 2. 이벤트 객체(정말 중요함) - 이벤트 발생시 실행되는 함수의 (인자값) 으로 현재 실행되는 event객체를 넣어주게 되어 있다. - stopPropagation(): 이벤트 전파를 막는다. (버블링 중단하기) - target: 이벤트를 적용한 타겟 속성 - currentTarget: 실제 이벤트가 걸려있는 타겟 속성 - preventDefault(): 고유특성을 가진 태그의 이벤트를 제거 * 예제(다중 이벤트, 이벤트 전파) 여러 이벤트를 한번에 걸어주기 1.홍길동 2.홍길자 3.이순신 4.강감찬 5.둘리 선택한 ..
1. 부모 노드, 자식 노드 선택 - children: 모든 자식 노드 선택 - parentElement: 부모노드 선택 - nextElementSibling: 다음 형제 노드 선택 - previousElementSibling: 이전 형제 노드 선택 - firstChild: 첫번째 자식 노드 선택 - lastChild: 마지막 자식 노드 선택 * 예제 이동 번호 이름 내용 날짜 ↓↑ 1 홍길자 안녕! 2019-01-01 ↓↑ 2 이순신 반가워 2019-02-01 ↓↑ 3 이순신 반가워 2019-02-01 ↓↑ 4 이순신 반가워 2019-02-01 ↓ ↑ 5 이순신 반가워 2019-02-01 2. 노드 삭제 - 요소를 생성하는 방법입니다. - remove(): 노드 삭제 - removeChild(삭제 할 ..