yevdev◡̈

사실 이번 한이음 프로젝트에서는 프론트와 백을 동시에 4명이서 배워보자는 취지였기에, 폴더 구성 및 컴포넌트 설계 방식을 정하고 개발을 시작하기 보다는 그냥 구현할 곳을 분배하고 구현하기에 바빴던 것 같다. 어느정도 웹사이트 구현을 마치고, 오늘(2021/09/25) 멘토님과의 미팅에서 이제껏 작성한 코드와 폴더를 살펴보다가 멘토님이 이부분에 대해 이야기를 시작하셨다. 1️⃣ 폴더 구조 실제 현업에서의 리액트 폴더 구조는 다음과 같이 구성한다고 한다. 📁components : 컴포넌트 파일들이 위치하는 폴더 📁adapter : xhr(axios) + socket + websocket 등 📁store : redux 작업을 위한 폴더, 내부에 actions, reducers 폴더 존재 📁hooks : "us..

일단 구현해야하는 화면부터 봐보자! 사진에서 보다시피, drop down 버튼을 누르면 TEAM1의 학생들, TEAM2의 학생들이 팀목록 안에 들어와야 한다! 그리고 이 데이터들은, 이런 형태! 일단 컴포넌트는 두개로 구성되어있다. P07_05.js : Select-Box의 값을 이벤트 객체로 받기 -> TeamList에 team 배열 전달하기 P07_TeamList.js : P07_05.js 로부터 props로 해당 team 배열 받아오고 그 안에 학생들 map으로 돌려서 보여주기 어떻게 구현했는지는 코드로 설명 P07_05.js 코드는 다음과 같다. import React, { useState } from "react"; import { useTeams } from "../../../component..