Page 331 - MDP2022-3

제 2 장 설계

1. 개요

가. 제작동기

2021년 ~ 2022학년의 태반을 코로나로 인한 원격수업으로 진행되면서 전국에 있는
많은 학생들이 구글 클래스룸을 이용하게 되었고, 그 결과로 과제 제출 및 댓글, 유저
관리 등 많은 기능에서 Delay 및 오류로 인한 피해가 발생했다. 마찬가지로 본인도
겪게 되며 의도치 않은 과제 누락으로 인해 불이익을 받게 되어 원격수업은 정말

안좋은 기억으로 남게 되었다.

그러던 중, 비록 코로나의 위험은 점차 식어가지만 우리 학교에서만 이용할 수 있고
거기에 멋있는 클래스룸 같은 것을 개발한다. 학생들이 불편함을 겪지 않으면서도
즐겁게 사용할 수도 있을 것 같아 MDP 프로젝트로 Ma:in#을 개발하게 되었다.

나. 동작설명과 블록도

2. 사용 도구
Front-end
HTML, CSS, JavaScript – 웹 페이지 구축을 위해 사용

React – SPA 방식의 인터페이스를 구축하는데 사용
Firebase – 간편하고도 빠른 Auth, File upload, CRUD를 위해 사용

그 외 라이브러리 – Styled-components, Framer-motion, react-icons, React-router-dom

Back-end

Node – Express를 이용한 서버를 사용했으며 React와의 데이터 통신에 사용
MySQL – 주요 데이터베이스를 구축 및 사용자정보, 게시판 정보 삽입 및 검색에 사용

Tools

Github – 깃 저장소 호스팅을 지원하는 웹 서비스
Visual Studio Code – Microsoft에서 개발한 소스 코드 편집기
Google Firebase – 구글에서 지원하는 애플리케이션 개발 지원 플랫폼

제 3 장 소프트웨어 설계

1. 개요