💻/[과제]31 [과제] C Market 상태 관리하기 컴포넌트 구조 Bare minimum requirements - react-router-dom을 이용해 Side Routing하는 방법 복습하기 - useState를 이용해 상태를 사용하는 방법을 학습 - 쇼핑몰 애플리케이션 주요 기능을 구현 → [장바구니 담기] 버튼을 이용해 장바구니에 상품이 추가되도록 구현 → 장바구니 내 [삭제] 버튼을 이용해 장바구니의 상품이 제거되도록 구현 → 장바구니 내에서 각 아이템 개수를 변경할 수 있도록 구현 → 장바구니의 상품 개수의 변동이 생길 때마다, 상단 내비게이션 바에 상품 개수가 업데이트되도록 구현 App.js - 판매 물품 상태인 items와 장바구니 담겨진 물품 상태인 cartItem이 있음 - 하위 컴포넌트들로 내려준다 function App() { //.. 2022. 12. 29. [과제] React Custom Component File Structure / ├── /React Custom Component │ ├── README.md │ ├── /public # create-react-app이 만들어낸 폴더로 yarn/npm start로 실행 시에 쓰입니다 │ └── /src │ ├── /components # 단일 UI React 컴포넌트가 들어가는 폴더 │ ├─── /__test__ # 테스트 케이스가 들어가는 폴더 │ ├─── /AdvancedChallenges # Advanced Challenges 를 위한 폴더 │ ├─── /BareMinimumRequirements # Bare Minimum Requirements 를 위한 폴더 │ ├── /stories # Storybook이 작동하는 데 필요한 파일들이 들어가는 .. 2022. 12. 22. [과제] JSON.stringify Bare Minimum Requirements - stringifyJSON 함수를 직접 구현해 보기 stringifyJSON.js - 재귀 함수를 이용 JSON.Stringify 직접 구현 하기 function stringifyJSON(obj) { //? 객체는 타입 변환을 이용해 String으로 변환 할 경우 객체 내용을 포함하지 않음 // JS에서 객체를 문자열로 변환하기 위해 메서드(msg.toString())이나 형변환(Stirng(msg))을 시도하면 [object Object]리 if(typeof obj ==='boolean' || typeof obj ==='number' || obj === null){ return String(obj) } //? String이 input으로 주어졌을 경우 :.. 2022. 12. 16. [과제] Tree UI Bare Minimum Requirements - fix_me.js에서 createTreeView 함수를 직접 구현하기 fix_me.js (생략) ... // TODO: createTreeView 함수를 재귀(자기 자신을 계속 부르게 함)호출하여 테스트케이스를 통과하세요. //! GOAL: 최종 결과가 resut.html와 같은 모습으로 나와야 합니다. const root = document.getElementById('root'); // TODO: function createTreeView(menu, currentNode) { // base case // : 객체의 key값으로 children이 없는 경우 checkbox, span, ul 없이 li 생성 후 name 값만 넣기 // --> 첫 번째 상.. 2022. 12. 16. [과제] 나만의 아고라 스테이츠 서버 만들기 📎 [링크] https://github.com/codestates-seb/fe-sprint-my-agora-states-server/pull/461 Bare Minimum Requirement my-agora-states-server my-agora-states-server/app.js - [✔️] 모든 Origin, 경로에 대해 CORS 요청을 허용하게 미들웨어를 적용 - [✔️] POST 요청 등에 포함된 body(playload)를 구조화하기 위한 미들웨어를 적용 - [✔️] 서버 상태 확인을 위해 GET/에서 상태코드 200으로 응답 하기 - [✔️] discussionRouter를 이용하여 /discussions 경로로 라우팅 하기 my-agora-states-server/router/discu.. 2022. 12. 11. [과제] StatesAirline Server 목표 - Express 프레임워크를 이용하여 로컬 호스트와 연결 - 서버는 클라이언트의 요청에 따라 항공편과 예약 데이터를 조회, 생성, 수정 그리고 삭제하는 기능 수행 할 수 있어야 함 - Express 프로젝트에서 사용하는 폴더 구조 이해 - Express를 활용하여 API 요청을 처리하는 방법을 실습하며 router, controller가 어떤 역할을 수행하는지 관찰 Getting Started 1. staateariline - stateairline/app.js는 서비스에 필요한 미들웨어와 웹 서버를 실행하는 코드가 작성되어 있음 2. router - stateairline/router/ 안에는 airportAPI, bookAPI, flight API 요청을 수행하는 라우터가 작성되어 있음 - 작.. 2022. 12. 9. 이전 1 2 3 4 5 6 다음
