2025/01/02 3

[To Do App] 프론트엔드 개발 환경

HTML, TypeScript, CSS, React 로 개발할 것임. 1. NodeJS 설치- 20 버전으로 설치 2. 설치 후 cmd 에서 node와 npm 버전 확인 (설치 확인하는 것)npm -vnode -v 3. 타입스크립트 설치npm install -g typescript  4. 리액트와 타입스크립트 프로젝트 설치- 새로운 파일 지정 후, front 전용 폴더 생성 할것임.- 일단 본인은 npm 으로 create-react-app 폴더 생성에 의존성 문제가 너무 많아 yarn을 통해 설치할 예정// yarn 설치npm install -g yarn// react-app 만들면서 template을 typescript로 하기yarn create react-app todoapp-front --templ..

[To Do App] 개발환경 설정 - 백엔드 개발환경

1. Spring Boot 프로젝트 생성할 것임. Spring Initializr 사이트를 통해 프로젝트를 간단하게 생성 가능함. 2. Docker를 통해서 mysql-container 생성하기 Docker 를 통해서 my sql 설치하는 건 추후에 올리겠음.- cmd를 통해서 Docker run 명령어를 통해서 컨테이너를 생성할 수 있음.docker run --name -e MYSQL_ROOT_PASSWORD= -d mysql:latest① --name 뒤에는 컨테이너 이름 지정② -e 뒤에는 MY_SQL_ROOT의 패스워드를 지정해주면 되는데 기본 root로 지정.③ -d 는 디태치드 모드 (detached mode)임- 디태치드 모드란 컨테이너를 실행하겟다는 의미임. 백그라운드에서 컨테이너가 실행..

[To Do App] 프로젝트 설계

1. 목적정의 / 목표 및 범위 정의- ToDoApp 은 사용자가 할 일을 추가 Create, 조회 Read, 수정Update, 삭제 Delete 할 수 있는 간단한 웹 애플리케이션임 2. 요구사항 정의- ToDoApp의 기능적 요구사항 / 시스템이 반드시 수행해야 하는 기능① 할 일을 추가 Create② 할 일을 조회 Read③ 할 일을 수정 Update④ 할 일을 삭제 Delete+) 할 일을 했으면 체크 표시 / True or False로 - 비기능적 요구사항 성능, 보안, 가용성에 대한 요구사항 정의 > 개인 프로젝트라 생략3. 아키텍쳐 설계- 시스템 아키텍처: 프론트엔드랑 백엔드 통신은 Rest API를 통해 통신할 예정. 데이터는 MySQL 사용할 예정(Docker)- 컴포넌트 설계: RDBM..