Skip to content

[김지희] 스프린트미션 2 #23

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Jul 28, 2025
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions 4-sprint-mission
Submodule 4-sprint-mission added at 9177be
59 changes: 59 additions & 0 deletions ArticleService.js
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

오류가 발생했을 경우, 모두 "오류 발생" 이라는 똑같은 문구가 나오는 것 같아요
이 부분을 각 함수에 맞춰서 적절한 오류 메시지를 노출 시키는건 어떨까요 ?

Original file line number Diff line number Diff line change
@@ -0,0 +1,59 @@
import axios from 'axios';
const instance = axios.create({
baseURL: 'https://panda-market-api-crud.vercel.app'
});
Comment on lines +2 to +4
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

axios 의 create를 통해 instance를 기본적으로 만들어 내다니요 !
감탄했습니다 너무 좋은 코드를 보여주는 단 3줄이네요 ! 👍🏼

export class Article {
#likeCount;

constructor(title, content, writer, likeCount = 0, createdAt = new Date()) {
this.title = title;
this.writer = writer;
this.#likeCount = likeCount;
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

likeCount 를 받을때 음수 체크를 해보면 더 안정적인 코드가 작성 될 것 같아요 !

if (likeCount < 0) {
  throw ...
}

this.content = content;
this.createdAt = createdAt;
Comment on lines +9 to +13
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

다른 변수들도 # 를 통해서 private 하여 캡슐화/추상화 를 진행해보는건 어떨까요 !

}
getLikeCount(){
return this.#likeCount;
}

like() {
this.#likeCount += 1
return this.likeCount;
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

해당 부분에 return this.#likeCount 가 되어야 할 것 같습니다 !

}
}
Comment on lines +5 to +23
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Article 클래스를 Service 안에 녹이기보다는 따로 분리하여 import 하는건 어떨까요 !


export async function getArticlelist (params ={}){
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

params 를 선언한김에, 디폴트 값들을 선언했다면 더 좋았을 것 같아요 !

const {page, pageSize, keyword} = params;
const res = instance.get(`/articles`,{params : {page, pageSize, keyword}})
.then((value)=>{return value.data })
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

성공한 case에도 2xx 인지 아닌지를 체크해보면 더 안정적인 코드가 나올 것 같아요 !

.catch (error =>{ console.log('오류 발생!')});
Comment on lines +26 to +29
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

어떨때는 { 옆에 바로 글자가 오고, 어떨때는 한칸 띄어진것같아요! 통일된 코드스타일을 적용해보면 더 좋을 것 같습니다 !

return res;
}

export async function getArticle(id){
const res = instance.get(`/articles/${id}`)
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

template literal 을 적절하게 사용했네요 ! 👍🏼

.then (response => {return response.data})
.catch (error => {console.log('오류발생!');});
return res;
}

export async function createArticle(articleBody){
const res = instance. post(`/articles`,articleBody)
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

instance.post 이렇게 붙여쓰는게 더 좋을 것 같네요 !

.then (response => {return response.data})
.catch (error => {console.log('오류발생')});
return res;
}

export async function patchArticle (id, ArticleListType){
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ArticleListType 이 적절한 변수명이 아닌 듯합니다!
적절한 변수명은 가독성에 아주 중요한 역할을 하므로 변수명에 조금 더 신경을 써보면 좋을 것 같아요 !

const res = instance. patch(`/articles/${id}`,ArticleListType)
.then (response => {return response.data})
.catch(error => {console.log ('오류발생')});
return res;
}

export async function deleteArticle(id){
const res = instance. delete('/articles/${id}')
.then (response => {return response.data})
.catch(error => {console.log ('오류발생!');});
return res;
}
97 changes: 97 additions & 0 deletions ProductService.js
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

이 부분도 ProductService와 같은 리뷰들이 남겨집니다 !

Original file line number Diff line number Diff line change
@@ -0,0 +1,97 @@
import axios from 'axios';
const instance = axios.create({
baseURL: 'https://panda-market-api-crud.vercel.app'
});
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

여기서는 fetch를 한번 써보는건 어땠을까요 ! (공부할겸!)


export class Product {
#price;
#favoriteCount;

constructor(id, name, description, price, tags, images, favoriteCount = 0, createdAt, updatedAt) {
this.id = id;
this.name = name;
this.description = description;
this.#price = price;
this.tags = tags;
this.images = images;
this.#favoriteCount = favoriteCount;
this.createdAt = createdAt;
this.updatedAt = updatedAt;
}
getPrice (){
return this.#price;
}

getFavoriteCount (){
return this.#favoriteCount;
}
favorite() {
return this.#favoriteCount += 1;
}
}

export class ElectronicProduct extends Product {
constructor(id, name, description, price, manufacturer, tags, images, createdAt, updatedAt) {
super(id, name, description, price, tags, images, createdAt, updatedAt);
this.manufacturer = manufacturer;
}
}



export async function getProductlist(params = {}){
try{
const {page, pageSize, keyword} = params;
const response = await instance.get('/products', {params: {page, pageSize, keyword}});
return response.data;
} catch (error){
if(error){
console.error('오류발생!')
throw error;
}
}
}

export async function getProduct(id){
try{
const response = await instance.get('/products/${id}')
return response. data;
} catch (error){
console.error (`오류 발생`);
throw error;
}
}

export async function createProduct(){
try{
const {name, description, price, tags, images} = productListInfo;
const response = await instance.post('/products', productListInfo);
return response.data;
} catch (error){
console.error('오류 발생!')
throw error;
}
}


export async function patchProduct(id, productListInfo){
try{
const response = await instance.patch('/products/${id}', productListInfo);
return response.data;
} catch (error){
console.error('오류 발생!');
throw error;
}
}


export async function deleteProduct(id){
try{
const response = await instance.delete('/products/${id}');
return response.data;
} catch (error){
console.log('오류발생!');
throw error;
}
}

3 changes: 3 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
## Sprintmission 2
### API 리퀘스트 보내는 코드 구현
### Git과 Github 활용하기
22 changes: 22 additions & 0 deletions main.mjs
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
import axios from 'axios';
import * as Productfile from './ProductService.js'
import * as Articlefile from './ArticleService.js'


function checkData() {
const products = [];
const responseData = Productfile.getProductlist();
const objs= responseData.list;
objs.forEach((data)=>{
if(data.tags.includes('전자제품')){
const isElectronicProduct = new EletronicProduct(id, name, description, price, manufacturer, tag, images, createdAt, updatedAt);
products.push(isElectronicProduct);
} else{
const isNotElectioncProduct = new Product (id, name, description, price, tag, images, createdAt, updatedAt);
products.push(isNotElectioncProduct)
}
}
)}