Unwound Developer

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

이번에는 클라이언트 쪽 코드 구조입니다. 가장먼저 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); // 유저 전적 검색 ..

개요 https://github.com/ysh038/Arcane https://project-arcane.netlify.app (Riot API가 잘 최신화 되지 않고, 컨벤션이 일정하지 않은 관계로 API로 받아오는 정보들이 잘 나타나지 않을 수도 있습니다.) 이번에 Node.js를 공부하면서 친구 한 명과 2인이서 프로젝트를 진행했습니다. 진행할 때, 차근차근 글을 작성하면서 했어야하는데, Node.js, Express 등등 프로젝트를 진행하면서 필요한 부분을 그때 그때 공부하면서 진행하느라 다 하고 나서야 글을 작성합니다. 프로젝트 주제로 Riot API를 활용한 웹페이지를 선정하게 된 이유는 첫번째로, 친구랑 같이 개발하는 첫 번째 프로젝트였기에 너무 무거운 주제보단 주위에서 가볍게 볼 수 있는 ..