Skip to content

Commit

Permalink
Merge pull request #253 from jangyonghan/React-장용한-sprint8
Browse files Browse the repository at this point in the history
[장용한]sprint8
  • Loading branch information
wlgns2223 authored Aug 5, 2024
2 parents a73f735 + 24f2460 commit 94884e2
Show file tree
Hide file tree
Showing 35 changed files with 3,036 additions and 2,628 deletions.
23 changes: 23 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -21,3 +21,26 @@
npm-debug.log*
yarn-debug.log*
yarn-error.log*
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.

# dependencies
/node_modules
/.pnp
.pnp.js

# testing
/coverage

# production
/build

# misc
.DS_Store
.env.local
.env.development.local
.env.test.local
.env.production.local

npm-debug.log*
yarn-debug.log*
yarn-error.log*
File renamed without changes.
5,094 changes: 2,609 additions & 2,485 deletions package-lock.json

Large diffs are not rendered by default.

15 changes: 9 additions & 6 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,17 +1,20 @@
{
"name": "1-weekly-mission",
"name": "mission",
"version": "0.1.0",
"private": true,
"dependencies": {
"@testing-library/jest-dom": "^5.17.0",
"@testing-library/react": "^13.4.0",
"@testing-library/user-event": "^13.5.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-router-dom": "^6.23.1",
"@types/jest": "^27.5.2",
"@types/node": "^16.18.104",
"@types/react": "^18.3.3",
"@types/react-dom": "^18.3.0",
"react": "^18.3.1",
"react-dom": "^18.3.1",
"react-router-dom": "^6.25.1",
"react-scripts": "5.0.1",
"react-slick": "^0.30.2",
"slick-carousel": "^1.8.1",
"typescript": "^4.9.5",
"web-vitals": "^2.1.4"
},
"scripts": {
Expand Down
25 changes: 25 additions & 0 deletions public/manifest.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
{
"short_name": "React App",
"name": "Create React App Sample",
"icons": [
{
"src": "favicon.ico",
"sizes": "64x64 32x32 24x24 16x16",
"type": "image/x-icon"
},
{
"src": "logo192.png",
"type": "image/png",
"sizes": "192x192"
},
{
"src": "logo512.png",
"type": "image/png",
"sizes": "512x512"
}
],
"start_url": ".",
"display": "standalone",
"theme_color": "#000000",
"background_color": "#ffffff"
}
3 changes: 3 additions & 0 deletions public/robots.txt
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
# https://www.robotstxt.org/robotstxt.html
User-agent: *
Disallow:
19 changes: 18 additions & 1 deletion src/API/CommentsAPI.js → src/API/CommentsAPI.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,21 @@
export async function getComments(productId = 9, limit = 5) {
interface comment {
id: number;
name: string;
content: string;
createdAt: string;
images: string;
nickname: string;
updatedAt: number;
}

interface commentList {
list: comment[];
}

export async function getComments(
productId = 9,
limit = 5
): Promise<commentList> {
const path = `/products/${productId}/comments?`;
const query = `limit=${limit}`;
const response = await fetch(
Expand Down
11 changes: 0 additions & 11 deletions src/API/ItemAPI.js

This file was deleted.

29 changes: 29 additions & 0 deletions src/API/ItemAPI.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
interface Produect {
id: number;
name: string;
price: number;
description: string;
images: string;
createdAt: string;
favoriteCount: number;
tags: string;
}

interface ProduectList {
list: Produect[];
}

export async function getProducts(
pageSize = 10,
orderBy = "recent"
): Promise<ProduectList> {
const query = `pageSize=${pageSize}&orderBy=${orderBy}`;
const response = await fetch(
`https://panda-market-api.vercel.app/products?${query}`
);
if (!response.ok) {
throw new Error("제품을 불러오는데 실패했습니다");
}
const result = await response.json();
return result;
}
14 changes: 7 additions & 7 deletions src/App.js
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
import { BrowserRouter, Route, Routes } from "react-router-dom";
import Header from "./Layout/Header.jsx";
import HomePage from "./pages/HomePage/HomePage.jsx";
import AddItemPage from "./pages/AddItemPage/AddItemPage.jsx";
import MarketPage from "./pages/MarketPage/MarketPage.jsx";
import ProductDetail from "./pages/MarketPage/components/ProductDetail.jsx";
import { React } from "react";
import { ItemProvider } from "../src/context/ItemContext.jsx";
import Header from "./Layout/Header.tsx";
import HomePage from "./pages/HomePage/HomePage.tsx";
import AddItemPage from "./pages/AddItemPage/AddItemPage.tsx";
import MarketPage from "./pages/MarketPage/MarketPage.tsx";
import ProductDetail from "./pages/MarketPage/components/ProductDetail.tsx";

import { ItemProvider } from "../src/context/ItemContext.tsx";

function App() {
return (
Expand Down
11 changes: 7 additions & 4 deletions src/Layout/Header.jsx → src/Layout/Header.tsx
Original file line number Diff line number Diff line change
@@ -1,16 +1,19 @@
import React from "react";
import Logo from "../images/logo/logo.svg";
import "./Header.css";
import { NavLink, useLocation } from "react-router-dom";

export function getLinkStyle({ isActive }) {
interface GetLinkStyleProps {
isActive: boolean;
}

export function getLinkStyle({ isActive }: GetLinkStyleProps) {
return {
color: isActive ? "#3692ff" : "",
textDecoration: isActive ? "none" : "",
};
}

function Header() {
const Header = () => {
const location = useLocation();

return (
Expand Down Expand Up @@ -38,6 +41,6 @@ function Header() {
<div className="loginbutton">로그인</div>
</header>
);
}
};

export default Header;
20 changes: 7 additions & 13 deletions src/Layout/UI/Carousel.jsx → src/Layout/UI/Carousel.tsx
Original file line number Diff line number Diff line change
@@ -1,19 +1,13 @@
import React from "react";
import { ReactComponent as LeftArrow } from "../../images/icons/arrow_left.svg";
import { ReactComponent as RightArrow } from "../../images/icons/arrow_right.svg";



function PaginationBar () {

return(
<div>
<LeftArrow/>
<RightArrow/>
</div>

);
function PaginationBar() {
return (
<div>
<LeftArrow />
<RightArrow />
</div>
);
}

export default PaginationBar;

21 changes: 14 additions & 7 deletions src/Layout/UI/FileInput.jsx → src/Layout/UI/FileInput.tsx
Original file line number Diff line number Diff line change
@@ -1,13 +1,20 @@
import { useEffect, useRef, useState } from "react";
import { ChangeEvent, useEffect, useRef, useState } from "react";
import "./FileInput.css";
import xbutton from "../../images/icons/ic_X.svg";

function FileInput({ name, value, onChange }) {
const [preview, setPreview] = useState();
const inputRef = useRef();
interface FileInputProps {
id: string;
name: string;
value: File | null;
onChange: (name: string, file: File | null) => void;
}

function FileInput({ name, value, onChange }: FileInputProps) {
const [preview, setPreview] = useState<string>();
const inputRef = useRef<HTMLInputElement>(null);

const handleChange = (e) => {
const nextValue = e.target.files[0];
const handleChange = (e: ChangeEvent<HTMLInputElement>) => {
const nextValue = e.target.files ? e.target.files[0] : null;
onChange(name, nextValue);
};

Expand All @@ -26,7 +33,7 @@ function FileInput({ name, value, onChange }) {
setPreview(nextPreview);

return () => {
setPreview();
setPreview(undefined);
URL.revokeObjectURL(nextPreview);
};
}, [value]);
Expand Down
20 changes: 0 additions & 20 deletions src/Layout/UI/SearchBar.jsx

This file was deleted.

18 changes: 18 additions & 0 deletions src/Layout/UI/SearchBar.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
interface DropdownListProps {
onSortSelection: (type: string) => void;
}

const DropdownList = ({ onSortSelection }: DropdownListProps) => {
return (
<div className="dropdownList">
<div className="dropdownItem" onClick={() => onSortSelection("recent")}>
최신순
</div>
<div className="dropdownItem" onClick={() => onSortSelection("favorite")}>
인기순
</div>
</div>
);
};

export default DropdownList;
24 changes: 0 additions & 24 deletions src/context/ItemContext.jsx

This file was deleted.

39 changes: 39 additions & 0 deletions src/context/ItemContext.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
import React, { createContext, useState, useEffect, ReactNode } from "react";
import { getProducts } from "../API/ItemAPI";

interface Product {
id: number;
name: string;
price: number;
description: string;
images: string;
createdAt: string;
favoriteCount: number;
tags: string;
}

interface ItemProviderPropt {
children: ReactNode;
}

export const ItemContext = createContext<Product[]>([]);

export const ItemProvider: React.FC<ItemProviderPropt> = ({ children }) => {
const [itemList, setItemList] = useState<Product[]>([]);

useEffect(() => {
const fetchAndProcessData = async () => {
try {
const data = await getProducts();
setItemList(data.list);
} catch (error) {
console.error("데이터를 가져오지 못했습니다", error);
}
};
fetchAndProcessData();
}, []);

return (
<ItemContext.Provider value={itemList}>{children}</ItemContext.Provider>
);
};
Loading

0 comments on commit 94884e2

Please sign in to comment.