※ React 특징 뷰(View)만 신경쓰는 프레임워크이다. 사용자 인터페이스만 신경 쓰는 라이브러리이기 때문에 라우팅, 네트워킹은 별도 라이브러리를 이용해야 한다. 사용자 인터페이스를 컴포넌트화(실행가능한 독립적인 객체)시킴으로서 재사용성이 증가된다. 전체 DOM을 변경하지 않고 이전 DOM과 차이가 나는 부분만 업데이트 한다. 지속적으로 데이터가 변화하는 대규모 애플리케이션에 유리하다. -> SPA 특징 CSR(Client Side Rendering, SPA)로 동작하는 것이 기본이다. (검색 엔진 최적화 불가능) SSR(Server Side Rendering, MPA)로 동작하도록 구성될 수 있다. (Next.js는 SSR 방식) React 프로젝트를 개발하는데 필요한 도구들이 Node.js를 사용..
※ 랜더링 위치에 따른 애플리케이션 분류 (SSR vs CSR) 1. 서버 사이드 렌더링(SSR) - Multi Page Application(MPA) ▶ 장점 개발 및 유지보수가 쉬움 검색엔진 최적화(SEO - Search Engine Optimization) 쉬움 ▶ 단점 네트워크 트래픽 증가 서버 처리량 증가 페이지 전환이 느림 ▶ 특징 새로운 DOM으로 라우팅 일부 AJAX 통신 ▶ SSR vs MPA - SSR : AJAX 통신을 통해서 html 코드 조각을 바꿈 - MPA : 페이지 이동 방식 - 공통점 : 둘 다 서버에서 랜더링함. 2. 클라이언트 사이드 렌더링(CSR) - Single Page Application(SPA) ▶ 장점 네트워크 트래픽 감소 서버 처리량 감소 페이지 전환이 빠름..
※ Sequelize 개념 소개 ▶ 우선, Sequelize란 Node.js ORM 프레임워크이다. 기본적으로 DB연결은 네트워크 통신을 필요로하고, 따라서 비동기 처리를 위해 Promise 기반으로 만들어져있다. ▶ Sequelize 하나로 다양한 DBMS (Postgres, MySQL, MariaDB, SQLite, Microsoft SQL Server)를 지원하지만, 각 SQL을 DBMS 특성마다 성능을 최적화시킬 수 없다는 아쉬움이 있다. https://sequelize.org/master/ Manual | Sequelize Constraints & Circularities Adding constraints between tables means that tables must be created i..
※ Express란? 웹 및 모바일 어플리케이션을 위한 강력한 기능을 가진 간결하고 유연한 프레임워크이다. 수많은 HTTP 유틸리티 메소드 및 미들웨어를 통해 쉽고 빠르게 강력한 API 서버 개발 ※ Express Framework 프로젝트 생성하기 1. package.json 생성 npm init 2. express 설치 npm install express 3. nodemon 설치 npm install -D nodemon (-D옵션은 개발용, 배포 시 미포함) (nodemon은 서버 코드에 수정이 발생하면 자동으로 서버를 재시작해줌) 4. package.json 수정 start: nodemon app.js (개발시에는 node 대신에 nodemon 사용) ▶ 프로젝트 폴더 구조 - public : 정적..
※ npm (Node Package Manager) 외부 패키지(모듈)을 npm 서버에서 다운로드해서 사용할 수 있도록 관리 npm 서버에서 패키지 검색할 수 있음 node.js를 설치하면 npm 명령어도 같이 설치됨 (확인 명령어: npm -v) https://www.npmjs.com/ npm Bring the best of open source to you, your team, and your company Relied upon by more than 11 million developers worldwide, npm is committed to making JavaScript development elegant, productive, and safe. The free npm Registry has b..
▷ 인증 방법 3가지 1. 세션 기반 인증 (서버 기반 인증) - 하나의 도메인에서 사용할 때 : 만약 유저가 로그인을 하게 되면, 서버 측에서 유저가 현재 로그인 중이라는 인증정보를 기억하고 있어야 한다. 이 정보를 세션이라고 부른다. 세션을 유지하기 위해서는 메모리, 디스크, 데이터베이스 시스템 등에 담아둔다. 하지만 이러한 방식은 큰 규모의 어플리케이션을 개발하기에 어려움이 있다. ※ 스프링 시큐리티도 세션 기반 인증이다. ※ 세션에는 객체를 저장할 수 있지만, JWT는 문자열 타입만 저장할 수 있다. ※ 세션 기반 인증의 문제점 2가지 ✔️ 세션을 유지하게 될 때, 로그인 중인 유저가 많아지면 메모리 또는 디비의 성능에 무리가 간다. ✔️ 서버 확장이 어렵다. 세션을 사용하면서 분산된 시스템을 설..
스프링 시큐리티 설정 자체는 간단(?)하지만, 스프링 시큐리티가 지원하지 않는 인증 방식을 사용한다거나 HttpSession이 아닌 다른 장소에 인증 객체를 보관하기 위해서는 스프링 시큐리티의 동작 방식을 이해하고 그 중 필요한 부분의 기능을 알맞게 변경할 수 있어야 한다. 1. SecurityContext, SecurityContextHolder, Authentication ▶ 흐름 org.springframework.security.core.Authentication은 스프링 시큐리티에서 사용자(웹 브라우저, REST로 접근한 외부 시스템)의 보안 관련 정보를 보관하는 역할을 한다. ✔️ 보안 관련 정보란? 1. 사용자의 인증 여부 2. 사용자가 가진 권한(Authority) 3. 이름 및 접근 주체..
HTTP는 무상태(stateless- 상태를 유지하지 않음) 프로토콜이다. 즉, 재요청 시 서버는 클라이언트를 기억하지 못한다. 그래서 상태를 유지하기 위한 기술로 쿠키와 세션을 이용한다. 즉, 쿠키나 세션방식을 이용해서 클라이언트가 옛날에 접속했던 클라이언트인지 기억해내는 것이다. ※ Cookie cf> document tomcat.apache.org/tomcat-9.0-doc/servletapi/index.html 문자 데이터를 클라이언트에 저장하고, 서버에서 사용할 목적으로 활용 실행 흐름 클라이언트(브라우저) 서버 1 쿠키 생성 (이름:값) 해서 Response Header에 쿠키를 넘겨줌 2 쿠키 저장 3 쿠키사용 (쿠키 값을 이용) - 서버가 자기가 사용할 목적으로 클라이언트에 쿠키를 저장한다..
✔️ 5가지 정보가 필요 IP주소 -> 포트번호(Oracle: 1521, MySQL: 3306, WAS: 80) -> DB Name -> account, password ✔️ 계정과 비밀번호가 결정되면 -> 데이터베이스가 결정된다. ✔️ 계정별로 테이블 스페이스가 따로 주어진다. 그래서 계정별로 테이블 공유가 되지 않는다. - Primary - Unique - Foreign - * == not null ▶RDB(Relationship Data Base) : 관계형 데이터베이스 ▶RDBMS : RDB를 관리하는 시스템이자 소프트웨어이다. RDBMS의 종류는 Oracle, MySQL, MSSql, Sybase ※ SQL : Structured Query Language (구조적 질의 언어) ▶ DQL (Da..
※ ORM (Object Relational Mapping ) - 객체 관계 맵핑 애플리케이션에서 자바 객체를 ORM에 넘겨주면 ORM은 SQL로 생성해서 DB에 전달해서 결과를 가져오고, 결과를 다시 자바 객체로 변환하여 전달해준다. 애플리케이션 개발자는 SQL을 볼 수 없다. ORM 내부에 들어가있기 때문에 설정만 잘 하면 SQL이 자동적으로 생성된다. ORM에서 생성되는 SQL문이 DB에서 실행되어야 하므로 ORM과 DB는 밀접한 관계가 있다. 그럼 애초에 DB를 생성할 때 ORM에 최적화된 구조로 생성해야 한다. ORM은 개발자가 SQL에 전혀 관여할 수 없다. 베일에 쌓여져 있다. 이 문제를 해결하기 위해서 MyBatis는 애플리케이션과 SQL문을 직접 생성한다. 직접 SQL을 작성할 수 있기 ..
- Total
- Today
- Yesterday
- 생성자필드메소드
- jre
- ES6
- jdk
- 백준2206 파이썬 풀이
- 익명자식객체
- 정적멤버
- 자바스레드
- yarn start
- 자바스크립트Promise
- dynamic-project
- @functools.singledispatch
- sequelize.fn
- nunjucks
- Git
- es6모듈
- @functools.lru_cache
- 인스턴스멤버
- nodejs
- 메이븐 저장소
- 자바스크립트Call-back
- 사용자정의예외클래스
- 객체지향개념
- 클래스와객체
- 백준
- java
- 자바빌드도구
- method와 function
- @functools.wraps
- os
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |