본문 바로가기

Programming206

[REACT] 컴포넌트(Components)와 Props [REACT] 코드 살펴보기[REACT] REACT 란REACT리액트는 자바스크립트 라이브러리이다. 구조가 MVC, MVVM과 같은 다른 프레임워크등과는 다르게 오직 View만 처리하는 라이브러리이다.SPA란Single Page Application의 줄임말index.html하hong-study.tistory.comComponents ( 컴포넌트 )위 사진은 리액트의 컴포넌트의 형태로, Tree 구조를 띄고있다.컴포넌트는 함수형, 클래스형으로 총 2가지로 구성되어 있다.함수형function Welcome(props) { return Hello, {props.name};}클래스형class Welcome extends React.Component { render() { return Hello, {t.. 2024. 5. 6.
[REACT] 코드 살펴보기 [REACT] REACT 란REACT리액트는 자바스크립트 라이브러리이다. 구조가 MVC, MVVM과 같은 다른 프레임워크등과는 다르게 오직 View만 처리하는 라이브러리이다.SPA란Single Page Application의 줄임말index.html하나만 로드하고hong-study.tistory.com코드 살펴보기index.jsconst root = ReactDOM.createRoot(document.getElementById('root'));root.render( );React.StricMode : 옛날 기능을 사용할때 경고를 출력하는 기능  root의 render함수는 App컴포넌트를 화면에 그리는 기능 App.jsimport React from 'react';import logo fro.. 2024. 5. 6.
[REACT] REACT 란 REACT리액트는 자바스크립트 라이브러리이다. 구조가 MVC, MVVM과 같은 다른 프레임워크등과는 다르게 오직 View만 처리하는 라이브러리이다.SPA란Single Page Application의 줄임말index.html하나만 로드하고 실행시키는 구조이다.어떻게?번들러(Webpack)가 이 모든것을 해결한다.Webpack이란 어플리케이션을 동작시키는데 필요한 자원(JS파일들, CSS, Image 등)을 하나로 묶어서 조합하여 경량화 하여 결과물을 만들어 주는 도구이다.번들러는 node.JS를 통해 직접 설정 할 수 있지만, 리액트 프로젝트를 생성시 자동으로 포함된다.DOM ( Document Object Model )HTML을 이해하기 쉽도록 트리 구조로 만들어진 태그(객체)들이다. 리액트의 Virtu.. 2024. 5. 6.
[JSP] EL / JSTL [JSP] Connection Pool[JSP] MVC 패턴MVC 패턴MVC (모델-뷰-컨트롤러) 는 사용자 인터페이스, 데이터 및 논리 제어를 구현하는데 널리 사용되는 소프트웨어 디자인 패턴입니다.MVC 패턴은 Model, View, Controller로 구성되어 있hong-study.tistory.comEL ( Expression Language )EL이란 JSP에서 저장객체를 출력할때 스크립팅을 전혀 쓰지 않을 수 있는 기술이다.EL은 일종의 스크립트 언어로 자료 타입, 수치 연산자, 논리 연산자, 비교 연산자 등을 제공하며 표현식을 대체할 수 있 습니다.EL의 내장객체JSTL ( JSP Standard Tag Library )JSP의 경우 HTML태그와 같이 사용되어 전체적인 코드의 가독성이 떨어.. 2024. 5. 6.
[JSP] Connection Pool [JSP] MVC 패턴MVC 패턴MVC (모델-뷰-컨트롤러) 는 사용자 인터페이스, 데이터 및 논리 제어를 구현하는데 널리 사용되는 소프트웨어 디자인 패턴입니다.MVC 패턴은 Model, View, Controller로 구성되어 있다.모델: 데이hong-study.tistory.comConnection Pool ( 연결 풀 )데이터베이스 연결 풀은 데이터에 대한 요청이 발생하면 재사용되는 것으로, 데이터베이스 의 수행 능력을 향상시키기 위해 사용된다.연결 풀에서 하나의 연결이 생성되어 풀에 배치되면 새로운 연결이 만들어지지 않도록 재사용하지만, 만약 모든 연결이 사용 중에 있으면 새로운 연결이 만들어져 풀에 추가된다.연결 풀을 통해 사용자는 데이터베이스 연결을 위해 기다리는 시간을 축소시켜준다. 2024. 5. 6.
[JSP] MVC 패턴 MVC 패턴MVC (모델-뷰-컨트롤러) 는 사용자 인터페이스, 데이터 및 논리 제어를 구현하는데 널리 사용되는 소프트웨어 디자인 패턴입니다.MVC 패턴은 Model, View, Controller로 구성되어 있다.모델: 데이터와 비즈니스 로직을 관리합니다.뷰: 레이아웃과 화면을 처리합니다.컨트롤러: 모델과 뷰로 명령을 전달합니다.Model DAO 클래스 ( Data Access Object )데이터베이스에 접속해서 데이터의 추가, 삭제, 수정 등의 작업을 하는 클래스이다.일반적으로 JSP 혹은 Servlet에서 위의 로직을 함께 기술할 수 있지만, 유지보수 및 코드의 모듈화를 위해 별도의DAO를 만들어 사용한다.보통 한 개의 테이블마다 한 개의 DAO 클래스를 작성한다.DAO 클래스는 테이블로부터 데이터.. 2024. 5. 6.
[JSP] JDBC [JSP] Action Tag, 액션 태그[JSP] 예외 페이지[JSP] 쿠키와 세션 - 세션[JSP] 쿠키와 세션 - 쿠키[JSP] 내장 객체[JSP] GET과 POST[JSP] 태그[JSP] 서버와 클라이언트👨‍💻웹 프로그래밍이란?- 웹 프로그래밍이란, 웹 어플리케이션을hong-study.tistory.comJDBC ( Java Database Connectivity )JDBC는 자바 프로그램에서 SQL문을 실행하여 데이터를 관리하기 위한 JAVA API이다.SQL 문을 실행하는 것엔 다양한 방법이 존재한다.1. MyBatis2. 하이버네이트 JPA 등데이터베이스 연결을 위한 Connection 객체데이터베이스와 JAVA연결DriverManger.getConnection() 메서드를 사용하여 Co.. 2024. 5. 6.
[JSP] Action Tag, 액션 태그 [JSP] 예외 페이지[JSP] 쿠키와 세션 - 세션[JSP] 쿠키와 세션 - 쿠키[JSP] 내장 객체[JSP] GET과 POST[JSP] 태그[JSP] 서버와 클라이언트👨‍💻웹 프로그래밍이란?- 웹 프로그래밍이란, 웹 어플리케이션을 구현하는 행위입hong-study.tistory.com🥷JSP Action TagJSP 페이지 내에서 어떤 동작을 하도록 지시하는 태그이다.종류에는 페이지 이동을 강제하는 forward페이지를 삽입하는 includeforward나 include를 할 때 값을 지정하는 param자바의 클래스와 연동하는 userBean 등이 있다.forward vs SendRedirectforward요청 받은 요청 객체(Request)를 위임하는 컴포넌트에 요청 객체 값을 동일하게 전달 .. 2024. 5. 6.
[JSP] 예외 페이지 [JSP] 쿠키와 세션 - 세션[JSP] 쿠키와 세션 - 쿠키[JSP] 내장 객체[JSP] GET과 POST[JSP] 태그[JSP] 서버와 클라이언트👨‍💻웹 프로그래밍이란?- 웹 프로그래밍이란, 웹 어플리케이션을 구현하는 행위입니다. - 웹 어플리케이션hong-study.tistory.com💻예외 페이지예외 상황이 발생했을 경우웹 컨테이너(톰캣)에서 제공되는 기본적인 예외페이지가 보여진다.개발과정에서는 이러한 예외 페이지를 보고 어떤 에러가 발생했는지 알 수 있다.사용자에게 상용 서비스를 제공하는 도중 해당 페이지가 보여지면 사용자에게 불쾌감을 일으킬 수 있다.코드의 일부가 노출되어 보안 측면에도 좋지 않다.개발자가 따로 만들어 둔 에러 페이지로 유도하여 사용자에게 친숙한 화면을 보여준다.에러 처리.. 2024. 5. 6.
[JSP] 쿠키와 세션 - 세션 [JSP] 쿠키와 세션 - 쿠키[JSP] 내장 객체[JSP] GET과 POST[JSP] 태그[JSP] 서버와 클라이언트👨‍💻웹 프로그래밍이란?- 웹 프로그래밍이란, 웹 어플리케이션을 구현하는 행위입니다. - 웹 어플리케이션이란 웹을 기반으로 작hong-study.tistory.com✨세션세션도 쿠키와 마찬가지로 서버와의 관계를 유지하기 위한 수단이다.쿠키와 달리 클라이언트에서 저장되는 것이 아니라, 서버 상에 객체 형태로 존재한다.서버당 하나의 세션 객체를 가질 수 있다. ( 브라우저 별 서로 다른 세션 사용 가능 )세션 객체는 브라우저 창을 종료하면 삭제된다.세션은 서버에서만 접근이 가능하여 보안이 높고, 저장할 수 있는 데이터에 한계가 없다.▶ 즉, 사용자에 대한 모든 정보를 세션에 담고 동작해도.. 2024. 5. 6.
반응형

티스토리툴바