프런트엔드 JavaScript 리뷰프로그래밍 교육

프런트엔드 프로젝트를 위한 JavaScript 코드 리뷰

납품 1일부터수정 포함품질 검수
패키지
안전 결제자세히
  • 패키지 범위 내 수정은 무료입니다.
  • 납품 후 3일 이내에 응답하지 않으면 작업이 자동으로 승인됩니다.
주문하기 · ₩50,500

결제 시 금액이 예치되며, 작업을 승인해야만 지급됩니다.

프런트엔드 프로젝트를 위한 JavaScript 코드 리뷰

결과물 예시

스탠다드 패키지 예시

코드 리뷰: 소규모 온라인 쇼핑몰의 주문 가져오기 파이썬 스크립트

코드가 하는 일

  1. 쇼핑몰에서 내보낸 orders.csv를 읽습니다.
  2. 주문 줄마다 stock.xlsx에서 SKU로 상품을 찾아 수량을 뺍니다.
  3. 바뀐 재고를 다시 저장하고 합계를 import_log.txt에 기록합니다.

구조가 명확하고 함수 이름도 잘 지어져 있습니다. 문제 대부분은 스크립트가 예상하지 못한 형태의 입력이 들어올 때 생깁니다.

버그와 취약점

번호줄심각도내용
148높음같은 CSV를 두 번 가져올 수 있음. 이미 처리한 주문 번호를 확인하지 않음. 재고가 마이너스가 되는 가장 유력한 원인
272높음환불 주문의 빈 값이나 "2.0" 같은 값에서 int(row["qty"])가 오류로 멈춤
395중간SKU 비교가 대소문자를 구분해서 "gt-101"과 "GT-101"을 다른 상품으로 처리
4130중간encoding="utf-8" 없이 파일을 열어 윈도우에서 한글 상품명이 깨짐
5201낮음맨 except:가 실제 오류를 숨겨 로그가 쓸모없어짐

수정 코드(일부)

문제 1: 이미 가져온 주문 건너뛰기

processed = load_processed_ids("processed_orders.txt")
for row in reader:
    if row["order_id"] in processed:
        continue
    # ... 기존 처리 로직 ...
    processed.add(row["order_id"])
save_processed_ids("processed_orders.txt", processed)

이유: 같은 파일로 스크립트를 다시 실행해도 주문은 한 번만 반영됩니다.

문제 2: 수량을 안전하게 읽기

raw = (row.get("qty") or "").strip()
try:
    qty = int(float(raw))
except ValueError:
    log.warning("주문 %s: 잘못된 수량 %r, 건너뜀", row["order_id"], raw)
    continue

이유: 환불이나 부분 취소 줄은 전체 작업을 멈추지 않고, 알아보기 쉬운 기록을 남긴 채 건너뜁니다.

문제 3: SKU 정규화

sku = row["sku"].strip().upper()

재고 딕셔너리를 만들 때도 같은 .strip().upper()를 적용하세요.

스타일과 가독성

  • process()가 90줄입니다. read_orders, apply_to_stock, write_report로 나누세요.
  • row[7]처럼 숫자로 적은 열 번호는 헤더 이름으로 바꾸세요.

꼭 확인하세요: 각 수정 사항은 파일 사본으로 먼저 테스트하세요. 이번 리뷰는 코드를 읽고 진행했으며 실행은 하지 않았습니다.

의뢰인: 차 전문 쇼핑몰 운영자. 쇼핑몰에서 내려받은 주문 CSV를 재고 시트에 반영하는 310줄짜리 파이썬 스크립트를 직접 작성 문의 내용: "가끔 재고가 마이너스가 되고, 어떤 파일에서는 스크립트가 멈춰요."

고객과 모든 정보는 가상입니다.

서비스 소개

프런트엔드 JavaScript는 조용히 실패합니다. 두 번 추가된 이벤트 리스너, 오류 처리 없는 fetch 호출, 잘못된 값을 통과시키는 == 비교, 전역 범위로 새어 나가는 변수 같은 것들입니다. 스크립트를 읽고 페이지가 로드될 때와 사용자가 클릭할 때 무엇이 실행되는지 설명하며, 버그와 취약한 부분을 표시해 드립니다. 수정안은 최신 JavaScript로 작성한 수정 코드 조각으로 드리며, 왜 더 안전한지 메모를 달아 드립니다.

