단계별 수식 계산기

괄호와 사칙연산이 포함된 수식을 우선순위대로 계산하고 과정을 보여줍니다.

// about

도구 소개

(379*11900)+(75*20000)처럼 수식을 입력하세요. 곱셈·나눗셈을 먼저 계산한 뒤 덧셈·뺄셈을 적용하고 각 단계를 표시합니다.

사용 방법

  1. 숫자와 +, -, *, /, 괄호를 사용해 수식을 입력하세요.
  2. 수식 계산을 누르세요.
  3. 각 계산 단계와 최종 결과를 확인하세요.

이 도구를 찾는 이유

  • 기본 계산기로 어려운 긴 수식과 괄호 계산을 쉽게 처리합니다.
  • 중간 수식을 보여주어 계산 결과를 직접 검산할 수 있습니다.
  • 임의 코드를 실행하지 않고 사칙연산만 안전하게 계산합니다.
가이드 · 계산 · 4분 읽기

퍼센트 계산 총정리: 증감률, 퍼센트포인트, 할인 중복, 부가세 역산

매출이 몇 % 늘었는지, 할인가가 얼마인지, 금리가 오른 건 %인지 %p인지. 퍼센트 계산은 단순해 보이지만 기준을 헷갈리면 결과가 크게 달라집니다.

퍼센트(%)는 '100을 기준으로 한 비율'입니다. 모든 퍼센트 계산은 결국 '무엇을 기준(분모)으로 삼느냐'의 문제이며, 실무에서 쓰는 계산은 대부분 다음 네 가지로 정리됩니다.

① A의 B%는?          A × B ÷ 100           (80,000원의 15% = 12,000원)
② A는 B의 몇 %?      A ÷ B × 100           (12 ÷ 48 × 100 = 25%)
③ A에서 B로 증감률    (B − A) ÷ A × 100     (200 → 250 = 25% 증가)
④ B% 늘린(줄인) 값    A × (1 ± B ÷ 100)     (50,000원 20% 인상 = 60,000원)
퍼센트 계산의 네 가지 기본 공식, 퍼센트와 퍼센트포인트의 차이, 20% 할인 후 10% 추가 할인이 30%가 아닌 이유, 부가세 포함 금액에서 공급가를 구하는 법을 예시로 설명합니다.
가이드 읽기 →
AI로 직접 만들기

이 도구를 AI로 직접 만들어 보세요

나만의 버전이 필요하다면 아래 작업지시 프롬프트를 AI 채팅에 붙여 넣거나, 스킬 파일을 AI 코딩 에이전트에 저장하세요. 저희가 이 도구를 만들 때 정리한 기능, 예외 상황, 테스트 케이스가 그대로 담겨 있습니다.

AI 작업지시 프롬프트

Claude, ChatGPT, Gemini 같은 AI 채팅에 그대로 붙여 넣으세요.

당신은 숙련된 풀스택 웹 개발자입니다. 아래 요구사항에 맞춰 "단계별 수식 계산기" 웹 도구를 만들어 주세요.

## 목표

사칙연산과 괄호가 섞인 수식을 계산하고, 중간 단계를 보여 주는 계산기를 만든다.

## 핵심 기능

- +, −, ×, ÷, 괄호, 소수 지원
- 연산자 우선순위에 따른 단계별 풀이 표시
- 천 단위 쉼표 입력 허용
- 결과 복사
- 최근 계산 기록

## 입력

- 수식 문자열

## 출력

- 최종 결과
- 단계별 중간 결과 목록

## 예외 상황과 처리 규칙

- eval 같은 코드 실행 없이 직접 파서 구현
- 괄호 짝이 맞지 않으면 위치를 알려 주는 오류
- 0으로 나누기 처리
- 큰 수와 소수의 정밀도(10진 연산) 유지

## 구현 조건

- 서버 없이 브라우저에서 동작하는 단일 페이지(HTML, CSS, JavaScript)로 만들고, 입력 데이터를 외부로 전송하지 마세요.
- 모바일에서도 쓰기 편한 반응형 UI로 만들고, 입력 요소에는 레이블을 달아 키보드로도 조작할 수 있게 해 주세요.
- 결과에는 '복사' 버튼을 달고, 잘못된 입력에는 이해하기 쉬운 한국어 오류 메시지를 보여 주세요.
- 핵심 로직은 UI와 분리된 함수로 작성해 단위 테스트를 할 수 있게 해 주세요.

## 완료 기준 (테스트 케이스)

- (379*11900)+(75*20000) = 6010100이며 단계에 4510100과 1500000 포함
- 2+3*4 = 14
- 1/0은 오류 메시지

먼저 구현 계획을 5줄 이내로 설명한 다음 전체 코드를 작성하고, 마지막에 위 테스트 케이스를 확인하는 방법을 알려 주세요.

스킬 (SKILL.md)

Claude Code 같은 AI 코딩 에이전트에서 .claude/skills/build-expression-calculator/SKILL.md 경로로 저장하면, 이 도구를 만들거나 고칠 때마다 다시 쓸 수 있습니다.

---
name: build-expression-calculator
description: 단계별 수식 계산기 도구를 새로 만들거나 수정할 때 사용합니다. 사칙연산과 괄호가 섞인 수식을 계산하고, 중간 단계를 보여 주는 계산기를 만든다.
---

# 단계별 수식 계산기 만들기

## 목표

사칙연산과 괄호가 섞인 수식을 계산하고, 중간 단계를 보여 주는 계산기를 만든다.

## 작업 순서

1. 아래 필수 기능, 입력, 출력을 확인하고 빠진 정보가 있으면 먼저 질문합니다.
2. 핵심 로직을 UI와 분리된 순수 함수로 구현합니다.
3. 검증 목록의 테스트 케이스로 로직을 확인합니다.
4. 입력 폼, 결과 영역, 복사 버튼을 갖춘 반응형 UI를 만듭니다.
5. 규칙에 적힌 예외 상황을 하나씩 재현해 보고 오류 메시지를 다듬습니다.

## 핵심 기능

- +, −, ×, ÷, 괄호, 소수 지원
- 연산자 우선순위에 따른 단계별 풀이 표시
- 천 단위 쉼표 입력 허용
- 결과 복사
- 최근 계산 기록

## 입력

- 수식 문자열

## 출력

- 최종 결과
- 단계별 중간 결과 목록

## 규칙

- eval 같은 코드 실행 없이 직접 파서 구현
- 괄호 짝이 맞지 않으면 위치를 알려 주는 오류
- 0으로 나누기 처리
- 큰 수와 소수의 정밀도(10진 연산) 유지
- 서버 없이 브라우저에서 동작하는 단일 페이지(HTML, CSS, JavaScript)로 만들고, 입력 데이터를 외부로 전송하지 마세요.

## 검증

- [ ] (379*11900)+(75*20000) = 6010100이며 단계에 4510100과 1500000 포함
- [ ] 2+3*4 = 14
- [ ] 1/0은 오류 메시지

AI에게 맡길 때 팁

  • 첫 줄에 사용 중인 기술(예: React, Vue, 순수 HTML)을 적으면 프로젝트에 맞는 코드를 받을 수 있습니다.
  • 코드를 받기 전에 목록의 테스트 케이스를 실제로 실행하고 결과를 보여 달라고 요청하세요.
  • 실제 비밀번호, 고객 데이터, API 키는 프롬프트에 넣지 말고 예시 값으로 바꿔 쓰세요.