완성 https://github.com/Jiwonp12/fe-sprint-coz-shopping GitHub - Jiwonp12/fe-sprint-coz-shopping Contribute to Jiwonp12/fe-sprint-coz-shopping development by creating an account on GitHub. github.com 폴더구조 fe-sprint-coz-shopping │ ├─ package-lock.json ├─ package.json ├─ public │ ├─ favicon.ico │ ├─ index.html │ ├─ manifest.json │ └─ robots.txt ├─ README.md └─ src ├─ App.css ├─ App.js ├─ assets │ ├─..

import React, { useState, useEffect, useRef } from "react"; import Item from "../components/items/Item"; import classes from "./BookmarkPage.module.css"; import Category from "./../components/UI/Category"; import Error from "../components/items/Error"; import img1 from "../assets/img1.png"; import img2 from "../assets/img2.png"; import img3 from "../assets/img3.png"; import img4 from "../assets/..

Modal.js 컴포넌트 생성 더보기 import React from "react"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { faStar } from "@fortawesome/free-solid-svg-icons"; import { faX } from "@fortawesome/free-solid-svg-icons"; import classes from "./Modal.module.css"; const Modal = ({ imageUrl, handleModalClose, isBookmarked, handleBookmark, title, }) => { const handleOverlayClick = event =>..

파일 구조 App.js 에서 Header.js, className = "main", Footer.js 가 있음. className = "main" 에는 MainPage.js, ItemListPage.js, BookmarkPage.js 각각 경로설정. MainPage.js 에서 최대 아이템4개를 렌더링해주는 MainListItems.js , 북마킹된 아이템 최대 4개를 렌더링해주는 MainBookmarkItems.js 가 있음. 모든 아이템들은 Items.js 를 통해 렌더링. App.js 더보기 import { useState } from "react"; import { Routes, Route } from "react-router-dom"; import Header from "./pages/Header..

Section2 Keep + Section3 시간을 공부에 최대한 투자하기 매일 한 가지 이상 알고리즘 문제 풀기 미니 프로젝트 꾸준히 만들기 코드 작성 시 생긴 문제점을 작성하고 어떻게 해결했는지 작성하기 공부에 최대까지는 투자하지 못함. 미니 프로젝트 이제 다시 시작. 문제점 작성한 적 없음. Section2 Problem + Section3 에러를 바로잡는 과정을 제대로 기록하지 못했다. + 결과에만 신경을 쓰는 경향이 있다. 과정을 제대로 이해하고 넘어가는 습관을 가져야겠다. 과정에 소홀했음. Section2 Try 컨디션 조절을 위해서 간단한 운동을 해야 할 것 같다. 이번 섹션 2에서 잠에 지는 경우가 많았는데, 정신줄을 붙잡고 섹션 3에서는 집중된 모습을 보일 것이다. 에러가 발생했을 때의 ..

재귀 재귀를 활용하기 좋은 상황은 언제인지 예시를 들어 설명해 주세요. 재귀는 자신을 다시 호출하는 함수를 만들어 문제를 해결하는 방식입니다. 재귀를 활용하기 좋은 경우는 문제를 작은 조각으로 나누어 해결하는 작은 함수를 만들 수 있을 때입니다. 이는 일반적으로 반복문을 사용하기 어려운 문제에 적합하며, 작은 문제들이 서로 비슷한 구조를 가지고 있는 경우에 사용됩니다. 재귀는 종료 조건을 반드시 설정해야하며, 재귀 호출이 너무 많으면 스택 오버플로우가 발생할 수 있습니다. UI/UX UI, UX의 개념과 두 개념의 관계에 대해서 설명해 주세요. UI는 인터페이스 디자인에 중점을 두어 사용자가 쉽게 이해하고 사용할 수 있도록 설계하며, UX는 사용자가 제품이나 서비스를 사용하는 과정에서 느끼는 경험에 중점..

https://nextjs.org/docs/app/building-your-application/styling Building Your Application: Styling | Next.js Using App Router Features available in /app nextjs.org 위 문서에 대한 번역을 진행합니다. 번역시점은 2023-05-08로 공식문서의 추가적인 업데이트가 있을 수 있습니다. 번역기와 챗지피티에 의존해서 번역하고 있습니다. (오역이 발생할 수 있습니다) 한글로 번역하는 것이 더 어색한 단어의 경우 원문을 먼저 표기하겠습니다. Styling Next.js는 다음과 같은 다양한 애플리케이션 스타일 지정 방법을 지원합니다: - 글로벌 CSS: 사용이 간편하고 기존 CSS에 익숙한 ..

https://nextjs.org/docs/app/building-your-application/styling/sass Styling: Sass | Next.js Using App Router Features available in /app nextjs.org 위 문서에 대한 번역을 진행합니다. 번역시점은 2023-05-05로 공식문서의 추가적인 업데이트가 있을 수 있습니다. 번역기와 챗지피티에 의존해서 번역하고 있습니다. (오역이 발생할 수 있습니다) 한글로 번역하는 것이 더 어색한 단어의 경우 원문을 먼저 표기하겠습니다. Sass Next.js는 .scss 및 .sass 확장자를 모두 사용하여 내장된 Sass 지원 기능을 제공합니다. CSS 모듈을 통해 컴포넌트 수준의 Sass를 사용할 수 있으며, ..