gpt를 통한 풀스텍 개발자 쌉가능

레슨 5 - 나만의 시스템 구축하기(로컬 호스트, 라우팅 설정 및 첫 사용자 추가하기)

인생진리 2023. 6. 12. 17:30

우리는 데이터베이스를 사용해서 정보를 저장하고 불러올 수 있고이건 마치 데이터베이스가 마치 컴퓨터의 큰 서랍처럼 우리가 필요한 정보를 저장하고 나중에 꺼내서 사용할 수 있어요.

로컬 호스트는 컴퓨터 내부에서 작동하는 서버를 설정하는 것이에요. 서버는 마치 우리의 집 같아요. 다른 사람들과 정보를 주고받을 수 있는 공간입니다. 로컬 호스트를 설정하면 우리는 서버를 우리 컴퓨터에서 실행시킬 수 있어요.

라우팅은 서버에게 요청이 들어왔을 때 어떤 동작을 취할지를 결정하는 것이에요. 마치 우편배달원이 우리 집으로 편지를 가져올 때 어떤 경로로 오는지 결정하는 것과 비슷해요. 라우팅을 설정하면 서버가 요청을 받았을 때 올바른 위치로 이동할 수 있게 도와줘요.

그리고 우리는 서버와 MongoDB라는 데이터베이스를 연결했어요. MongoDB는 데이터를 저장하고 관리하는 도구에요. 서버는 MongoDB와 소통해서 필요한 정보를 가져올 수 있게 됐어요.

그럼 실제로 첫 번째 사용자를 데이터베이스에 추가해 보도록 해요. 우리는 데이터베이스 안에 사용자 정보를 저장할 공간을 만들어야 해요. 이를 위해서는 Mongoose 모델이라는 도구를 사용해야 해요. Mongoose 모델은 데이터베이스의 특정 컬렉션을 나타내는 클래스를 만들어주는 역할을 해요.컬렉션이라는 용어는 데이터베이스에서 비슷한 종류의 정보를 모아둔 그룹을 의미해요. 예를 들어, 사용자 정보를 담는 컬렉션을 만들 수 있어요. 이 컬렉션은 여러 사용자들의 정보를 저장하고 관리할 수 있는 공간이에요. Mongoose 모델을 만들면 컬렉션에 어떤 종류의 정보를 저장할지 정할 수 있어요. 예를 들어, 사용자의 이름, 나이, 이메일 등을 저장할 수 있어요. 이렇게 만들어진 모델 클래스를 사용해서 실제로 데이터베이스에 첫 번째 사용자를 추가할 수 있어요.

(7강 참조 )https://parkit.tistory.com/155

여기 userSchema라는 것이 있어요. 우리는 new라고 하고 스키마를 만들게 될 거예요. 스키마는 마치 사용자 정보를 저장할 틀 같은 역할을 해요. 그 안에는 예시로 이름, 이메일, 비밀번호가 있어요. 예를 들어, 여러분이 이름, 이메일, 비밀번호를 입력하려고 할 때 이렇게 스키마를 만들 수 있어요. 이는 단지 예시에 불과해요. 여러분은 원하는 대로 스키마를 만들 수 있어요. 즉, 여러분이 저장하고 싶은 정보에 맞게 스키마를 만들면 돼요. 그리고 우리가 모델을 만들고 데이터베이스를 쿼리 하려면 데이터베이스에 질의할 수 있어요. 쉽게 말하면, 우리가 데이터베이스에게 정보를 요청하고 그에 맞는 결과를 받을 수 있어요. 이를 통해 데이터베이스에서 원하는 정보를 가져올 수 있게 될 거예요. 이렇게 데이터베이스와 상호작용하면서 우리는 원하는 정보를 저장하고 조회할 수 있어요.

우리는 user.save()를 사용해서 정보를 찾을 수도 있고 저장할 수도 있어요. 저장은 아주 중요한 부분이에요, 왜냐하면 그래야 실제로 데이터베이스에 정보가 저장되기 때문이거든요. 이제 이를 실제로 해보도록 할까요? 저는 Visual Studio Code에서 서버로 돌아가서우리의 connect() 함수 아래에 스키마를 만들어볼게요. 스키마는 데이터베이스에 저장할 정보의 형식을 정해주는 역할을 해요. 우리가 만든 스키마는 사용자 정보를 담을 수 있는 형태일 거예요. 예를 들어, 이름, 이메일, 비밀번호 등을 저장할 수 있어요. 스키마를 만들 때는 우리가 미리 정의한 userSchema를 사용하면 돼요. 이제 우리는 스키마를 만들었으니, 실제로 데이터베이스에 정보를 저장하고 조회할 수 있게 됐어요.

