프로젝트5 [TO-DO-App] 투두앱을 만들어보자 by React - 03. 할일 추가 기능 구현 AddTodo 컴포넌트를 통해 할일을 추가하는 기능을 구현해보자. 지난시간에 TodoList 컴포넌트를 통해 할일목록을 저장하는 기능을 구현하였고, 이번에는 새로운 목록을 추가해보겠습니다 AddTodo 컴포넌트에 handleAdd라는 콜백함수로 등록한다. handleAdd 는 기존 할일목록을 업데이트하는 기능을 합니다 함수를 props로 child component로 넘기는 방법은 아래글에 자세히 설명되어있다. 참고: https://legacy.reactjs.org/docs/faq-functions.html ---- 그리고 이제 AddTodo로 넘어갑니다 form 태그를 사용해서 할일목록을 추가하는 방식으로 해보겠습니다. input type은 text로, placeholder 는 할일을 여기에 쓰라고 유.. 2023. 8. 10. [TO-DO-App] 투두앱을 만들어보자 by React - 02. 할일 목록 저장 TodoList 컴포넌트 구현 - 리액트는 컴포넌트를 결합하여 만들어진다. 이 앱의 메인 컴포넌트인 를 만들어보자 코드의 주요 특징은 다음과 같다 - 컴포넌트를 선언하는 export default function 을 통해 선언. - useState를 통하여 상태를 정의하고 그것을 설정하는 함수인 setTodos를 가지고 있는 map을 선언. - todos에 모든 할일 목록을 가지고 있음 - id는 UUID를 통해서 랜덤화 시키고, 실제 할일은 text라는 prop에 넣는다 - 활성 상태 여부를 status라는 prop으로 선언. - handleAdd라는 함수로 추가하는 로직을 만들고 그 과정에서 useState의 setTodos를 사용 - AddTodo 라는 컴포넌트를 선언하고 추가 기능을 구현한다. (.. 2023. 8. 6. [TO-DO-App] 투두앱을 만들어보자 by React - 01. 기능 요구사항 정의 간단하게 할일을 관리하는 투두앱을 리액트로 만들어보자. 1. 기능 요구사항 - 전체아이템 보여주기 - 아이템 추가 - 아이템 삭제 - 아이템 체크박스 - 아이템 필터링(활성, 완료등) - 다크모드 지원 전체 코드는 아래 깃헙에서 보실 수 있습니다! https://github.com/jhshim0131/todo-app 2023. 8. 6. [MSA SaaS 서비스] Kubernetes 클러스터 생성 MSA 서비스를 하기위한 EKS 클러스터를 생성한다. *EKS 클러스터는 AWS에서 제공하는 서버리스 기반 서비스이다. AWS 콘솔 로그인 후, EKS 서비스 메뉴를 선택. 클러스터를 추가 버튼의 생성을 선택. 구성하고자 하는 클러스터 정보를 입력한다. 이 때 role이 없다면 role을 생성한다. (role생성에 대한 설명 - https://docs.aws.amazon.com/eks/latest/userguide/service_IAM_role.html#create-service-role) 클러스터 생성은 4단계로 구성된다. 우선 클러스터 구성이다. role 생성은 IAM 메뉴에서 진행 가능. 역할만들기를 눌러서 들어가면, EKS 서비스 사례를 선택하고 EKS - Cluster를 선택하면 해당 사례에 맞.. 2022. 6. 21. 이전 1 2 다음