전체 글 202

[쉽게 배우는 H.C.J] Chapter 3 - HTML 문서 구조 및 주요 태그

1. HTML5 문서 구조■ 시맨틱 태그(sementic tag) : 의미적 태그. 태그명이 표현하는 데이터를 설명※ 페이지 기술 방식 변화□ HTML  : 문서를 좀 더 구조적으로 표현하기 위해 태그로 문서 구조의 각 영역을 구분하였다. 헤더/내용/푸터로 구분하여 가독성을 높이고, 각각 id 속성을 통해 영역을 구분한다.□ CSS : 문서를 표현하는 곳. HTML 태그로 이루어진 웹 페이지에 디자인을 입혀 표현□ JS : 웹 페이지에 필요한 작업 처리나 서버에 웹 페이지 요청을 담당.※ HTML5에 추가된 새로운 태그1) 시맨틱/구조적 태그1. 태그사이트의 소개나 내비게이션 등을 표시2. 태그사이트의 내비게이션(메뉴) 항목을 표시. 주로 에 넣어 표시3. 태그문서의 내용(글)을 표시하는 태그. ..

IT/Frontend 2025.02.24

[쉽게 배우는 H.C.J] Chapter 3 - HTML 개요 및 기본 태그

1. HTML 개요HTML이란?마크업 언어로, 웹 문서를 작성하며 태그를 사용해서 문서의 구조 등을 기술하는 언어.■ 각각의 HTML 태그는 문서 내에서 다른 내용을 기술한다.■ 보통 HTML 태그는 시작 태그와 종료 태그로 둘러싸여 표현되며, 과 같은 단독 태그도 존재한다.■ HTML 문서는 웹 브라우저에서 실행한다. ■ 어느 태그에나 넣을 수 있는 글로벌 속성 종류1. class태그에 적용할 스타일의 이름 지정2. dir내용의 텍스트 방향 지정.3. id태그에 유일한 ID를 부여함. 자바스크립트 제어에서 주로 사용4. style 인라인 스타일 시트를 적용하기 위해 사용ex. 하하하2. HTML 기본 태그-1) 태그 : html 문서에 대한 정보를 써 놓은 곳. 메타 데이터에 해당한다.■ , , , ..

IT/Frontend 2025.02.24

[쉽게 배우는 H.C.J] Chapter 2 - Section 02 클라우드 기반 코드 학습 및 테스트 사이트를 사용한 웹 프로그래밍

■ 이클립스 기반에서 웹 사이트를 구축하려면 자바, 톰캣, 이클립스 순으로 설치할 프로그램이 너무 많아 세팅이 힘들다.>> 클라우드 기반의 코드 학습 및 사이트를 제공하는 사이트를 이용해서 학습할 수도 있음. 1. w3schools.com■ 온라인 웹 프로그래밍 학습 사이트. 여러가지 기능을 제공■ 해당 사이트에서 작성한 코드는 직접 다운로드 불가능하며, 소스코드를 복사해서 다른 툴에서 사용 가능 2. jsbin.com■ 클라이언트 사이드 웹 프로그래밍 코딩 기능 제공.■ 개발 툴 사용이 번거로울 경우 사용■ 코딩과 동시에 결과가 바로 표시되는 구조. 코드를 다운로드 받을 수 있고 라이브러리 추가도 쉽다.

IT/Frontend 2025.02.24

[쉽게 배우는 H.C.J] Chapter 2 - Section 01 자바, 톰캣, 이클립스 기반의 웹 개발 환경

[개발 환경 작성 순서]1. JDK 다운로드, 설치 및 환경 변수 설정JDK : 자바 개발 킷. 자바 기반의 프로젝트 작성 및 이클립스 사용에 필요2. 톰캣 다운로드, 설치 및 환경 변수 설정톰캣 : 웹 컨테이너. [웹 서버 + 웹 어플리케이션 서버(WAS) + 웹 컨테이너]의 기능 포함3. 이클립스 다운로드, 설치 및 실행이클립스 : IDE4. 이클립스에서 웹 애플리케이션 작성웹 애플리케이션 : 웹 기반에서 작동하는 웹 앱 및 모바일 웹 앱 1. JDK 다운로드, 설치 및 환경 변수 설정■ JDK : 자바 기반에서 작성되는 프로그래밍을 실행할 수 있는 환경으로 만들어주는 개발환경 도구■ 오라클 사이트에서 다운로드. ■ 자바 컴파일 명령어(javac)와 실행 명령(java)의 위치를 컴퓨터에게 인식시켜 ..

IT/Frontend 2025.02.24

Session + Application으로 회원가입, 로그인 구현하기

아이디 _____비밀번호 _____ [로그인] [회원가입]로그인 성공 >> 메인 화면으로 이동로그인 실패 >> 로그인 화면에 남아있음++++++++++++++++++++++++++++++++xxx님의 정보 > session※ 가입한 회원들의 정보 >> application Session > 로그인Application > 회원가입 [공부 중 추가로 찾아본 것]1. Login.jsp에서 submit으로 설정된 버튼을 누를 시 페이지를 form action = "Join.jsp"로 보내고 있는데, 회원가입 버튼을 눌렀을 때도 다른 페이지로 보내도록 구현할 수 있는지>> 가능. 자바스크립트로 처리한다. ■ onclick : 버튼 클릭 시 브라우저가 실행할 JS 코드 작성.■ window :..

IT/Backend 2025.02.23

JDBC + MYSQL 연동

[JDBC]※ JDBC란?자바 프로그램 안에서 SQL을 실행하기 위해 데이터베이스를 연결해주는 응용프로그램 인터페이스JDBC는 4파트로 구성된다.1. 드라이버 로드(메모리에 데이터 적재) Class.forName("com.mysql.cj.jdbc.Driver"); // 클래스 이름으로 읽어오기 코드 중복 감소와 함수화를 위해 상단에 먼저 다 나열해놓고 사용하기.static final String driverName = "com.mysql.cj.jdbc.Driver"; 그리고 try문 안에서Class.forName(driverName);로 연결해주면 된다. ■ Class.forName(driverName) 의 뜻: MySQL JDBC 드라이버를 메모리에 로드하는 역할.클래스 이름을 문자열로 전달하면 JV..

IT/JAVA 2025.02.21

JSP

■ JSP : Java Server Pages의 약자.□ Java를 기반으로 하는 서버 측 동적 웹페이지. HTML에 JAVA를 넣어 동적 웹페이지를 작성한다.클라이언트의 요청에 따라 서버가 응답결과를 HTML 문서로 만들어 브라우저로 보여주는 것.Spring 등의 프레임워크와 결합하여 개발 가능하다. JSP가 실행되면 자바 서블릿(Servlet)으로 변환되고, 웹 어플리케이션 서버에서 동작하면서 필요한 기능을 수행한다.참고로, JSP는 서블릿으로 변환 후 사용자에게 HTML 형태의 코드만 전송하고 태그의 내용이 사용자에게 보이지 않는다. □ JSP 와 서블릿 : JSP는 HTML 안에 JAVA가, 서블릿은 JAVA 안에 HTML이. JSP가 편하다.JSP가 서블릿의 단점을 보완한 것. 기본을 HTML으..

IT/JAVA 2025.02.21

[쉽게 배우는 H.C.J] Chapter 1

HTML, CSS, JAVASCRIPT가 무엇인가?■ HTML : 하이퍼텍스트 마크업 언어의 약자로,  "웹 페이지 작성" 시 사용하는 프로그래밍 언어이다.□ , 등의 태그 사용 ■ CSS : 캐스케이딩 스타일시트의 약자. HTML 웹 페이지를 브라우저에 표현하는 방법. "디자인"을 의미 ■ JavaScript : 웹 브라우저에서 동작하는 프로그래밍 언어. "동작 처리"에 사용HTML, CSS, JAVASCRIPT의 활용① 웹 사이트 작성■ 반응형 웹 사이트 : 웹 사이트가 표시되는 화면의 크기에 따라 사이트의 표현 구조가 자동으로 변경되는 웹 페이지② 사물 인터넷 구현라즈베리 파이 컴퓨터③ 게임 작성HTML5 기반 게임④ 인공지능 프로그래밍텐서플로(TensorFlow)

IT/Frontend 2025.02.19

MVC + SQL 프로그램 중 에러 발생

테이블에 저장되어있는 회원으로 로그인 하는데 에러 발생MYSQL로 확인했을 때 테이블에는 있는데...  java.lang.ClassNotFoundException: com.mysql.cj.jdbc.Driver : Class.forName("com.mysql.cj.jdbc.Driver"); 실행 시, JDBC 드라이버를 찾지 못하고 있음 >> BuildPath >> Library >> 외부 라이브러리 추가 >> mysql 드라이버 추가생각해보니 새로운 연습용 프로젝트를 만들면서 외부 라이브러리로 mysql 드라이버를 추가 안해주었던 것이었다..외부 라이브러리 추가해주면서 빠르게 해결!

IT/에러 모음 2025.02.18