1. 로그인 기능 구현하기 - 프론트엔드

로그인 기능 하나를 위해서

프론트엔드 구성부터 백엔드 구성 그리고 데이터베이스 활용까지 하면서 이해한 것을 정리하고자 한다.

 

<간략 목차>

1. 프론트엔드

2. 백엔드

3. 데이터 베이스

 

1. 프론트엔드

- 쉽게 말해 유저가 클릭하는 웹페이지 공간이다.

( 폰이면 터치가 될 것이고 pc 면 클릭일 것 )

- 어려운 말로 UI 라고도 하더라 ( User Interface )

- 동작 : 여기서 유저가 로그인 기능을 클릭한다.

 

※ 나는 이번에 React 를 이용해서 프론트엔드를 구성해봤다.

( JSX 파일로 코드를 짜고 빌드 돌리면 알아서 html + css + javascript 로 깔끔하게 구성해주니 얼마나 편한지. ) 

 

 

유저가 로그인 기능을 클릭하면, 백엔드로 id,pw 를 전송한다

 

 

 

 

 

백엔드 서버에서 id,pw 관련 정보를 1. DB 서버에 저장하고, 2. 로그인 성공 or 실패를 반환한다

 

 

 

DB 서버에 저장하는 단계. 성공했으면 True, 실패했으면 False

 

성공 여부를 프론트엔드로 다시 전송한다