포함 사항

  • 제공 내용주문 페이지에 서면 리뷰를 드립니다. 코드가 실행되는 순서, 중요도순 문제 목록, let과 const, async와 await, 명확한 이벤트 처리를 사용한 수정 코드 조각이 포함됩니다. 프리미엄에서는 무엇부터 구조를 바꿀지 짧은 계획도 드립니다.
  • 콘솔 오류 설명메시지의 실제 의미
  • 이벤트와 DOM리스너, 선택자, 실행 시점
  • 비동기 코드Promise, fetch, 오류 처리
  • 최신 문법let과 const, ===, 모듈
  • 수정 코드 조각변경마다 메모 포함

진행 방식

  1. 1
    요청 사항스크립트와 콘솔 오류를 붙여 넣어 주세요
  2. 2
    분석무엇이 언제 실행되는지 추적합니다
  3. 3
    검토문제 목록과 수정 코드를 받으세요

준비해 주실 내용

텍스트나 스크린샷으로 붙여 넣은 JavaScript와 관련 HTML, 오류가 나는 브라우저, 원래 일어나야 할 동작, 브라우저 콘솔의 오류를 보내 주세요.

다음 내용을 여쭤봅니다:

  • 순수 JavaScript를 사용하시나요, 라이브러리를 사용하시나요?
  • 어느 브라우저에서 문제가 나타나나요?
  • 페이지에서 무엇이 일어나야 하며, 실제로는 어떻게 되나요?
  • 브라우저 콘솔에 오류가 있나요?

패키지 비교

패키지베이직최대 100줄의 스크립트₩21,700스탠다드최대 400줄의 프런트엔드 코드₩50,500프리미엄최대 1,000줄과 정리 계획₩99,500
작업 기간1일2일3일
수정 횟수123
코드 줄 수최대 100개최대 400개최대 1,000개
수정 코드 조각포함포함포함
정리 계획미포함미포함포함
주문하기 베이직주문하기 스탠다드주문하기 프리미엄

안전 결제

주문할 때 결제하지만, 대금은 승인된 작업에 대해서만 지급됩니다.

  • 고정 가격결제 후에는 패키지 가격이 변경되지 않습니다.
  • 금액 예치결제 시 금액은 예치만 됩니다. 작업을 승인하면 서비스에 지급됩니다.
  • 납품 전 검수모든 결과물은 전달되기 전에 품질 검수를 거치며, 승인하기 전에 주문 페이지에서 확인할 수 있습니다.
  • 무료 수정패키지에서 허용하는 횟수만큼 요청 사항 범위 내에서 수정을 요청할 수 있습니다.
  • 3일 후 자동 승인납품 후 3일 이내에 작업을 승인하거나 수정을 요청하지 않으면 자동으로 승인됩니다. 납품 후 주문 채팅에 메시지를 남기면 주문은 대기 상태가 됩니다. 저희가 답변한 뒤 3일을 다시 시작할 수 있으며, 이 경우 채팅으로 알려 드립니다.
  • 재작업 또는 전액 환불결과물이 요청 사항과 맞지 않고 수정으로도 해결되지 않았거나, 작업이 작업 기간의 두 배를 넘겨 지연되면 주문 채팅에 알려 주세요. 작업을 다시 하거나 결제 금액을 전액 환불해 드립니다.
이용 방법 →

질문과 답변

코드를 실행해 주시나요?

아니요. 코드를 꼼꼼히 읽고 어떻게 동작할지 분석하지만 실행하지는 않습니다. 제안된 수정 사항은 모두 직접 프로젝트에서 테스트해 주세요.

대신 운영 중인 페이지를 봐 주실 수 있나요?

코드 자체를 붙여 넣어 주세요. 보내 주신 내용을 리뷰하며, 사이트나 호스팅에 로그인하지는 않습니다.

여기서 React나 Vue 코드도 리뷰해 주시나요?

React 컴포넌트는 훅과 리렌더링에 집중한 별도의 리뷰가 있습니다. 이 서비스는 순수 JavaScript, jQuery, 작은 라이브러리에 가장 잘 맞습니다.

패키지
주문하기 · ₩50,500· 2일