Sintory의 웹 개발 블로그

1. 간단한 HTML 제작하기크게 toast-container 과 container-full 로 분리했다.toast-container 에는 toast가 실행될 div를 만들어 두었다.container-full 가 실제 실행코드들로 보면 된다.container-full 에는 Head 부분 과 Btn 부분 과 Data 부분 으로 구성되어 있다.Todo와 Done 을 구분하기 위해 다른 웹 페이지 test.html 을 만들었다. test.html도 아래의 html과 유사해 생략하였다.  † To Do App † 오늘 서울의 온도는 °C 이며, 날씨는 입니다..

1. 웹 프로젝트 기획: 목표 설정과 핵심 기능 정리하기1) 프로젝트 목적과 목표 설정- 이번 프로젝트는 직관적이고 간편한 일정 관리 기능을 제공하는 TodoApp을 개발하는 것을 목표로 합니다.- 사용자가 할 일을 쉽게 추가하고, 수정 및 삭제할 수 있도록 설계하여 사용자에게 일정 관리 경험을 제공합니다.- 또한, 실시간 날씨 정보를 연동하여 일정 계획 시 날씨에 따른 고려 요소를 반영할 수 있도록 합니다.> 이 프로젝트를 통해 일정 관리를 할 수 있는 직관적인 TodoApp을 개발하는 것이 목표입니다. 🚀 2) 핵심 기능 정리- 할 일 관리 기능: 사용자는 할 일을 추가, 수정, 삭제할 수 있으며, 완료 여부를 체크할 수 있습니다.- 데이터 저장 및 관리: 입력된 일정 데이터는 데이터베이스(MySQ..

현재 까지 했던 부분은 docker 로 컨테이너를 만들어서 MYSQL 이랑 연결하게금 했고, Mysql을 통해서 Todo Table과 completed Table을 만든 상태이다.이제 해야 하는 부분이 백엔드의 RestAPI를 만들어줘야한다.그 전에 Rest API 에 대해서 한 번 알아보고자 한다.1. RestAPI 개념- REST API는 웹 애플리케이션에서 데이터를 주고받기 위해 사용하는 표준화된 방식- REST 아키텍처 스타일을 따르는 API(Application Programming Interface)임.2. REST- REST(Representational State Transfer)는 분산 시스템에서 자원을 효율적으로 관리하고 상호작용하기 위한 아키텍처 스타일임. Rest의 핵심 개념은 자원..

이전에도 스프링부트랑 연결한게 있으나,프론트를 만들고오니 다시 연결부터 해야하는 상황이 생겨버렸다 ^ㅡ^ 그리하여 다시 Docker를 통해서 mysql-container 을 만들고만들어진 container 를 MySQL에 연결하고자 한다. 0. 일단 Docker 와 MySQL이 다운 받아져 있어야한다.- Docker 와 MYSQL workbench 설치하고 오기 - cmd 창에서 mysql 설치하기.docker pull mysql:8.0 1. Docker 를 통해서 Container 만들기① cmd 창을 킨 후 container 만들어주기- mysql-container 에 쓰고 싶은 이름하면 도미- MYSQL_ROOT_PASSWAORD > root password 입력해주기docker run --name..

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..

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)임- 디태치드 모드란 컨테이너를 실행하겟다는 의미임. 백그라운드에서 컨테이너가 실행..

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