Sintory의 웹 개발 블로그

컨트롤러에서 폼 데이터를 받기 위해서는 DTO(Data Transfer Object)에 담아 받는다. 웹페이지 만드는 순서에 대해서 얘기를 해보겠다. 1. 뷰 페이지를 만든다.- Form 태그의 action 속성으로 데이터를 어디보낼지 결정하고- method 설정으로 어떻게 보낼지 정의할 수 있다. (get or post)2. 컨트롤러를 만든다.- PostMapping 방식으로 URL 주소를 연결한다.3. 전송받은 데이터를 담아둘 객체인 DTO를 생성한다.4. 컨트롤러에서 폼 데이터를 전송받아서 해당 데이터를 DTO에 담는다.   1. 뷰페이지를 만든다.{{>layouts/header}} 제목 게시물 작성 submit {{>l..

뷰 템플릿과 MVC 패턴 뷰 템플릿은 여러사용자를 위해서 여러개의 View를 만드는 것이 아닌, View를 하나의 Template로 만들고 여기에 변수를 삽입하는 식으로 보여주기 위한 기술이다.즉, 웹페이지(View)를 하나의 틀(Templete)로 만들고 여기에 변수를 삽입해 서로 다른 페이지를 보여주기 위함이다.  Spirng Boot에서는 뷰 템플릿을 만드는 도구로 Mustache(머스테치)라는 도구가 있다.뷰 템플릿을 실행하기 위해서는 역할을 분담하기 위한 동작 기법인 MVC 패턴을 알아야한다.화면을 담당하는 View 에는 컨트롤러와 모델이라는 두 개념이 있다.Controller는 클라이언트의 요청에 따라 서버를 처리하는 역할.Model은 데이터를 관리하는 역할이다.화면을 보여주고(View) 클라..

현재 까지 했던 부분은 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..

찾을 때마다 귀찮아서 언제 취득했는지 올리겠음. 0. 표로 정리자격증취득일SQLD22.9ADSP23.9정보처리기사23.11빅데이터분석기사24.07지식재산능력시험24.051. 빅분기, ADSP, SQLD 2. 정보처리기사  3. 필요없긴 하지만,, 지식재산능력 3급.

1. JSX란JSX 가 무엇이냐? 하면 JavaScript 확장 문법으로 React “엘리먼트(element)” 를 생성함.const element = Hello, world!; HTML과 유사한 구문을 JavaScript에서 사용하여 UI를 작성함. React에서는 본질적으로 렌더링 로직이 UI로직과 연결됨. > react는 별도의 파일에 마크업과 로직을 넣어 기술을 인위적으로 분리하나 둘다 포함하는 컴포넌트라고 부르는 느슨하게 연결된 유닛으로 Separation of concerns함.const name = 'Josh Perez'; // name을 josh perez로 선언.const element = Hello, {name}; // 그후 element 에 name을 넣을 수 있음.이거를 타입 스크립..

1. 상황환경 설정 과정 중 에러가 발생했다.윈도우 cmd 에서tsc -v가 먹히지 않는 것.오류 출력 메시지도 안 뜨고, 어떠한 메시지도 안 뜸. 버전 확인이 불가능. 관리자권환으로 실행했으나, 그것도 불통. 그래도  where 쳐보니 node 파일에 설치는되어있음.where tsc //cmdwhere.exe tsc //powershell 요약하자면,1. tsc 버전이 확인이 안됨. / powershell, cmd, git bash 까지 다 먹통  > npm, node 버전은 확인이 잘 됨.2. 여기서 더 나아가 creat-react-app 도 안됨. my-app(react) 폴더가 생성 안됨. 2. 원인 분석- 여러가지 원인이 있으나, 필자의 경우 node.js 의 버전 이슈였다.- 최신 버전일 경우..

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