Coding Kitsune

이전까지 DB없이 JSON 파일형태로 로그인 / 회원가입을 구현해보았다. 여기까지도 나름대로 WAS에 속하고, 의미있는 작업이지만 매번 좀 더 제대로 된 시스템을 위해 AWS의 RDS를 이용하여 MYSQL 데이터베이스를 만들었고, 이를 연동해서 사용하고자 한다. 먼저 db.js를 통해 데이터베이스를 설정해줘야한다. npm i -s mysql 명령어를 통해 mysql을 설치해주고, db 변수를 만들어(mysql.create.Connection) 호스트와 유저 패스워드 데이터베이스명을 설정해준 뒤, 연결해주고 export 해주면 외부에서 이 데이터베이스를 사용할 수 있게 된다. const mysql = require("mysql"); const db = mysql.createConnection({ host:..

저번시간 까지 DB 없이 로그인 / 회원가입을 파일 형식으로 구현하였고, 이제는 AWS의 훌륭한 무료DB 서비스( 잘못하면 과금 ㅠ ) 를 이용하여, DB를 연동한 로그인 / 회원가입 기능구현을 준비하려고 한다. 먼저 적당한 RDS 인스턴스를 만들어주고, 파마리터 그룹 설정도 char 부분을 utf-8로 맞추어 준뒤 이 인스턴스의 디폴트 값으로 만들어준다. 그리고 커맨드 창을 열어 mysql -h 엔드포인트 -u 사용자이름 -p를 한 뒤, 비밀번호를 치고 들어가면 연결된 mysql이 시작되는데, 이게 뭔일인가,,, 2003 오류가 뜬다. 이때는 AWS에 보안그룹에 들어가 인바운드 규칙 편집을 통해 수정한 뒤 다시 들어가면 된다.. https://code4human.tistory.com/74 나는 여길 참..

회원가입 (register) 구현은 그리 어렵지 않았다. 먼저 login.ejs와 비슷한 형태인 register.ejs를 만들어주고, input으로 이름과 비밀번호 확인까지 받아주는 형태의 html 파일을 생성해주었다. 그 후 register.js 파일을 login.js 파일 형태로 만들어주되, 이름(name)을 추가해주고, 회원가입 도중 아이디가 입력되지 않은 경우와 비밀번호 두개가 틀린 경우 바로 alert으로 return해주는 if문을 추가해준다. function register() { if (!id.value) return alert("아이디를 입력해주십시오."); if (psword !== confirmPsword) return alert("비밀번호가 일치하지 않습니다."); const req ..

두번째 학습인데도, 사실 너무 어렵다... 이번엔 User data (회원정보 id, psword, name, 등)를 만들어주고, 이를 모델링하여 User.js 와 UserStorage.js 에 담아준다. 문자 그대로 UserStorage는 "use strict"; class UserStorage { static #users = { id: ["baaams", "bodymind", "starjieun"], psword: ["1234", "123456", "12345678"], name: ["박희범", "박우상", "이지은"], }; static getUsers(...fields) { const users = this.#users; const newUsers = fields.reduce((newUsers, ..

아이디와 비밀번호를 값들을 버튼을 누르면 서버로 전송해주어야 한다. 서버는 이 값들을 받아 로직을 처리하게 된다. 먼저 HTML 값들을 자바스크립트에서 제어하기 위해 DOM 객체를 사용해야한다. id, psword => id와 psword의 값들을 가져오고 DOM객체로 받아들여주고 버튼은 이벤트리스너로 클릭 시 함수(로그인 함수)를 실행시켜주도록 한다. const id = document.querySelector("#id"), psword = document.querySelector("#psword"), loginBtn = document.querySelector("button"); loginBtn.addEventListener("click", login); 이제 login 함수를 만들어 주어야 한다. ..

준비중인 프로젝트에 적용하기 위해 로그인 / 회원가입 강의를 다시 한번 복습하면서, 순서의 흐름을 적어보고자 한다. 우선 저번 시간에 했던 express 프레임워크를 쓰는 이유와 하드코딩에 이어, 뷰를 최적화해주고 라우팅을 폴더로 분리해주었다. 또 controller 부분 또한 분리해주고, app.listen() 또한 모듈화 해주었으며, npm install을 통해 패키지들을 다운 받았고, 깃허브와 연동하였으며 폴더 구조 또한 이런식으로 개발에 최적화 할 수 있도록 구조화 해주었다. 또 서버가 열려있을 때 코드 수정이 이루어지면 서버를 닫는 번거로움을 피하기 위해 nodemon을 install 해주어 nodemon으로 서버를 열면 코드 수정하고 저장하면 즉석으로 반영되기에 이제 로그인 기능적 구현하기 앞..

웹 개발에 있어, 가장 기본적인 백엔드 기능인 로그인 / 회원가입을 구현해보고자 한다. 여러가지 강의를 보면서 따라해봤는데, 생각보다 간단하지 않은 작업인거 같아 여러번에 나누어 공부한 것을 포스팅 할 계획이다. 먼저 VS code, Node.js , MYSQL을 통해 구현하였으며 github 실시간으로 올릴 것이다. github 주소 : https://github.com/heebumpark/node_website GitHub - heebumpark/node_website Contribute to heebumpark/node_website development by creating an account on GitHub. github.com 가장먼저 서버와 연결을 하는데, http로 연결하기보다 expre..