본문 바로가기
728x90
반응형

전체 글313

[React] redux 사용법 이전 포스팅에서 useReducer와 Context를 활용해서 루트에서 관리하는 여러 상태 값을 자식 컴포넌트에서 사용하는 방법에 대해서 알아보았다.https://growth-coder.tistory.com/272 [React] useReducer와 Context로 상태값 관리리액트에서 상태 값을 관리할 때 useState를 사용해서 쉽게 관리할 수 있다. 그런데 만약 관리해야 할 상태 값이 많아진다면 하나씩 useState를 사용하는 방식은 번거로울 수 있다. useState부터 useReducegrowth-coder.tistory.com이번 포스팅에서는 상태 값을 관리할 때 redux를 사용해보려고 한다. 리덕스는 다음과 같이 단방향 구조로 되어있다. 이제 redux에서 상태 값을 변경하는 과정에 대.. 2024. 4. 26.
[React] useReducer와 Context로 상태값 관리 리액트에서 상태 값을 관리할 때 useState를 사용해서 쉽게 관리할 수 있다. 그런데 만약 관리해야 할 상태 값이 많아진다면 하나씩 useState를 사용하는 방식은 번거로울 수 있다. useState부터 useReducer와 Context API를 사용하는 과정을 과목을 선택하고 정원을 조절하는 프로그램을 만들어보면서 이해해보자. useState + 객체 사용 먼저 상태 값을 객체로 정의해서 useState를 사용하는 방식이 있다. import React, {useState} from 'react' function App() { return ( ) } function Subject(){ const [subject, setSubject] = useState({name : "math", students.. 2024. 4. 22.
[html/css/js] 테이블 태그 안에 답글 기능 구현 이번에 유저들의 메시지를 테이블 안에 구현하는 와중에 답글 기능이 필요해서 구현 방법을 정리해보려고 한다. 답글 기능을 구현할 때 메시지들을 단순히 ul 안의 li로 구성한다거나 div로 구현한다면 간단하게 구현할 수 있겠지만 테이블 형식으로 메시지에 대한 정보를 보여줘야 했기 때문에 table을 사용하여 구현하였다. 다음은 내가 구현한 코드이다. table{ border: 1px solid black; border-spacing: 0px; border-radius: 12px; } .hidden{ display: none; } 닉네임 작성 내용 답글 개구리 포스팅 재미있게 봤습니다. 답글 강아지 많은 도움이 되었습니다. 답글 실제로는 데이터를 받아와서 테이블을 동적으로 만들어주지만 이번 포스팅의 목적이 .. 2024. 4. 6.
[Spring/Kotlin] Java와 Kotlin의 의존성 주입 방법 비교 이번에 프로젝트로 코틀린 + 스프링부트를 사용하게 되어서 자바 + 스프링부트와의 차이점을 비교해보려고 한다. 이전에 자바 + 스프링부트에서 의존성 주입 방법들과 그 특징들에 대해서 포스팅을 한 적이 있다. (만약 의존성 주입 방법에 대해 잘 모른다면 아래 포스팅을 참고) https://growth-coder.tistory.com/73 [Spring][스프링 핵심 원리] 의존 관계 주입 방법 및 옵션 처리 본 포스팅은 김영한 강사님의 인프런 강의 "스프링 핵심 원리 - 기본편"을 정리한 포스팅으로 강의 자료에서 사용한 자료를 사용했음을 밝힙니다. https://www.inflearn.com/course/%EC%8A%A4%ED%94%84%EB%A7%81-%E growth-coder.tistory.com 코틀.. 2024. 4. 4.
728x90
반응형