전체 글 227

[JAVA] JSP 수업 정리

JDBC를 사용한 데이터베이스 연동 1단계 : 드라이버를 드라이버 매니저 클래스에 등록한다. ·Class 클래스의 forName()로 'JDBC 드라이버' 로드한다. (JDBC 드라이버 : 자바 프로그램과 DBMS 사이를 연결 하는 도구) · MySQL용 드라이버를 프로젝트에 설치한다. ( JAVA Build Path 로 설치 ) ( Build Path: 빌드 경로 ) -> 설치 경로 :프로젝트 우클릭 > properties > JAVA Build Path > Libraries 탭 > [Add JARs .. ] 클릭 후 설치완료 · 드라이버 로드 코드를 본문에 작성 : Class.forName("com.mysql.jdbc.Driver"); 2단계 : 드라이버매니저 클래스의 getConnection으로 객..

[JAVA] 로그인 session 예제

session 총 정리 1. 세션은 JSP에서 지원하는 내장객체이다. 내장 객체는 (어떤것을 내장객체라고 하는지) 객체를 생성하는 코드가 필요없다, 객체 생성을 하지 않아도 된다. 사용은 어떻게 ? session. ~ 으로 사용하면 된다. 대표적인 내장 객체는 request. ~ 이다. (요청에 대한 내장객체) - request.getParameter에서 서버에 요청된 것을 처리해준다. - 입력폼에 입력한 name의 값과 같아야 가져올 수 있다. - 가지고 온 후 인증 처리를 위해 각각 변수에 저장을 한다. - 저장한 변수를 memMgr.passCheck에 memberid 변수로 보낸다. - memMgr 는 useBean 액션 태그로 지정해준다. ( ) 끝태그 를 적어줘야 하나 매번 적기 힘들어 생략하고..

[JAVA] 낮은 버전 이클립스 다운로드

이클립스 다운그레이드 (낮은 버전 이클립스 다운로드) eclipse.org 접속 > 최하단 > Other - IDE and Tools 클릭 > [Desktop IDEs] 의 이클립스 버튼 클릭 Other Packages 클릭 > Release(테스트 과정을 거쳐 나옴) > '2019-09' 클릭 > R Pakages (=배포판) > [Eclipse IDE for Enterprise Java Developers] - Windows x86_64 클릭 > 다운로드 * [src/main/java] 파일이 안나올 경우 : 다이나믹웹프로젝트 제대로 생성됐는지 확인하기 webapp 에 JSP 파일 작성 / [src/main/java] 에 JAVA 파일 작성 프로젝트 삭제 : 프로젝트 우클릭 > Delete 클릭 > ..

[리액트] 컴포넌트를 파일로 분리하기

컴포넌트별로 별도의 파일로 정리정돈해서 쪼개보기 먼저 src 디렉터리에 components 라는 디렉터리를 만든다. 생성된 components 디렉터리 안에 컴포넌트별로 정리해보겠다. 우선 TOC 컴포넌트부터 작업한다. P.70 첫번재 코드 참조!! ...생략... import App from './App' ...생략... 위 코드를 보면 C.R.A가 기본적으로 이 App이라는 컴포넌트를 같은 디렉터리에 있는 App.js 라는 파일에서 불러와 보여주는 것을 알 수 있다. 이를 참고해 components 디렉터리로 가서 TOC.js 라는 파일을 생성하고 기존의 App.js 에 있던 TOC 컴포넌트를 복사해 붙여넣는다. + 편집기 기능에 따라 'Component 라는 클래스가 사용되고 있는데 그 클래스를 로..

[리액트] props

