3. React Event Handling Event 웹 브라우저에서 DOM 요소와 상호작용하는 것을 이벤트라고 합니다. 예를들어 DOM 요소를 클릭하면 onClick 이벤트를 정의해 상호작용을 하게 됩니다. 리액트 이벤트 시스템 주의사항 이벤트 이름은 카멜 표기법으로 작성 이벤트에 실행할 자바스크립트 코드를 전달하는 것이 아니라, 함수 형태의 값을 전달 DOM 요소에만 이벤트 설정할 수 있다 직접 만든 컴포넌트에는 이벤트를 자체적으로 설정할 수 없다. 단지 props를 전달해 줄 뿐. 클래스 컴포넌트의 이벤트 핸들링 - state와 메서드 활용 1. 이벤트 발생시 생성되는 e객체를 이용한 이벤트 핸들링 import React, { Component } from 'react'; class EventPractice extends Component .. 2020. 10. 25. 2. React Component 컴포넌트 종류 클래스형 컴포넌트 state 기능 사용가능 라이프사이클 기능 사용가능 임의의 메서드 정의 가능 constructor 작성시 반드시 super(props); 메서드를 호출하여 리액트의 Component 클래스가 지닌 생성자를 호출 render 함수가 반드시 있어야 하고, 그 안에서 보여 주어야 할 JSX를 반환해야 한다 함수형 컴포넌트 클래스형 컴포넌트 보다 메모리 소모가 적음 state, 라이프사이클 대신 hooks 사용 Props properties의 줄인 표현으로 컴포넌트 속성을 읽을 때 사용하는 요소 해당 컴포넌트의 부모 컴포넌트에서 설정하며 컴포넌트 자신은 해당 props를 "읽기전용"으로 사용 defaultProps : 부모컴포넌트에서 따로 props 값을 설정하지 않을 때 보여지.. 2020. 10. 24. express (2) : 요청과 응답, 쿠키와 세션, REST API와 라우팅 1. 요청과 응답 - 클라이언트에서 서버로 request를 보내고, 서버에서는 request내용을 읽고 처리한뒤 클라이언트에게 response를 보낸다. - 클라이언트로부터 요청이 왔을 때 어떤 작업을 수행할지 listen 메서드에 콜백함수를 넣거나, 서버에 listening 이벤트 리스너를 추가한다. 2. 쿠키와 세션 - 쿠키 : '키-값'의 쌍, reques와 response의 header를 통해 오고 감 - 서버는 요청에 대한 응답을 할 때 쿠키라는 것을 클라이언트에게 보냄 -> 서버로 부터 쿠키가 오면 '웹 브라우저'는 쿠키를 저장해 두었다가 요청할 때마다 쿠키를 동봉해서 보냄 -> 서버는 요청에 들어있는 쿠키를 읽어서 사용자가 누구인지 파악 - 브라우저는 쿠키가 있으면 자동으로 동봉해서 보내므로.. 2020. 10. 24. express (1) : 웹서버 생성, 미들웨어, 라우팅 1. 웹서버 생성 yarn add express //src/index.js const http = require('http'); const express = require('express'); //익스프레스 서버 객체 const app = express(); //웹 서버의 port속성 설정 app.set('port', 3000); http.createServer(app).listen(app.get('port'), ()=>{ console.log('express server starts : ' + app.get('port')); }); express server object의 메소드 - set(name, value) : 서버 설정을 위한 속성 지정 - get(name) : 지정한 속성 반환 - use([p.. 2020. 10. 24. SNS 로그인 flow 1. 클라이언트서비스에서 플랫폼(카카오) 로그인 2. 플랫폼(카카오)에서 유저정보확인 및 클라이언트서비스에게 토큰1(유효기간매우짧음) 응답 3. 클라이언트서비스는 플랫폼에게 받은 토큰1을 자신의 백엔드서버에 전달 4. 토큰1을 받은 백엔드서버는 플랫폼(카카오)에게 해당 토큰1에대한 유저정보를 받기위한 요청전달 5. 유저정보를 응답으로 받은 백엔드서버는 유저정보를 db에 저장, 토큰2발행, 토큰2를 프론트에게 전달 2020. 10. 24. AWS django 배포 AWS cloud storage platform : ebs, s3 saas :sas, amazon aws, google cloudplatform, microsoft azure ec2 : 몇분안에 구동 가능한 가상 서버 (서버를 하나 빌려줌) vpc : aws 네트워크안에서 사용자 전용의 사설 네트워크 망 (네트워크 망을 빌려줌) virtual private cloud EBS: 스토리지 타입 s3 : 파일 업로드 및 공유 rds : 클라우드에서 데이터베이스 관리 (mysql, oracle 등등 왠만한 db지원) elb : 서버로 들어오는 트래픽을 여러개의 머신으로 전달 (load balancing) rds 접속하기위한 우분투 쉘 커맨드 $mysql -h "rds엔드포인트주소" -u root -p 덤프 빼는.. 2020. 10. 24. 이전 1 ··· 19 20 21 22 23 24 25 ··· 32 다음