여기 있는 userSchema를 복사해서 붙여 넣을 거예요. 우리는 name 대신에 user name을 원하고요. user name은 사용자의 이름을 의미하며, 이는 문자열로 표현될 거예요. 다른 부분들은 삭제할게요. 쉼표도 필요 없으니까 지워줄게요. 왜냐하면 그런 부분들은 우리에게 필요하지 않기 때문이에요. 그 후에 Ctrl + S를 눌러 저장을 해주세요. 이렇게 하면 우리가 작성한 코드가 저장될 거예요.

그럼 우리는 실제로 우리가 만든 userSchema를 사용해서 문자열로 된 사용자 이름과 패스워드를 가지는 스키마의 Mongoose 모델을 User로 설정하고 있어요. 방금 그걸 했고요.

만약 모든 것이 문제없이 진행되었다면, 데이터베이스는 자동으로 업데이트될 거예요. 그런데 만약 잘되지 않는다면 걱정하지 마세요, 우리는 디버깅을 할 거예요. 문제를 해결해서 제대로 작동하게 만들어야 하니까요. 그럼 우리는 User가 있으니까 이제 스키마를 사용 해서 사용자의 객체를 만들 수 있어요. 이는 생성자 모델과 비슷하게 동작해요. 이제 4. CRUD 작업 코드를 복사하신 다음(레슨 4 - 리스트 참조)에 name은 우리가 username으로 변경했으니 고쳐주고 username과 password만 정의하도록 하겠습니다. 이메일 부분은 지우도록 하겠어요.

이제 사용자를 데이터베이스에 넣는 방법에 대해 알아볼게요. 예를 들어, 우리는 Mongoose에서 user.save()라고 할 수 있어요. 이렇게 하면 사용자 정보가 적절히 저장되지 않은 경우에는 User save error:라는 메시지를 보낼 수도 있어요. 이를 통해 문제가 발생했을 때 알 수 있게 도와줄 거예요. 좋아요, 이제 이를 저장하고 어떤 일이 일어나는지 확인해 볼게요. 우리가 서버를 다시 실행하면 어떤 일이 일어나는지 볼 수 있어요. 그럼 저는 서버 연결을 끊을 거예요 (Ctrl + C를 누르면 됩니다). 그러고 나서 node server.js라고 입력해서 서버를 다시 실행해 볼게요. 이렇게 하면 우리가 작성한 코드가 실행되면서 사용자 정보가 데이터베이스에 저장되는 걸 확인할 수 있어요.

여기 주목할 부분은 여기입니다. 서버가 3000번 포트를 청취하고 있고, MongoDB에 연결되었습니다. 이 새로운 메시지를 보세요. "User saved"는 새로운 사용자가 데이터베이스에 성공적으로 저장되었다는 의미입니다. 하지만 실제로 그런지 확인해야 합니다.

그럼 우리는 데이터베이스를 확인해볼 건데요, 이 페이지를 새로고침하고 "Browse Collections"를 클릭하겠습니다. 그렇게 하면 데이터베이스의 내용을 확인할 수 있습니다.

여기 Collections 아래를 보시면, 지금까지 모든 단계를 정확하게 따라왔다면 왼쪽에 test.users라는 항목이 생성된 것을 볼 수 있을 거예요. 그리고 쿼리 결과를 보시면 실제로 1-1이 있는 것을 확인할 수 있어요.

이걸 확대해서 보도록 할게요. id라는 항목이 있는데요, 이는 데이터베이스에서 자동으로 생성된 것입니다. 그리고 id 번호 아래에는 user name이 있어요. 그 값은 'John Doe'입니다. 그리고 password인 'password123'도 있어요. 이런 식으로 단 한 줄의 코드로 사용자를 데이터베이스에 추가하고 있어요. 우리 리스트에 있는 것이 무엇인지 한 번 확인해 볼까요?레슨 2 - 구축 단계 정리 가이드 참고 하시면면 확인할 수 있어요.다음으로, 사용자 인증을 설정해야 하고, 게임을 위한 리액트 클라이언트를 만들어야 합니다. 그리고 사용자 인증을 위한 라우트를 만들 수 있는데요. 하지만, 이를 테스트하는 좋은 방법은 프런트엔드 페이지를 만드는 것이죠. 그렇게 하면 더욱 흥미로울 거예요. 왜냐하면 게임 리액트를 만드는 것은 정말로 재미있을 테니까요. 다음 강의에서 뵙도록 할게요. 그때까지 열심히 배워서 만들 준비를 해보세요!