어떤 태그를 패키지로 만들어서 인터넷에 올리면 다른 사람들이 내가 정의한 태그를 자신의 앱에 붙여 사용할 수 있다. 3대 빌드 도구 (번들링 도구) - maven - gradle - Ant 빌드 도구의 역할(:묶는 역할)을 VSCode에서는 Web phk (웹 픽)이 한다. 바벨 : 스크립트 태그 JSX를 자바스크립트 코드로 반환시켜준다. node.js 는 웹브라우저가 할 수 없는 기능을 제공한다. 1. 웹 서버의 역할 (Tomcat 없이 가능) 2. 번들링이 잘 되도록 관여하는 역할 App.js 에 를 하나 더 추가하면 똑같은 내용이 두 번 반복한다. 문제는 현재의 Subject 라는 컴포넌트는 언제나 똑같은 결과만 보여줄 수 있다. P.60 두번째 코드 참고! 속성값을 붙인 Subject 컴포넌트이다..

[리액트] 컴포넌트 만들기

컴포넌트 만들기 1 - 순수한 html로 작성한 코드를 리액트로 정리하는 작업 수업.html 과 App.js 코드를 함께 보면서 코딩을 하겠다. 컴포넌트를 만들어 보겠다. App.js 에 보이는 코드가 컴포넌트를 만드는 코드이다. Class App extends Component { render() { return ( Hello, React!! ) } } 객체지향을 이해하는 경우 ' 리액트가 갖고 있는 Component 라는 클래스를 상속해서 새로운 App 클래스를 만든다. 그리고 그 클래스는 render 라는 메서드를 가지고 있다.' 라고 이해하면 된다. 객체지향에 익숙하지 않다면 ' 컴포넌트를 만드는 코드', 일종의 템플릿이라고 생각하면 된다. 수업.html 에서 header 영역을 Subject 라..

[리액트] 컴포넌트 만드는 방법

컴포넌트 만드는 방법 배우기 pulbic 이라는 디렉터리는 Create React App에서 npm run start 명령어로 실행했을 때 파일을 찾는 Document Root 이다 우선 여기에 리액트가 아닌 순수한 HTML 코드를 작성해본다. ' .html' 을 생성하고 다음과 같은 코드를 작성한다. 수업시간에 한 코드 집어넣기 태그의 내용을 다른 곳에 안 보이게 감춰 놓고, 라는 태그로 복잡한 태그의 내용을 대체한다. ( = Component이다.) + 정리하는 글 Header 영역을 라는 컴포넌트로 대체하겠다. 컴포넌트는 첫글자가 대문자이다. // => JSX라고 한다. ⋮

카테고리 없음 2022.12.07

[리액트] 배포하는 법

애플리케이션을 배포(deploy) 하는 방법을 알아본다. 먼저 지금까지 만든 간단한 리액트 앱을 한번 살펴본다. 크롬 개발자 도구(F12) > [Network] 탭 > 상단 새로고침 버튼에 마우스 우측 클릭 > 메뉴 확인 일반적으로는 브라우저는 성능을 높이기 위해 리소스를 내려받아 캐시에 보관해 뒀다가 그 다음에는 같은 리소스를 내려받기 위해 다시 접속하지 않고 앞서 내려받은 리소스를 사용한다. + 캐시 용량을 늘리는 이유 : 속도를 높이기 위해서 ( 캐시가 남아있으면 인터프리터기가 다시 읽지 않아 속도가 향상된다.) 하지만 [캐시 비우기 및 강력새로고침] 버튼을 누르면 캐시를 모두 없애 버린다. 강력 새로고침 한 뒤 [Network] 탭의 하단을 보면 내려받은 리소스의 용량을 볼 수 있다. 리소스의 다..

[리액트] css 코딩하는 법

Create React App에서 생성한 샘플 애플리케이션에서 css 코드를 어떻게 작성하면 되는지 살펴본다. index.js 파일 상단에 보면 index.css 파일을 임포트(import)하고 있음을 확인할 수 있다. import './index.css'; ( ./로 시작하면 해당 파일이 같은 레벨에 위치한다는 뜻.) index.css 파일을 열어 코드를 다음과 같이 수정하면 웹 브라우저에 자동으로 업데이트 된다. + 현 구조에서는 index.css 가 전체에 해당되고, App.css는 커스터마이징 css 라고 생각할 수 있다. body { background-color:powderblue; } index.js 의 상단을 보면 사용자 정의 컴포넌트인 App을 임포트 하는 부분을 볼 수 있다. ⋮ imp..