https://growth-coder.tistory.com/274 [express] express 웹 서버 기초pacakage.json 생성npm init 명령어로 package.json을 만들어준다. package.json에는 프로젝트가 사용 중인 패키지의 정보가 담겨있다.package.json 문서를 통해 패키지를 쉽게 관리할 수 있다. npm init npm init 명growth-coder.tistory.com지난 포스팅에서 Express 기초에 대해 알아보고 mysql 데이터베이스와 연결하여 직접 SQL 쿼리문을 날려 데이터를 조작해보았다. 이번 포스팅에서는 sequelize 패키지를 사용하여 ORM으로 데이터베이스의 데이터에 접근해보려고 한다. 간단하게 Team 테이블과 1:N 관계를 가지고 ..

pacakage.json 생성npm init 명령어로 package.json을 만들어준다. package.json에는 프로젝트가 사용 중인 패키지의 정보가 담겨있다.package.json 문서를 통해 패키지를 쉽게 관리할 수 있다. npm init npm init 명령어를 입력하면 패키지 이름, 정보 등등... 정보를 입력하라고 나오는데 특별히 입력할 정보가 없다면 모두 그냥 넘겨도 된다. 패키지 설치이제 express 웹 서버를 만들 때 유용하게 쓸 수 있는 패키지를 npm install 명령어를 통해 추가해보자. express : express 프레임워크cors : cross origin 관련 설정json : json 파싱body-parser : request body 파싱 (express 버전이 4..

이전 포스팅에서 useReducer와 Context를 활용해서 루트에서 관리하는 여러 상태 값을 자식 컴포넌트에서 사용하는 방법에 대해서 알아보았다.https://growth-coder.tistory.com/272 [React] useReducer와 Context로 상태값 관리리액트에서 상태 값을 관리할 때 useState를 사용해서 쉽게 관리할 수 있다. 그런데 만약 관리해야 할 상태 값이 많아진다면 하나씩 useState를 사용하는 방식은 번거로울 수 있다. useState부터 useReducegrowth-coder.tistory.com이번 포스팅에서는 상태 값을 관리할 때 redux를 사용해보려고 한다. 리덕스는 다음과 같이 단방향 구조로 되어있다. 이제 redux에서 상태 값을 변경하는 과정에 대..

리액트에서 상태 값을 관리할 때 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..

이번에 유저들의 메시지를 테이블 안에 구현하는 와중에 답글 기능이 필요해서 구현 방법을 정리해보려고 한다. 답글 기능을 구현할 때 메시지들을 단순히 ul 안의 li로 구성한다거나 div로 구현한다면 간단하게 구현할 수 있겠지만 테이블 형식으로 메시지에 대한 정보를 보여줘야 했기 때문에 table을 사용하여 구현하였다. 다음은 내가 구현한 코드이다. table{ border: 1px solid black; border-spacing: 0px; border-radius: 12px; } .hidden{ display: none; } 닉네임 작성 내용 답글 개구리 포스팅 재미있게 봤습니다. 답글 강아지 많은 도움이 되었습니다. 답글 실제로는 데이터를 받아와서 테이블을 동적으로 만들어주지만 이번 포스팅의 목적이 ..

이번에 프로젝트로 코틀린 + 스프링부트를 사용하게 되어서 자바 + 스프링부트와의 차이점을 비교해보려고 한다. 이전에 자바 + 스프링부트에서 의존성 주입 방법들과 그 특징들에 대해서 포스팅을 한 적이 있다. (만약 의존성 주입 방법에 대해 잘 모른다면 아래 포스팅을 참고) 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 코틀..