일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- 웹개발
- 부천공간대여
- 스컬킹
- 옥길그릭요거트
- 옥길파티룸
- 취미
- 보드게임점수
- 옥길요거트
- 보드게임점수계산
- 그릭요거트
- 부천파티룸
- 광명파티룸
- 일
- 개발자
- 착한코딩
- mysql
- 스페이스우일
- 코딩
- 서울파티룸
- 스컬킹점수
- 파티룸
- 옥길동파티룸
- 해외여행
- 스컬킹점수계산
- 구로파티룸
- 옥길동요거트
- MBTI
- 휴식
- 가장존경하는인물
- 존경하는위인
- Today
- Total
SIMPLE & UNIQUE
수업 목차 본문
1회차
[React & Node 구조설정, 서버 구동 확인, 리스트 페이지 구현]
✔REACT, NODE 서버를 PROXY로 연결해, 하나의 서버 처럼 구동한다.
✔REACT VIEW 페이지 레이아웃을 세팅하고, 공공데이터 API를 호출해 리스트 페이지를 구현한다.
✔튜터의 DB서버에서 데이터를 조회해, REACT 리스트 페이지를 구현한다.
1-1강
- 인사(OT)
- 전체 수업 진행 방식에 대한 설명
- 1회차 수업 목차 소개
1-2강
- NODE.JS 설치, CREATE REACT APP 설치, NODE EXPRESS FRAMWORK설치
- 디렉터리 구조 설정
- 프록시 설정
- GET 방식, POST 방식으로 REACT 서버에서 NODE 서버의 JSON 데이터를 가져온다.
1-3강
- 제공받은 HTML, CSS, IMG 파일로 REACT서버 HOME 페이지를 세팅한다.
- 레이아웃 HEADER, FOOTER 처리
- REACT 공공데이터 리스트 페이지 구현
- 공공데이터 API 호출에 화면에 리스트 출력 확인
1-4강
- REACT 분석 TOOL 리스트 페이지 구현
- 분석 TOOL 리스트 NODE API 개발
- MYSQL RDS(튜터 계정)를 연결해, 리스트 페이지에 데이터 출력 (Mybatis 모듈사용)
2회차
[AWS에 가입 후 DB 서버 생성, 등록 & 수정 페이지 구현, 파일 & 이미지 업로드 구현]
✔AWS 가입 후 RDS 인스턴스를 생성 및 구동하고, DB 테이블을 만든다.
✔생성한 DB서버에서 조회한, 데이터를 REACT 화면에 노출시킨다.
✔등록 & 수정 페이지와, 파일 & 이미지 업로드 기능을 구현한다.
2-1강
- AWS 가입 후 RDS 프리티어(1년무료) DB 서버를 세팅하고, 인스턴스를 구동한다.
- MYSQL을 설치한다.
- MYSQL Workbench에서 RDS 서버에 접속해, 스키마와 필요한 테이블을 생성한다.
- 프로젝트 코드에서 튜티 계정으로 새로 만든, DB서버 주소와 계정 정보를 입력한다.
- MYSQL RDS(튜티 계정)를 연결해, 리스트 페이지에 데이터 출력 (Mybatis 모듈사용)
2-2강
- DB 서버 한국시간 설정
- 함수 작성 권한추가 (RDS 콘솔 > 파라미터그룹 수정)
- DB 서버 한글 인코딩 설정
- 리스트 페이지에서 데이터 노출을 하기 위해, 생성한 테이블에 더미 데이터를 삽입한다.
2-3강
- REACT TOOL 등록 페이지를 구현
- NODE TOOL 등록 API를 구현
- 등록페이지 입력한 데이터들을 유효성 검사 후, DB에 INSERT
- 파일업로드, 이미지 업로드 구현
2-4강
- REACT TOOL 수정 페이지를 구현
- NODE TOOL 수정 API를 구현
- 수정페이지에 기존에 등록한 데이터들 노출
- 수정페이지 입력한 데이터들을 유효성 검사 후, DB에 UPDATE
3회차
[삭제 기능 추가, GIT사용, AWS EC2서버에 소스 배포, 스케줄러 구현]
✔리스트 페이지에서 삭제 기능을 구현한다.
✔사이트 디자인에 어울리는 ALERT 창을 추가한다.
✔EC2서버를 생성하고, 소스를 배포한다.
✔특정 시간단위로 작업을 실행하기 위해, 스케줄러를 구현한다.
3-1강
- 삭제 버튼을 누르면 해당 글이 DB에서 DELETE
- SWEETALERT2(ALERT창을 이쁘게 띄어주는 패키지) 구현
- 개인 GITHUB에 Repository 생성. SOURCE TREE 사용
3-2강
- EC2(t2.micro) 서버생성 (프리티어 - 무료 1년 사용가능)
- SFTP, SSH 환경 세팅, 리눅스 명령어 학습
3-3강
- EC2 서버에 node를 설치
- react-node 소스코드를 서버 배포, 패키지 설치
3-4강
- NODE 스케줄러 개발 후 EC2서버 코드배포
- 스케줄러 실행시 DB 로깅테이블에 INSERT
4회차
[회원가입 & 로그인 구현, 이메일 발송 구현]
✔회원가입, 로그인을 구현한다.
✔쿠키로 로그인 세션 관리를 구현한다.
✔이메일 발송을 통해 사용자 인증을 한다.
4-1강
- 단방향 암호화 모듈을 사용해 회원가입 기능 구현
- 회원가입 정보 유효성 체크, Bcrypt 단방향 암호화
4-2강
- Bcrypt를 사용해 로그인 기능 구현
- 로그인 후, 쿠키 세션관리
4-3강
- 이메일 HTML 템플릿 작성.
- 이메일 인증을 이용한 비밀번호 재설정 구현
4-4강
- 자유로운 물음과 답
https://taling.me/Talent/Detail/19341
강의 문의 : ljung5@naver.com
'탈잉 강의 자료 > 2020_비전공자도 가능한 웹 프로젝트' 카테고리의 다른 글
2-1강 : AWS 회원 가입, RDS 인스턴스 생성, DB 서버 연결 (0) | 2020.08.01 |
---|---|
1-4강 : AWS DB서버 연결, 데이터 조회해 리스트 페이지에 노출 (0) | 2020.08.01 |
1-3강 : html, css, img파일 세팅, 공공데이터 API 호출 (0) | 2020.08.01 |
1-2강 : react, node 개발환경 세팅, 프록시 설정 (0) | 2020.07.31 |
[비전공자도 가능한 웹 프로젝트] 개발부터 배포까지, 배우면서 완성(react,nodejs,mysql,aws) (0) | 2020.07.31 |