Unwound Developer

MongoDB 개요 몽고DB는 크로스 플랫폼 도큐먼트 지향 데이터베이스 시스템이다. NoSQL 데이터베이스로 분류되는 몽고DB는 JSON과 같은 동적 스키마형 도큐먼트들을 선호함에 따라 전통적인 테이블 기반 관계형 데이터베이스 구조의 사용을 삼간다. 크로스 플랫폼 몽고DB의 정의인데 말이 좀 어려워서 정확하게 무슨 뜻일까 찾아봤습니다. 우선 크로스 플랫폼은 컴퓨터 프로그램, 운영 체제, 컴퓨터 언어, 프로그래밍 언어, 컴퓨터 소프트웨어 등이 여러 종류의 컴퓨터 플랫폼에서 동작할 수 있다는 것을 뜻합니다. 아마 이렇게 다양한 언어와 운영체제에서 작동하기 때문에 크로스 플랫폼 시스템이라고 하는 것 같아요. 관계형 데이터베이스와 도큐먼트 데이터베이스 도큐먼트 지향 데이터베이스는 관계형 데이터베이스(RDBMS)..

Arcane 프로젝트에서 가장 핵심적인 라이브러리를 꼽으라면 아마 Axios일 것 입니다. Arcane에서 클라이언트와 서버 간 통신은 모두 Axios를 통해서 이루어집니다. 이전에도 Axios 통신 방식에 대해서 간략하게 설명했지만, 이번엔 더 자세하게 알아보도록 하겠습니다. Axios는 브라우저, Node.js를 위한 Promise API를 활용하는 HTTP 비동기 통신 라이브러리입니다Axios 공식문서에서 Axios를 소개하는 글입니다. 저번에 비동기 통신을 소개했듯이 클라이언트 측에서 서버에 무언가 요청을 할 때, 응답을 듣지도 않았는데, 계속해서 진행해버린다면, 당연히 오류가 날 것입니다. Axios는 Promise를 활용하는 비동기 통신을 요청하기 때문에, 서버의 응답을 듣고 나서야 다음으로 ..

이번에는 클라이언트 쪽 코드 구조입니다. 가장먼저 Root에 제일 가까운 App.jsx입니다. jsx는 자바스크립트의 확장 문법을 지원하는 확장자로써, 자바스크립트안에서 HTML문법을 사용가능하도록 합니다. 기본적으로 Arcane 웹페이지 작동방식은 다음과 같아요. Page폴더에있는 파일들 중 하나를 App.jsx에서 불러냅니다. 예를들어, Main.jsx 페이지를 불러냈다고 하면, 그 메인 페이지는 다시 필요한 컴포넌트들을 불러냅니다. Main의 경우에는 Tobbar컴포넌트, 메인메뉴 컴포넌트 등을 부릅니다. 이렇게, 페이지는 상황에따라 여러 컴포넌트들을 갈아끼우는식으로 사용자에게 다른 모습을 보여줍니다. 마치 퍼즐조각을 끼웠다 뺐다 하는 느낌이에요. // App.jsx import { Routes, ..

위 사진은 서버 쪽 구조입니다. app.js가 서버의 기본이 되는 파일입니다. // app.js import express from "express"; import { connectDB } from "./db/db.js"; import summonersRouter from "./router/summoners.js"; import mypageRouter from "./router/mypage.js"; import authRouter from "./router/auth.js"; const app = express(); // 회원가입 & 로그인 & 유저관련 디비 설정 app.use("/auth", authRouter); // 글 작성 app.use("/post", postRouter); // 유저 전적 검색 ..