웹 프레임워크 (Web Framework)15 React Delete 서론2024.12.28 - [Web framework/React] - React Update React Update서론2024.12.27 - [Web framework/React] - React Create React Create서론2024.12.25 - [Web framework/React] - React State React State서론2024.12.24 - [Web framework/React] - React 이벤트 React 이벤트서론2024.12.23 - [Web framework/React] - Rehosunghyun.tistory.com이전 글에서는 Update에 대해서 학습하고 실습한 내용을 정리하였습니다. 이번 글에서는 CRUD의 D 그러니까 Delete 부분을 학습하고 실습한 내용을 .. 2024. 12. 29. React Update 서론2024.12.27 - [Web framework/React] - React Create React Create서론2024.12.25 - [Web framework/React] - React State React State서론2024.12.24 - [Web framework/React] - React 이벤트 React 이벤트서론2024.12.23 - [Web framework/React] - React Prop React Prop서론2024.12.22 - [Web framework/React] - Reacthosunghyun.tistory.com이전 글에서는 CRUD 중에서 C 즉 Create 부분을 정리했습니다. 이번 글에서는 U에 해당하는 Update를 학습하고 실습한 내용을 정리하고자 합니다. .. 2024. 12. 28. React Create 서론2024.12.25 - [Web framework/React] - React State React State서론2024.12.24 - [Web framework/React] - React 이벤트 React 이벤트서론2024.12.23 - [Web framework/React] - React Prop React Prop서론2024.12.22 - [Web framework/React] - React 컴포넌트 (Component) React 컴포넌트 (Component)서론2024.hosunghyun.tistory.com이전 글에서는 state에 대해서 학습하고 실습한 내용을 정리해서 작성했습니다. 이번 글에서는 대부분의 애플리케이션에 존재하는 기능인 CRUD 중에서 C 그러니까 Create에 대해서 학습.. 2024. 12. 27. React State 서론2024.12.24 - [Web framework/React] - React 이벤트 React 이벤트서론2024.12.23 - [Web framework/React] - React Prop React Prop서론2024.12.22 - [Web framework/React] - React 컴포넌트 (Component) React 컴포넌트 (Component)서론2024.12.21 - [Web framework/React] - React 시작하기 React 시작하기서hosunghyun.tistory.com이전 글까지는 React의 이벤트에 대해서 학습하고 실습했습니다. 이번 글에서는 React의 State에 대해서 학습해보고자 합니다. State 란?State는 React 컴포넌트에서 동적 데이터를 관.. 2024. 12. 25. React 이벤트 서론2024.12.23 - [Web framework/React] - React Prop React Prop서론2024.12.22 - [Web framework/React] - React 컴포넌트 (Component) React 컴포넌트 (Component)서론2024.12.21 - [Web framework/React] - React 시작하기 React 시작하기서론 백엔드 개발자 또한 최근에 React를 요구하는hosunghyun.tistory.com이전 글에서는 props를 학습하고 실습하면서 글을 정리하였습니다. 이번에는 React 이벤트라는 내용을 학습하고 실습한 내용을 정리하고자 합니다. React 이벤트란?React 이벤트는 사용자의 입력이나 상호작용(클릭, 입력, 마우스 이동 등)에 따라 .. 2024. 12. 24. React Prop 서론2024.12.22 - [Web framework/React] - React 컴포넌트 (Component) React 컴포넌트 (Component)서론2024.12.21 - [Web framework/React] - React 시작하기 React 시작하기서론 백엔드 개발자 또한 최근에 React를 요구하는 기업이 늘어나고 있는 추새입니다. 이에 React를 공부해보고자 합니다. https://reacthosunghyun.tistory.com이전 글에서는 컴포넌트를 학습하고 실습한 뒤에 글을 정리했습니다. 이번에는 prop를 학습하고 실습하는 글을 정리해보고자 합니다. Prop 란?Props (Properties)는 React 컴포넌트 간에 데이터를 전달하는 방법입니다. 코드에서 위에는 컴포넌트이고 .. 2024. 12. 23. React 컴포넌트 (Component) 서론2024.12.21 - [Web framework/React] - React 시작하기 React 시작하기서론 백엔드 개발자 또한 최근에 React를 요구하는 기업이 늘어나고 있는 추새입니다. 이에 React를 공부해보고자 합니다. https://react.dev/ ReactReact is the library for web and native user interfaces. Build user ihosunghyun.tistory.com이전 글에서 React를 소개하고 설치하는 방법 그리고 수정과 배포를 설명하였습니다. 이번 글에서는 React의 컴포넌트에 대해서 학습하고 정리하고자 합니다. React 컴포넌트(Component)란?React 컴포넌트는 사용자 인터페이스(UI)를 구성하는 독립적이고 재.. 2024. 12. 22. React 시작하기 서론 백엔드 개발자 또한 최근에 React를 요구하는 기업이 늘어나고 있는 추새입니다. 이에 React를 학습해보고자 합니다. https://react.dev/ ReactReact is the library for web and native user interfaces. Build user interfaces out of individual pieces called components written in JavaScript. React is designed to let you seamlessly combine components written by independent people, teams, and organizatireact.devReact란 사용자 인터페이스(UI)를 구축하기 위해 메타(구 페이.. 2024. 12. 21. FastAPI 공부하기 서론FastAPI란 무엇이고 어떻게 사용하는지 간단히 정리하고자 합니다. https://github.com/hosunghyun/Smart_Makeup_Web.git GitHub - hosunghyun/Smart_Makeup_Web: 웹으로 캠을 사용하여 서버로 화장 시뮬레이션을 제공웹으로 캠을 사용하여 서버로 화장 시뮬레이션을 제공. Contribute to hosunghyun/Smart_Makeup_Web development by creating an account on GitHub.github.com 최근에 진행한 Smart MakeUP 프로젝트에서 팀원이 서브 서버로 FastAPI를 사용하여 화장하기 기능을 구현하였습니다. 어느 정도 설명을 들어 FastAPI를 이해하고 있지만 이해하는 것과 아.. 2024. 12. 7. 스프링 부트 컨트롤러 프레젠테이션 계층2024.09.09 - [Web framework/Spring Boot] - 스프링 부트 컨트롤러와 페이지 만들기 스프링 부트 컨트롤러와 페이지 만들기컨트롤러 만들기이 클래스는 main()과 같은 역활을 합니다. 즉 이 클래스에서 스프링 부트가 시작됩니다. 컨트롤러를 만들기위해 site 디렉터리에 MainController.java 파일을 만들어 줍니다. 프레젠테hosunghyun.tistory.com여기서 만든 컨트롤러는 프레젠테이션 계층에 해당합니다. 이제 서비스 계층과 소통할 수 있게 코드를 변경하겠습니다. 비즈니스 계층에서 퍼시스턴스 계층 의존성을 추가한 것처럼 프레젠테이션 계층에도 비즈니스 계층 의존성을 추가하기 위한 @Autowired 어노테이션을 사용합니다. GET 요청으로 .. 2024. 9. 10. 스프링부트 서비스 비즈니스 계층비즈니스 계층을 사용하기 위해 ItemService.java 파일을 생성합니다.서비스 클래스는 Item 엔티티를 관리하는 ItemRepository와 상호작용하여 데이터를 처리합니다. @Service: 이 어노테이션은 해당 클래스가 서비스 레이어의 컴포넌트임을 나타냅니다. @Autowired: 이 어노테이션은 의존성 주입을 나타냅니다. final을 붙인 이유는 itemRepository가 변경될 일이 없기 때문에 final을 붙여줍니다. public List getItemByPage(): 이 메소드는 Item 객체의 리스트를 반환하는 메서드입니다. List page = itemRepository.findAll();: ItemRepository의 findAll() 메서드를 호출하여 모든 Ite.. 2024. 9. 10. 스프링 부트 데이터베이스 데이터베이스ORMORM(Object-Relation Mapping)은 자바의 객체와 데이터베이스를 연결하는 프로그래밍 기법입니다.자바에서 데이터베이스 값을 가져오려면 SQL 언어로 데이터를 꺼내야합니다.하지만 ORM을 사용하면 데이터베이스의 값을 객체처럼 사용할 수 있습니다. 즉 자바로 데이터베이스를 다룰 수 있게하는 도구를 ORM이라고 합니다. JPA와 HibernateDBMS에도 Oracle, MariaDB 등 여러 종류가 존재하듯이 ORM에도 여러 종류가 존재합니다. 자바에서는 JPA(Java Persistence API)를 표준으로 사용합니다. JPA는 자바에서 관계형 데이터베이스를 사용하는 방식을 정의한 인터페이스입니다. 그래서 ORM 프레임워크를 추가로 사용해야합니다. Hibernate는 JP.. 2024. 9. 9. 스프링 부트 컨트롤러와 페이지 만들기 컨트롤러 만들기이 클래스는 main()과 같은 역활을 합니다. 즉 이 클래스에서 스프링 부트가 시작됩니다. 컨트롤러를 만들기위해 site 디렉터리에 MainController.java 파일을 만들어 줍니다. 프레젠테이션 계층처럼 사용하기 위해 클래스 위에 @Controller라는 어노테이션을 작성합니다. @GetMapping 어노테이션은 HTTP에서 GET 요청을 처리하기 위해서 작성하는 메소드입니다. 즉 메소드 안에 작성된 GET 요청이 발생하면 어노테이션된 index() 메소드가 동작하게 됩니다. 메인 페이지이므로 /, /index, /home이 GET 요청이 왔을 때 메인페이지를 동작하도록 작성하였습니다.return "index" 를 하는데 이것은 어느 파일을 실행할 지 반환하는 형식입니다. 즉 i.. 2024. 9. 9. 스프링 부트의 구조 스프링 부트의 계층스프링 부트는 각 계층이 양 옆의 계층과 통신하는 구조입니다. 각 계층은 역활과 책임이 있는 구성요소를 의미합니다. 그리고 각 계층은 계층 간의 통신은 가능하지만 직접 영향을 미치지 않습니다. 프레젠테이션 계층HTTP 요청을 받고 이 요청을 비즈니스 계층으로 전송하는 역활입니다. 즉 컨트롤러가 프레젠테이션 계층의 역활을 합니다. 비즈니스 계층모든 비즈니스 로직을 처리합니다. 즉 서비스를 만들기 위한 로직을 말합니다. 예를 들면 물건을 조회할 때 물건의 개수, 가격 등의 데이터를 처리하기 위한 로직 등을 처리합니다. 즉 서비스가 비즈니스 계층의 역활을 합니다. 퍼시스턴스 계층데이터베이스 관련 로직을 처리합니다. 데이터베이스에 접근하는 DAO(데이터베이스 계층과 상호작용하기 위한 객체) .. 2024. 9. 9. 스프링 부트 시작하기 스프링 부트 실행환경은 vscode 환경에서 설정하였습니다. 개인 환경에 맞게 intellij 혹은 이클립스를 써도 됩니다.vscode에서 처음에 열린 폴더가 없을 때 탐색기를 선택하면 Create Java Project라는 버튼이 보이게 됩니다. 이 버튼을 클릭하면vscode에서 어떤 프로젝트를 만들것인지 선택하는 창이 나타나게 됩니다. 스프링 부트를 설정하기 위해 프로젝트 타입에 Spring Boot를 클릭합니다.빌드 도구로 Gradle을 선택하겠습니다.Spring Boot의 버전을 선택하게 되는데 안정화 버전은 짝수 번호이기 때문에 3.4.2버전을 찾으려 했는데 없어서 3.3.3 버전을 선택하였습니다.언어는 자바로 선태하겠습니다.패키지 이름을 정해야하는데 기본으로 com.example로 하겠습니다... 2024. 8. 25. 이전 1 다음