백엔드 과정

    [JS] 객체

    객체 선언/ 호출 객체는 키 값을 사용하여 속성(멤버 변수) 식별 객체 생성자 혹은 중괄호를 사용하여 객체 생성 ‘[ ](대괄호)’ 또는 ‘.’(점)으로 요소의 값에 접근 속성에 모든 자료형이 올 수 있다. 그 중 함수 자료형인 요소:메소드 객체 내에서 자신의 속성을 호출 할 때 반드시 this키워드를 사용 객체의 모든 속성을 출력하려면 for in문을 사용해야 한다. -> 단순 for문이나 while문으로 출력 불가 -> 식별자로 사용할 수 없는 문자(띄어쓰기, 특수문자)를 속성으로 사용할 경우 ‘ ‘로 묶어서 선언하고, 접근 시에는 [ ]만 가능 객체 선언하는 방법 let 변수명(객체명) = { 속성(키값) : 값, 속성(키값) : 값, 속성(키값) : 값 }; 속성값 접근 변수명(객체명)[‘요소명(..

    [JS] JavaScript 개요

    JavaScript 란? 자바스크립트(JavaScript)는 웹 브라우저에서 많이 사용하는 인터프리터 방식의 객체지향 프로그래밍 언어이다. HTML이 웹 문서의 뼈대 역할, CSS가 그 뼈대를 꾸며주는 역할이라면 자바스크립트는 생동감을 불어넣기 위해 만들어진 프로그래밍 언어이다. 자바스크립트로 작성한 프로그램을 스크립트(script)라고 부르고, 스크립트는 웹 페이지의 HTML안에 작성 가능하며 웹페이지 로드 시 자동으로 실행 된다. 브라우저에는 '자바스크립트 가상 머신'이라 불리는 엔진이 내장되어 있다. JavaScript의 실행 방식 엔진이 스크립트를 읽고 (파싱) 읽어들인 스크립트를 기계어로 전환(컴파일)하면 기게어로 전환 된 코드가 실행된다. 전체를 해석해놓은 컴파일 언어와는 차이가 있다. Jav..

    [CSS] CSS Diner 게임

    [CSS] CSS Diner 게임

    오늘 CSS 수업중에 진행한 게임 CSS select 연습을 할 수 있는 게임 사이트 이다. 은근 재밌었으니 블로그에 남겨둔다 https://flukeout.github.io/ CSS Diner A fun game to help you learn and practice CSS selectors. flukeout.github.io 사이트 내의 게임 화면은 이렇게 나오는데 leval 1 ~ 32 까지 플레이 가능하다. 화면에서 뽀잉뽀잉 하고 움직이는 그릇이나 과일(사과, 피클, 오렌지)을 왼쪽 CSS구문안에 작성해 날려보내는 게임이다. 매 게임의 목차와 오른쪽 화면을 보면 어떤 식으로 작성해야 하는지 힌트가 나온다. 예를 들면 22번 문제에서는 3번째, 5번째 그릇이 움직이는데, Nth-of-type 을 사..

    [HTML] 태그 정리

    [HTML] 태그 정리

    1_글자태그 : 제목을 입력할 때 사용하는 태그 : 제목을 입력할 때 사용하는 태그 h1 태그입니다. h2 태그입니다. h3 태그입니다. h4 태그입니다. h5 태그입니다. h6 태그입니다. : 줄 바꾸면서 수평선 넣는 태그 : 줄 바꿈 태그 : 단락을 구문하는 태그 문단을 나누는 태그 문단 영역을 나누는 태그로는 p태그와 pre태그가 있다. p태그는 문단 영역을 나누는 태그 이지만 한 개의 공백만 표시하며 줄 바꿈 입력을 별도의 태그로 지정해주어야 한다. pre 태그는 여러 칸 띄우기 혹은 줄 바꿈 등을 포함하여 입력한 내용 그대로 표현하는 태그이다. 그 밖의 텍스트를 다루는 태그들 : 글자를 굵게 표시하는 태그 : 글자를 굵게 표시하는 태그 *** 웹 접근성 *** b는 단순한 스타일만 변경..

    [HTML5] 문서 형식 선언 <!DOCTYPE html>

    문서의 형식을 알려주는 태그 HTML5 이전 버전까지는 URL을 포함하여 작성했지만, HTML5에 들어서는 과 같이 간단하게 표기하게 되었다고 함. Html 문서 시작 , 끝을 표시 Lang 속성은 이 페이지가 어느 나라 언어로 되어있는지 표시를 의미 *검색엔진이 페이지 검색 시에 참고 , 검색 사이트에서 특정언어 제외할 때 사용 속성 : lang ex) 속성값 : 설정언어 코드 de en fr ja ko 언어 독일어 영어 프랑스어 일본어 한국어 문서의 각종 정보와 문서 자체에 대한 설명 내용 , , , , 등 사용 화면에 출력해서 보여주는 모든 정보 내용 head 들어가는 태그를 제외하고 모든 태그를 사용 코드 작성내용에 대해 설명하는 곳에 사용하여 브라우저가 이 부분은 해석하지 않고 넘어간다 ! + ..

    [HTML5] HTML 개요

    HTML란? (Hyper Text Markup Langage) 웹에서 정보를 표현할 목적으로 만든 마크 업 언어 웹 페이지를 작성하기 위해 사용되는 언어로 웹 브라우저에게 보일 문자열과 이를 감싸는 일종의 해석기호 인 태그들로 이루어진다. 하이퍼 텍스트? -> 다른 텍스트에 대한 참조("링크")를 가진 텍스트. 시용자가 의도하는 순서에 따라 관련있는 쪽으로 이동하여 정보를 얻도록 조직화된 시스템. 마크 업 (태그) 문서의 논리적인 구조를 정의하고 , 출력장치에 어떠한 형태로 보여질 것인지를 지시하는 역할 문서 내에 삽입되는 일련의 문자 또는 기호 문서의 구조 content 내용 - 문서의 실제 본문 내용 -> 의미적 마크업( 제목, 주소 등) structure 구조 - 문서의 구성 정보(제목, 장, 절 ..

    [JDBC] xml에서 쿼리문 가져와서 수행하기

    성을 입력받아 같은 성을 가진 직원을 조회하는 쿼리를 XML 파일에 작성하여 불러와서 수행하는 방법. 1. XML 파일안에 쿼리문 작성 SELECT E.* FROM EMPLOYEE E WHERE E.EMP_NAME LIKE ? || '%' 2. employee-query.xml에서 쿼리문 가져와서 수행 Connection con = getConnection(); PreparedStatement pstmt = null; ResultSet rset = null; EmployeeDTO row = null; List empList = null; Scanner sc = new Scanner(System.in); System.out.print("조회할 이름의 성을 입력하세요 : "); String empName =..

    [JDBC] 연습문제1. DB테이블에서 같은 성을 가진 사원 정보 조회하기

    문제 EMPLOYEE 테이블에서 조회한 사원의 이름의 성을 입력 받아 해당 성씨를 가진 사원 정보를 모두 출력하세요. (PreparedStatement 객체 사용, List 객체에 담아서 출력) System.out.println(""); Connection con = getConnection(); PreparedStatement pstmt = null; ResultSet rset = null; EmployeeDTO emp = null; List empList = null; Scanner sc = new Scanner(System.in); System.out.print("조회하실 사번을 입력하세요 : "); String empId = sc.nextLine(); String empName = null; St..

    [JDBC] PreparedStatement

    PreparedStatement Connection 클래스의 preparedStatement () 메소드를 사용하여 인스턴스 생성 SQL 질의문을 위치홀더(placeholder)인 ? 로 표현되는 String으로 정의 한다. PreparedStatement 는 위치홀더라는 개념에 해당되는 인수가 많아서 특정 값만 바꾸어 여러 번 실행해야 할 때 사용하면 유용하다. (Statement 는 SQL 문장을 매번 컴파일 하지만 PreparedStatement 는 한번만 컴파일 하므로 실행 속도가 빠름) try { String query = "INSERT INTO MEMBER VALUES(?,?)"; stmt = conn.preparedStatement(query) pstmt.setString (1, id); p..